2023-05-22

個人サイトをRustで書き直した

NextJSで書いていたものを結局Rustで書き直した。この時は普通にgetStaticPaths, getStaticProps内でfsモジュールを使えばいいところを、何故かWebpackでMarkdownを読み込んでいたがこれが無くてもNextJS(というよりはVercel)でのビルドには問題があった。Vercelの ビルド環境ではGitの履歴が上手く取得出来ないため事前にメタデータをスクリプトで生成する必要があった。Vercelで完結しない以上もうGHAとかでビルドしても良い気がした。

またmdastからReactでHTMLを生成するのもあまり筋が良くない。mdastはただのastなのでReactのkeyに相当するものはない。適当にsha256を取ってお茶を濁していたが、keyとして全く機能していなかった。どうせ全部静的に生成するのでkeyとして機能しなくても問題はないのだが、ちょっと気持ち悪い。

またそもそも短い静的なコンテンツなのだから生HTMLでも十分早いだろうしわざわざNextJSを使うこともないだろう、とRustでの静的生成に変更した。

ただ切り替えたサイトにアクセスしてみるとかなり遅くなってしまっていたので後でちょっと手を加える必要があるかもしれない。

シンタックスハイライト

最初はsyntectを使っていたが、途中で変えてtree-sitterでのハイライトを行うtree-sitter-highlightクレートを使った。ただこのクレートはsyntectのように行単位でのハイライトは行わず、ネストしたネストした構造を作るのでCSSを使った行番号の表示はちょっと難しい。 後で実装するつもりでいる。

デプロイ

Cloudflare pagesを使った。出た頃はGitでのデプロイしか出来ず使いづらかったが今はAPI経由でアップロードが可能で、wranglerを使えば簡単に出来る。 ちょっとデプロイに時間がかかるのが難点だが簡単にデプロイ出来て嬉しい。

TODO

  • Gitによる履歴

  • 画像最適化

  • ページ遷移最適化

  • コードスニペットのコピーボタン