先読み処理を追加した
以前にNext の JS を全部抜いてしまったためにページ遷移時の先読み処理が無くなってしまっていた。
Next を使っていれば next/link の処理によって自動的に router.prefetch されるのでいい感じに先読みしてくれるのだが、このサイトではランタイムを抜いて非 SPA になっているので遷移時に初めて内容をロードするというのが少し気になっていた。
なので prefetch 用の web component を作って追加した。a[data-prefetch]
な要素に対して IntersectionObserver で intersect したときに prefetch link を生成するようにしている。
これは link タグによって先読みしているが、next だと router の処理でやっているので特に要素は追加されない。そして next のほうが state の json だけ読んでいるのでレンダリング後の html を読み込むより軽い。だったら普通に next で動かしたほうが良くない?的なところはある。