Hacking Guide of the ruby.wasm

とちぎRubyの勉強会 拡大版
https://toruby.connpass.com/event/286678/

ruby.wasmのどこをどう変えると何が変わるか？を説明した資料です。

参考資料へのリンク
- https://github.com/ruby/ruby.wasm
- https://github.com/ruby/ruby.wasm/pull/49
- https://github.com/ruby/ruby.wasm/pull/246
- https://qiita.com/ledsun/items/dacf789c787c7d192529
- https://qiita.com/ledsun/items/a6421a8c94aa653b42ea

Transcript

1. WA RB ruby.wasm ハッキングガイド 2023/08/05 ledsun (中島滋：株式会社ラグザイア) @とちぎRubyの勉強会 拡大版
2. ブラウザで Rubyをキメると 気持ちいい WA RB
3. ruby.wasmの どこをどう変えると 何が変わるか？ WA RB
4. ハッキングの •What（何が変わる） •Where（どこを変える） •How（どう変える） WA RB
5. ふたつの事例 •scriptタグのsrc属性 •JS::Object#newメソッド WA RB
6. 第一幕 WA RB
7. WA RB scriptタグのsrc属性
8. WA RB What
9. WA RB
10. WA RB 好きなファイル名が使える エディタでサポートされる
11. WA RB Where
12. WA RB ruby.wasmをつかうときのお決まり
13. WA RB ソースコードは
14. WA RB
15. WA RB ソースコードを読む前に
16. WA RB JavaScript RubyVM （JavaScriptのクラス） WebAssembly化された CRuby Ruby呼ぶときは必ず RubyVMクラスを通る （詳しくは https://qiita.com/ledsun/items/dacf789c787c7d192529 で）
17. WA RB
18. WA RB VMでevalでinnerHTML めちゃくちゃ怪しい
19. WA RB How
20. WA RB src属性に指定されている ファイルの中身を渡す （実際 https://github.com/ruby/ruby.wasm/pull/49 はそういう素朴な修正）
21. WA RB 本当にそうなのか？ 試すためにビルドしたい
22. WA RB これは抜粋です。 一から構築するビルド手順は CONTRIBUTING.mdにあります。
23. WA RB 動作確認 に Hello, World!のサンプルコードがあります。 これを改造して行うのが簡単です。 に のテストコードがあります。
24. Scriptタグのsrc属性 •Whaｔ：Rubyスクリプトファイルの名前 •Where： •How: の引数を変える WA RB
25. WA RB 第一幕 scriptタグのsrc属性 おわり
26. 幕間 WA RB
27. 第二幕 WA RB
28. WA RB JS::Object#newメソッド
29. WA RB What
30. WA RB Rubyスクリプトから JavaScriptのオブジェクトをつくるのに JavaScriptの文を実行しないといけない
31. WA RB newメソッドで JavaScriptのオブジェクトをつくる
32. WA RB Where
33. WA RB ソースコードを読む前に
34. WA RB Ruby スクリプト JS::Object （Rubyのクラス） JavaScriptの オブジェクト RubyからJavaScriptの オブジェクトをさわるときは JS::Objectクラスを通る （詳しくは https://qiita.com/ledsun/items/a6421a8c94aa653b42ea で）
35. WA RB JS::Objectに newメソッドを 定義すればよさそう
36. WA RB JS::Objectのソースコードは に
37. WA RB How
38. WA RB JavaScriptには がある 任意の関数からオブジェク トを生成する
39. WA RB を呼び出す メソッドを定義すればよい （実際に で定義しました。）
40. WA RB 本当にそうなのか？ 試すためにビルドしたい
41. WA RB やり方は もう知っています
42. WA RB
43. WA RB ざわ・・・ 反映されない！？
44. WA RB 第一幕で学んだことを 思い出して
45. WA RB JavaScript RubyVM （JavaScriptのクラス） WebAssembly化された CRuby ruby.wasmには JavaScriptの部分と Rubyの部分がある
46. WA RB JavaScript RubyVM （JavaScriptのクラス） WebAssembly化された CRuby は JavaScript部分をビルドする
47. WA RB JavaScript RubyVM （JavaScriptのクラス） WebAssembly化された CRuby Ruby部分をビルドするには して フルビルドする
48. WA RB フルビルドは 20分かかる
49. WA RB ユニットテストを つかおう テストコード内で JS::Objectにモンキーパッチをあてれば ビルドしなくて修正が試せる
50. WA RB JS::Objectの ユニットテストは
51. JS::Object#newメソッド •Whaｔ：JavaScriptのオブジェクトの生成 •Where： クラス •How: メソッドを定義 WA RB
52. WA RB 第二幕 JS::Object#newメソッド おわり
53. 幕間 WA RB
54. 終幕 WA RB
55. ふたつの事例 •scriptタグのsrc属性 •JS::Object#newメソッド WA RB
56. ハッキングの •What •Where •How WA RB
57. Scriptタグのsrc属性 •Whaｔ：Rubyスクリプトファイルの名前 •Where： •How: の引数を変える WA RB
58. JS::Object#newメソッド •Whaｔ：JavaScriptのオブジェクトの生成 •Where： クラス •How: メソッドを定義 WA RB
59. その他学んだこと • ruby.wasmにはRubyとJavaScriptの部分がある • JavaScript => Ruby の入り口はRubyVMクラス • Ruby => JavaScript の入り口はJS::Objectクラス • ビルドの方法 • サンプルコードの場所 • テストコードの場所 WA RB
60. WA RB さいごに 大事なことをもう一度
61. ブラウザで Rubyをキメると 気持ちいい WA RB
62. WA RB 提供 終