12
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

【RubyKaigi2023】 初耳だったruby.wasmを簡単に触ってみる

Posted at

はじめに

RubyKaigi2023が2023年5月11日から13日の3日間で開催されていることを最終日に知ったため、午後以降のセッションにオンラインで参加しました。
参加した「Load gem from browser」というセッションでruby.wasmという言葉が初耳で気になったので、少し調べてみました!

ruby.wasmって何?

セッション中では、「ruby.wasmはrubyスクリプトをブラウザ上で動かすことができる技術」とお話しされていました。
ruby.wasmについては、ruby.wasmについて でも説明されています。

ruby.wasmを触ってみる

https://github.com/ruby/ruby.wasmを参考に↓のRubyコードが記載されたHTMLコードを作成し、ブラウザ上(chrome)で実行

index.html
<html>
  <script src="https://cdn.jsdelivr.net/npm/ruby-3_2-wasm-wasi@1.0.1/dist/browser.script.iife.js"></script>
  <script type="text/ruby">
    puts "Hello, world!"
    a = [1,2,3]
    b = [4,5,6]
    a.concat(b)
    puts a[0..1]
  </script>
</html>

ブラウザ画面上には表示されていませんが、ブラウザの開発者ツールで確認するとコンソールにHello, world!と配列の値が表示されていました。

image.png

おわりに

これまでブラウザ上ではjavasciptが実行されることは頭の中にありましたが、実際にruby.wasmを触ってみてRubyコードが実行されていたので非常に新しい発見でした。
また、Rubyの資格の勉強において、ruby.wasmを使用することにより開発環境を準備することなく気になったコードを叩いてメソッドの動きや実行結果を確認することができるようになっていいなと個人的に感じました。
今後、ruby.wasmを駆使してできることが増えいくと思いますので、自分も少しずつ触っていければと思います。

おまけ

今回参加したセッションは英語と日本語が使用されていて、英語に慣れるとさらにキャッチできる情報が増えるなと思い、英語ドキュメントもしっかり読んで力をつけていきたいと思いました。(そもそも日本語だったとしても自分のスキル不足で理解できない部分も多々ありましたが泣)
また、今回RubyKaigiに初めて参加して、Rubyに関する様々な情報をキャッチできる非常に有意義な場だと感じました!今回は最終日の午後のみの参加でしたが、次回開催される際は可能であれば初日から参加したいと思いました!

参考文献

12
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
12
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?