Service Worker Side React Server Side Rendering
ServiceWorker内でBabelを駆使して、JavaScriptをビルドする - ログミーTech(テック)
ってスライドの中で、React の SSR を Service Worker の中でやれば、SEO は死んじゃうけど First Meaningful Paint 最適化できるよねーっていう話をしました。
というわけで実装してみました。すごく単純な React + Redux の Counter です。
ここで試せる https://epic-cray-a9cff8.netlify.com
実装コード https://github.com/mizchi-sandbox/swsrssr
DevTools 見る限り、 FMP が 8ms で返ってます。TTI (JSが動くようになる時間) は JSの評価が終わる 150ms ぐらい。 ただ、ネットワーク全く使わないかわりに、処理速度が完全にCPU依存なので、モバイルだとここまではならないとは思います。
これはブラウザの標準的なフレームレートの16ms未満なので、リロードしたことをほぼ認識できない速度です。
この路線がありか、まだわからないけど、夢がありますね。やはり SW 用の express emulator 作ったほうがいい気がする。