Hugo 的語法高亮 syntax highlighting

程式區塊很重的網站就會更加在意語法高亮的品質，在 Hugo 中語法高亮有以下幾個選項可完成：

1. 使用內建的 Chroma：缺點是語法偵測很爛亂標一通，不過仍然比 Prism.js 好
2. 客戶端 JS 渲染：使用 highlight.js/prism.js，網路上教學很多，不推薦，因為拖累客戶端的效能。
3. Shiki：shiki 是伺服器端渲染，完全沒有客戶端效能問題，而且 shiki 採用 VS Code 引擎因此更正確。整合方式請參考使用 Hugo 的 Shiki 開發者寫的文章

我的建議是這樣：

1. 正確的 Chroma 無閃爍的亮暗模式切換、無 JS 環境都支援載入的方案請見此 PR，這是最適合 Hugo 生態系，自定義最輕鬆，負擔最低最不需要手動維護的方式
2. 除非特殊需求否則不要自己搞 shiki，請等哪天官方支援
3. Shiki 基於 TextMate，這已經被回報不夠準確¹²，我認為花力氣換到不夠好的替代品不值得
4. Shiki 會比 Chroma 好是因為 Chroma 太爛，但是 Chroma 又還沒有爛到足夠彌補使用 Shiki 的維護負擔 + 糟糕預覽體驗

Footnotes

1. https://github.com/microsoft/vscode/issues/50140 ↩

2. https://www.mail-archive.com/dev@netbeans.apache.org/msg09401.html ↩