GatsbyからAstro（バージョン7）へ移行しました

Astro v7に移行

先日、本サイトをAstroに移行しました。

バージョンは6月にリリースされたばかりのAstroバージョン7です。

本サイトでは、事業を立ち上げた2020年からずっとGatsbyを使っていました。

いま過去のブログを読み返してみると、2021年11月にGatsbyのバージョンを3から4に上げたという記事があります。

しかしこのGatsby、2022年リリースのバージョン5で開発が止まっています。

そのため「このままGatsbyを使い続ける」という選択肢はなく、「移行しないといけないな」とはここ数年ずっと思っていました。

が、そこまで強いモチベーションも理由もなかったのも事実。

Gatsbyでも、そこまで危機的に困っていることがありませんでした。

「自サイトの刷新は優先順位が低い」という、よくある話です。

それでも困り事を挙げるとすれば、6年近く運用している中で、内部のコードがスパゲッティ化していたこと。

サイトデザインが一部古くなっていたこと。

そして、buildに時間がかかること。

Gatsbyに個人的な思い入れがあったことも、移行を先延ばししていた間接的な理由だったかもしれません。

初めてGatsbyを触ったときの、あのページ遷移のスピードは本当に感動的でした。

今でも印象深く残っています。

些細なことですが、記憶には些細なことが強く残るものです。

それでも、サイト内のブログ記事を大きく整理したことをきっかけに、Astroへの移行もすることにしました。

移行作業の大部分で使ったのがClaude Codeです。

私が知っていたのはAstro v5まで。v6がリリースされたのが今年の3月、そしてそれに触る間もなく6月にv7が出ました。

そこで、v7のドキュメントをClaude Codeに読み込ませ、出てきたコードをチェックしながら移行を進める、という形をとりました。

本サイトは静的サイトで、特に複雑なロジックもないので移行はすぐに済みました。

基礎部分の移行に1、2時間ほど、その後細かなチェックに数日、といった感じです。

AIツールで本当に開発の景色は変わったなと思います。

手間と時間が大きく短縮されました。

恩恵というほどの恩恵は感じていないのですが、それでも一番大きいのはbuild時間短縮です。

GatsbyではNetlifyでのbuildに4分半かかっていたのが、Astroに変えてみるとbuildが20秒になりました。

私のサイトは更新頻度も少ない単なる静的サイトなので、buildに時間がかかっても大きな問題ではなかったのですが、これほど短くなると、サイトを更新する時の妙な抵抗感は無くなります。

Gatsby時代は、記事の誤字脱字修正といった微調整・微修正をしても、その直後はbuildをしていませんでした。

そういう小さな修正がいくつか溜まってからbuildをかけていたのです。

しかし今は、どんなに小さな修正でも気楽にbuildをかけられるようになりました。

もうひとつ恩恵といえば、Lighthouseのスコア改善です。

Gatsby版では、ブログ記事ページにおいて、読み込み時と読み込み完了後で画像のレイアウトが変わってしまう問題がありました。

これはCumulative Layout Shift（CLS）の指標ではマイナスになるため、そこが修正されたこと、そしてサイトが全体的に軽量になったことがスコア改善につながりました。