Supporting AMP for Hugo templates
Istio v0.8がリリースされたので更新内容についての記事を書こうとしていたら，いつのまにかテンプレートのAMP対応をしていた．
作業の流れ
- ざっと公式ページを見る
- ひたすら使えないタグやjsをampに対応したものに置き換える
- chromeのアドレスバーに#development=1を追加してconsoleにvalidation errorが出ていないかチェック
- ひたすら直す
変えたポイント
- amp用の識別子たちを追加
- cssファイルをconvertしてhtmlに吐き出し
- jsを全て取り払う
- hilightjsはgist pluginに変更
- menuはsidebar, accordion pluginに変更
- jump to top buttonはanimation, position pluginに変更
- disqusをiframeに変更 (まだ表示されない原因が分からない
- imgタグをamp-imgに変換
所感
テンプレは3つだけなので，思っていたよりは楽だった．しかしページ数が多かったり，jsを使ったスタイリッシュなサイトは辛そうだなという感じ．表示は以前より大幅に早くなったのでしあわせ．ページごとのmeta情報の生成は面倒でやっていない．
references
.