こんにちは！今日は前回の続き、ブログをNuxt.js+ContentfulからHugoに移行した話です。

前回はNuxtとContentfulの悪口課題を書いたので、今回はHugoにしてみた良かったことと悪かったこと、特徴などを書きますわ。

良かったこと

テンプレートが出来上がっている

基本Webアプリ用のNuxtと違って、Hugoは最初からブログ用。テンプレートが出来上がってる。 デザイン度外視でブログとして成り立たせるだけなら30分かからんとです。

このブログが移行した時も、とりあえず記事だけ持ってきてスタイルを後から変更…みたいな手順がとれました。

ビルド爆速

ビルド時間なんて別に重視してなかったけど、いやHugo早すぎ。1秒かかる処理が皆無。Golangすごい。

実際Nuxtで20秒くらいかかる時と比べて、コード書く→画面で確認、とかのスピードが爆上げになった。

MPAなのに早い

HugoはMPAです。ページ遷移で再描画します…が、懸念されていたレンダリングの遅さは皆無。 まあStatic Siteだからこんなもんでしょうか？初回読み込み時はNuxtより早いかも。

MPAの恩恵受けられる

Google AndsenseとOGPに関しては一瞬で終了。尤も、これらは完全にMPAを意識した技術だからまあ当たり前ね。

AMPにできる

AMP化が比較的楽。AMP化はStatic Site Generatorの中でもHugoがかなり楽な部類じゃないでしょうか？ Nuxtから移行する際StaticGenとか見ながら移行先精査しましたが、 AMP化のテーマが揃ってて一番早くできたのがHugoでした。

ちなみにテーマはhugo_robustってのを使ってます。 最初からAMP対応:)

安くなった

SSRとかPrerenderingとか考えなくてよくなったので、Netlifyで普通にホスティングできるようになったぶん安くなりました。

悪かったこと

小回りが利かない

一番はこれかも。本当に細かいところを調整しようとするとHugoとGolangの知識がないときつい。

例えばタグが全部表示になっているのを最初の1つだけ表示…みたいなのはNuxtなら3秒だけどHugoだとわかんない。 JSerの自分には辛い…逆にGolang分かるなら大丈夫かもだけど、Hugo独自の構文とかもあるっぽい…

AMPでページネーションできない

これはこちらの回答を見る限り、 技術的な制約かもしれません…

現在は記事数が知れてるから大丈夫だけど、後々大変かも。

モダンフロントエンドと相性悪い

具体的にはPugやCSSプリプロセッサーの導入がむずい。この辺りもNuxtなら3秒。 これはでも色々いじればできるかもしれん。46億年ぶりにバニラCSSを書いた。

他のStatic Site Generator と比べて

Jekyll

Jekyllは人口多かったり資料たくさんだったりGithub PagesがサポートしてたりでStatic Site Generatorとしては ベターなチョイスだと思います。

ちょっと全体的にレガシーっぽかったのと他ブログとかでJekyll→Hugoの移行勢がたくさんいたのと遅いって意見が散見されたので今回は不採用でした。 あとAMP対応がさっと見つけられなかった。

Hexo

Hexoも選択肢にあった。一時はHexo使う予定でした。HexoにもAMP対応化プラグインはこういうのがあります。

一方で、Hexoは非AMPのテーマ+AMP化プラグインっていう構成が主っぽく単体テーマでAMPは難しそうだったのがちょっと引っかかった。 中身がNode.jsなのでHugoよりは小回り利きそうだったけど最終的にはシンプルさを取ってHugoを選択。最後まで迷った。

Next.js

Nuxt.jsで抱えてた問題が直に来そうだったので除外。OGPとかブログ雛形ないとか。

Gatsby.js

多分作っちゃえばGatsbyがベストチョイス。ただ学習コストがヤバそうだった。このブログがめっちゃ盛り上がったら移行するかも。

VuePress

Nuxt.jsから移行するなら正直こっちの方が良かったかもと思い始めてる。Nuxtでよくね？と思ったけど、 NuxtはWebアプリ、VuePressはWebサイトと棲み分けができてるみたい。

ちょっとまだ新しすぎるし資料少ないと思って敬遠したけど全然ありそう。ただVuePressもブログ専用ってわけじゃないのね。「ドキュメント用」みたいな。

おわりに

しばらくHugoにお世話になります。よろしくなHugo