QwikというReactに似た書き方で開発できるMPAフレームワークのお話を聞いたので自分でも調べてみる
この前読んだJackさんの記事でもそうだが、いまのSPAには色々課題がある
NavigationAPIはその課題の解決策の一つであるが uga-box.hatenablog.com
そもそもなんでもかんでもSPAにするなという記事もあったりして、今後もMPA（従来のページ遷移）を採用する可能性は十分ある
ただ、MPAにはもともとの問題（サーバーサイドテンプレートとの二重開発など）があったりするので、こっちはこっちで解決しなければならない
そんな中、MPAであるがテンプレートもイベントハンドラもJavaScriptでやるという思想のフレームワークが登場してきているみたい
- Marko
- Astro
- Qwik
Qwikそのうちの一つ
vs ハイドレーション
いまのReact SSRにおけるハイドレーションはレンダリングが２回（SSR時とCSR時の２回）やることになるので無駄が多い
レンダリングを２回やらなければならない主な理由はイベントハンドラの復元で、SSRしたときではイベントハンドラが実行できないので、実行できるようにするためCSRが必要になる
これをしないようにするのがQwikのモチベーション
ソリューション
これを解決するため、イベントハンドラの状態をSSR時にHTMLにシリアライズしておいて、クライアントサイドでデシリアライズして復元しようというのがQwikのソリューションとのこと
シリアライズについて ↓
https://qwik.builder.io/guide/serialization/overview
具体的に一番わかりやすいのがJSON.stringifyだが、これだけではできないことがあるので、そこをQwikが補う
例えば
ただ、Qwikでもできないことがあるので、そこを理解しながら開発するのが必要とのこと
例えば以下のことは解決できないと書いてある
- Serialization of classes (instanceof and prototype)
- Serialization of Promises, Streams, etc...
あとは、イベントに必要なJavaScriptのダウンロードをイベントが実行されるまで遅らせる（Fine-grained Lazy-Loading）などの仕組みがあるみたい
聞いたお話によると、イベント発生からイベント実行までが環境によっては遅いかもとのことで、まだまだ改善の余地がありそう
