Next.jsのホスティング先としてFirebaseは『かなりアリ』な選択肢になっている
Next.jsのホスティング先といえば、Vercelという認識は結構多くの人の中での共通認識になりつつあると思う。実際にVercelは特に難しいことをする必要もなく、また月額＄20の課金（Proプラン）でのできる範囲はかなり広いと思う。
私も普段作っているサービスのDeploy先の1つとしてVercelを持っているが、今回はFirebaseもかなり良いと言う話をしていきたいと思う。
2022年5月、FirebaseHostingがNext.jsに対応した
実はGoogleI/Oの中で、こっそりとFirebaseHostingがNext.jsに対応していたのだ
GoogleI/Oの記事はこちら
厳密には、Next.jsのプロジェクトを
FirebaseHosting+FirebaseFuncitons(裏側でゴニョゴニョやってくれて第二世代のFunctionsにdeployされている)にfirebase deployできるようになったということだ
詳しくは以下のgithubを参考にすると良いだろう
firebase --open-sesame frameworkawareness
上記コマンドを打つだけで、firebase deploy が進化して、特に難しいこと(build周りをいじるとか)をする必要なく、シンプルにvercelのように使えるようになったって話だ。
Next.jsだけでなく、Angularも同じようにdeployできるようになったみたいだ。
注意点
- firebase cliのバージョンを10.9.1より上のバージョンにする必要がある
- SSRを使うにはFirebaseを Blazeプランにする必要がある
Firebaseの強み
Firebaseの強みを語るならば、圧倒的なコストの低さがあると思う。Vercelもとても魅力的なのだが、Proプランの範囲を超えるトラフィックになるとVercelは結構な値上がりをする。一方でFirebaseはどんだけスケールしてもコストは一定、しかも安価であるという点が魅力だ
旧式のやり方・落とし穴
ネットでいろいろな記事を調べていると、Next.jsのdeploy先にfunctionsをよしなに頑張ってやるみたいな記事が出てくると思う。それは、2022年5月までのやり方で、実際に両方を試してみるとわかるのだが
私は『かなりパフォーマンスに差が出ている』ように感じた。
旧式のやり方でやるくらいなら少しコストがかかっても・リスクがあってもVercelでやった方が良い、あるいは開発コストをかけてCloudRunなどでやった方が良いと言うふうに思っている。
今回紹介したやり方であれば、パフォーマンスにもあまり問題がないように思う。ISRなどを意識すればもっとパフォーマンスは改善できると思うので興味のある人は試してみると良いかもしれない。
Discussion