今回はDenoが出していた記事を軸にWebのレンダリング方式がSSRになっていくかもねぇという話をしました
00:00 OP
00:30 今回のテーマ
06:53 isomorphic javascriptと各フレームワーク
24:51 universal javascriptとそれにまつわる視点
32:39 クロージングと次回予告
[参考] https://deno.com/blog/the-future-and-past-is-server-side-rendering
## 記事の概要
- Deno から Web の過去と未来は Server Side Rendering というタイトルの記事が公開
- 記事の序盤には、これまでの Web アプリケーションの歴史が紹介
- PHP による SSR の例
- 動的な部分はテンプレートエンジンを使ってサーバーサイド側でレンダリングしてた
- ブラウザや JavaScript の機能が拡充したことで、SPA や CSR の流れに
- さらに Web が成熟してきたことで、さまざまなデバイスや帯域幅でアクセスされるようになってきた
- デバイスのスペックや不安定な回線でアクセスされる状況といった状況の中で一貫したユーザー体験を提供するには SSR なのでは
- SSR をサポートする Isomorphic JavaScript なフレームワークが存在する
- Isomorphic JavaScript はクライアント・サーバーサイド両方で JS が実行されるアプリケーション
- Isomorphic JavaScript フレームワークとして Next.js や Remix が挙げられてる
- 昔の SSR との違いでもありそう
- Deno が気に入ってるアプローチは Islands Architecture
- 実際に Deno の Web フレームワークである Fresh が採用している
- 静的な部分はサーバーサイド側で HTML をレンダリングし、動的な部分だけハイドレートする
- HTML のレンダリングはサーバーサイドで行い、その後、イベントハンドラーを HTML 要素にアタッチ
- Deno の場合は Fresh と Deno Deploy でできる
- なるべくクライアントサイド側の JS を減らす機能は各フレームワークから提供されてそう
- [Next.js Server and Client Components](https://beta.nextjs.org/docs/rendering/server-and-client-components)
- SSR がベースな Remix や Qwik
- [Qwik ではユーザーの操作が行われてから JS をダウンロードして実行する Resumable というアプローチ](https://qwik.builder.io/docs/concepts/resumable/)
- [SolidJS も Isomorphic な機能を備えてる](https://www.solidjs.com/guides/server#%E3%82%B5%E3%83%BC%E3%83%90%E3%83%BC%E3%82%B5%E3%82%A4%E3%83%89%E3%83%AC%E3%83%B3%E3%83%80%E3%83%AA%E3%83%B3%E3%82%B0)
- Cloudflare や Deno Deploy、Vercel、netlify、など Edge 上で JS が実行(SSR)できる選択肢が増えた