JavaScriptエンジンから見るランタイム
ランタイム
- 近年ランタイムが増えてきた
- Cloudflare WorkersとかBunとかWinterJSとか
エンジンとランタイム
- エンジンは言語処理系
- v8とか
- ブラウザ搭載のものは巨大
- JITが必要
- sandboxが必要
- ブラウザ非搭載の後発は軽量
- ランタイムは実行環境
- NodeとかChromeとか
- ランタイムがエンジンを埋め込んでいる
- ラナンタイム側でカスタマイズしたりもする
令和最新静的サイトジェネレーター事情
SSGの背景
JS関連のSSG
- Hexo
- Gatsby
- Reactベース
- GrahpQL
- プラグイン
- incremental buildsでビルド効率化
- Netlifyの子会社
- 最近止まってるらしい
- 11ty
- マークダウン置いて設定なしでビルドできる
- いろんなjsテンプレートで書ける
- 混み入った設定は難しい
- Docusaurus
- Reactベース
- meta製
- VitePressのReact版
- 最近のFWは代替SSGできちゃう
- Next
- Nuxt
- Angular
- Astro
- ...
require(ESM)とECMAScript仕様
require(ESM)
- ESモジュールをcjsで読み込めるようになる
復習
- JSは2つに分類される
- script
- cjs
<script>
- module
- mjd
<script type="module">
- script
- モジュールは3分類される
- Abstract/Cyclick/SourceText
require(ESM)の使用上の解釈
- 4段階を順番に実行していく
- Promiseを返すフェーズがある
- そこをどうやって同期的にしてるか
- Evaluateは最初からPromiseを解決済み
- これも前提を満たせばPromiseが最初から解決されている
- ECMAScriptの仕様とは矛盾せずに対応できている
The Fall of React Native Bridge
- Naturalclarさん
- https://slide-react-native-bridge.vercel.app/
ReactNativeの仕組み(Before)
- objective-c/JavaからJSを呼び出すためにBridgeという仕組みがあった
- Request/ResponseをJSONで非同期にやり取り
- JSとNativeはBridgeで完全に分離されていた
Bridgeの問題
- 非同期なので描画が遅い
- アプリ起動の負荷が高い
- 処理の優先順位設定できない
React Native New Architecture
- 2018のReact Confで発表
- Bridgeを介さずにやり取り
- Facebookのアプリは置き換わっている
ReactNativeの仕組み(After)
- JSI
- JavaScript Interface
- JSからc++のメソッドを実行したりその逆も
- Hermes
- ReactNative Codegen
- Turbo Modules
- ネイティブのモジュールを実行する仕組み
- NativeのコードをJSI経由で呼び出す
- Fabrics Renderer
- 描画を同期的にできる
- これらによってBridgeが不要になった
Fast JSX: Don't clone props object #28768
JSXの高速化
- React19になっての話
- propsのクローンが不要になった
- keyとrefの予約語を消す必要がなくなった
- forwardRefが要らなくなる
- keyはスプレッド構文を使わなければ問題なし
- createElementが使われなくなった
- jsxという関数が変わりに使われるようになる
- jsxならユーザによるpropsの上書きができなくなった
JavaScriptCoreのObject.groupBy/Map.groupByのバグを自分で報告して自分で直す
- sosukesuzukiさん
- https://speakerdeck.com/sosukesuzuki/javascriptcoreno-object-dot-groupby-map-dot-groupby-no-hakuwozi-fen-tebao-gao-sitezi-fen-tezhi-su
Object.groupBy/Map.groupBy
- ES2024から入った
- 条件に応じてグルーピングできる
- 配列やマップで振り分けられる
- 配列だけじゃなくてイテラブルならOK
JSCのgroupByの実装
- objectじゃなかったらTypeError投げてた
- イテラブルなものもエラーにしてていいのか
- stringはどうなのか
- バグ報告して直した
- 修正してPR出した
- test262へのテスト追加もした
