blog.bouzuya.net

2016-12-06 bouzuya/mr-jums の SSR をつくった

bouzuya/mr-jums に SSR: server-side rendering を追加した。

bouzuya/mr-jums は bbn: blog.bouzuya.net の 4.x の HTML を生成するものだ。 Cycle.js v7 で書かれている。

今回の SSR 実装の目的は過去の記事を参照しやすくすることだ。ほかにもいろいろな利点はあるのだけど、主目的はそこにある。今回の対応で /2016/01/02/ のような URL への直接の request にも適切な response を返せるようになった。 CSR: client-side rendering のみだと /2016/01/02/ のような個別の記事に request すると 404 が返される。これは URL の問題でもある。 CSR のみなら History API を前提とした URL を捨てて #! ありの URL にすればいい。ぼくは #! に妥協するつもりはない。 History API なしの環境に対応する気はさらさらないからだ。あとは月別の記事を表示することでも、目的を達成できそうだが、それはまた別の機会にする。

Cycle.js v7 が想定している SSR がよく分からない。examples/ にある isomorphic の実装 にある。request ごとに pipe chain を構築して makeHTMLDriver(callback)callback に渡される html を response として返している。

ぼくには request ごとに pipe chain を構築する意味が分からない。起動時に pipe chain を構築して、そこに request を流すのが自然だろう。なぜそういうつくりを目指さないのか。makeHTMLDriver() を driver としてふさわしいものとはとても思えない。vnode$: Observable<VNode>html$: Observable<string> に変換することのどこが副作用なんだ?  subscribe も要らないぞ? そういうわけで Cycle.js 案は却下した。とりあえず snabbdom/snabbdom-to-htmlVNodestring に変換した。もうすこし Cycle.js に近い形へ変えることもできるが、とりあえず見れるようにした。これで妻も喜ぶ。

とりあえずの実装なのでいろいろあらがある。SPA における SSR は実態としては初期化処理だ。 URL に応じた SPA の初期状態で配布することにある。初期化処理としての部分をもうすこしきれいに切り出さないといけないし、考慮不足の点も多い。

追記: Cycle.js の SSR については 2016-02-03 で既に不満を書いていた。