ふくいのふ ふくいのふ ふくいのふ

ふくいのふ

WEB ENGINEER

Firebase Hosting で Stale-While-Revalidate できちゃう !?

Firebase Hosting で Stale-While-Revalidate できちゃう !?

Incremental Static Regenerationって凄いけどさ


stale-while-revalidate対応のCDNでISRと同じような挙動を実現する

Next.jsのISRはstale-while-revalidateというキャッシュコントロールの考え方に基づいています。これはキャッシュが古くなった後も、次のリクエストではとりあえず古いキャッシュを返し、裏で非同期にキャッシュを更新するという考え方です。


次世代のサーバーアキテクチャとも言われる Next.js の ISR (Incremental Static Regeneration) ですが、これは Stale-While-Revalidate (SWR) という、キャッシュ戦略の考え方が根幹になっています。

基本的に Next.js の ISR は、その開発元である Vercel が所有するインフラに載せる前提のものですが、何らかの理由で Vercel 以外で動かしたい場合、(サーバー側の)ローカルキャッシュの取り扱い、特にコンテナ運用時のオートスケールに苦労することから、SSR モードで動かして SWR 対応した CDN を被せるのが現実的でしょう。

SWR 対応している CDN として有名なものは Fastly, Cloudflare, 等が挙げられますが、まぁそれなりにお金かかったり、肝心の非同期キャッシュ更新に対応してなかったり、最小キャッシュ時間が長かったりと、なかなか個人運用する範疇ではバチっとくるものが有りませんでした。


出典:Which CDN providers support stale-while-revalidate?

なんかFirebase Hostingでもいけるらしい




ところが最近拝見したこちらのツイートで、なんと Firebase Hosting が Stale-While-Revalidate に対応しているとの情報がありました。
確かに Firebase Hosting の CDN は Fastly だとか言われてるので、行けそうな気がします。
Firebase Hosting は静的なコンテンツだけでなく、Cloud Run や Cloud Functions へリライトしてSSRしたコンテンツも提供できるので(もちろん設定で CDN キャッシュも効く)、ひょっとするとこれは・・・

検証環境建ててみた


えってなったので早速自分でも検証環境建ててみました ↓

https://swr-test.web.app/

Nuxt.js (SSR) + Cloud Run + Firebase Hosting ですが、確かにちゃんと動いてるような感じします。
おまけに Firebase Hosting は非公式ながらURL別にキャッシュも消せるので、場面によっては Vercel よりも使いやすいかもしれません。
ただAPIキー無しで消せるので第三者に全消しされちゃう可能性ありますけどね。

つまり


別に Next.js じゃなくても良いので SSR サーバーさえ建てられれば、ISRっぽいことができます。
検証環境では Nuxt.js ですし、モノリシックな WordPress だっていいわけですね。

ただし


未だドキュメントに記載がない機能なので、何時削られてもおかしくないですね〜



ところで




いや1年前に思いついてるやんけ
なんで試さへんねん
そういうとこやで

めでたしめでたし

© 2019 ふくい
ToTop