Rubyをブラウザで動かせるようになったらしいです
日々Rubyを書いているエンジニアとしてはHello Worldぐらいはやってみたいので実行してみました
こちらのExampleを参考にやってみます
Hello Wasm
ブラウザのコンソールにHello, Wasmと表示してみます
hello_wasm.html
<html>
<script src="https://cdn.jsdelivr.net/npm/ruby-head-wasm-wasi@0.5.0/dist/browser.script.iife.js"></script>
<script type="text/ruby">
puts "Hello, Wasm!"
</script>
</html>
動きました!!!
DOM操作
DOM操作をやってみます
formに入力された値を受け取ってそのまま表示してみます
hello_wasm.html
<html>
<script src="https://cdn.jsdelivr.net/npm/ruby-head-wasm-wasi@0.5.0/dist/browser.script.iife.js"></script>
<input id="input" type="text">
<div id="result"></div>
<script type="text/ruby">
require "js"
document = JS.global[:document]
input = document.getElementById 'input'
result = document.getElementById 'result'
input.addEventListener 'change' do |e|
result[:innerText] = e[:target][:value]
end
</script>
</html>
JSのAPIをRubyから利用しているみたいですね!
実行してみます
表示されましたね
まとめ
Quick Exampleを動かしてみただけで複雑なことは何もやらなかったですが、ブラウザ上でRubyの実行をできるのがシンプルに面白いですね
今後どうなっていくのか、非常に楽しみです