
Gatsby v4にアップデートしました
2021.11.20
この記事は約3分で読めます

筆者:三好アキ(専門用語なしでプログラミング)
▶︎ 三好アキの著書一覧はこちら
すぐにリリースされたGatsby v4
先日のGatsby v4のリリースに合わせて、本サイトもv3からv4にアップデートしました。
今回のv4のリリースはとても早く、v3から半年ほどしか経っていません。
v2(2018年9月リリース)からv3(2021年3月リリース)までにおよそ3年ちかくあったので、特にそう感じます。
Gatsby v4の特徴
今回のv4の特徴は次の3つです。
• SSR (Server Side Rendering)
• Parallel query running
• DSG (Deferred Static Generation)
これまでSSG(Static Site Generation)として主に使われていたGatsbyにも、SSR(Server Side Rendering)がついに導入されました。
これはGatsbyがさまざまなところで使われ、SSGだけでは対応できない場面が見えてきたためでしょう。
SSG以外のParallel query runningとDeferred Static Generationはビルドを高速化する仕組みで、これでさらにビルド時間が短縮されます。
とはいえ全体的には、v3リリース時のような大きな変更はなかったのが個人的な印象です。
Gatsby v3からv4への移行
v3リリース時には画像を扱うgatsby-imageがgatsby-plugin-imageへと変わり、それに合わせてコード変更を行う必要がありました。
今回は、当サイトのようにシンプルな静的サイトとしてGatsbyを使っており、かつv3にすでに移行しているのであれば、v4へのアップデートはスムーズに進むと思います。
当サイトもgatsby-cliや各パッケージのアップデートだけでv4移行は完了しました。
Gatsby v4移行のメリット
v3移行時にもビルド時間は明らかに短くなっていましたが、v4移行後はさらにビルド時間が短くなりました。
目に見えるような恩恵は、今のところこのあたりくらいかと思います。
このように速いペースでアップデートが行われると、過去のバージョンのGatsbyサイトをどうしていくのかという、長期的なメンテナンスの課題も感じます。
Gatsbyに興味のある人は次の記事も参考にしてください。

✤ 筆者 ✤
三好アキ(専門用語なしでプログラミング)
「専門用語なし」のメソッドで1,200人以上のビギナーをフロントエンド開発入門に成功させる。翔泳社『動かして学ぶ!Next.js/React開発入門』(韓国でも出版)など著書25冊以上。Amazonベストセラー1位複数回獲得。
React、Next.js、TypeScriptなどの最新情報や初心者向けコンテンツを、無料メルマガ配信中。メールアドレスだけで登録可 ▶︎ 無料メルマガ登録