next.js の AMP mode を使って静的サイトを作る

この記事は amdxg を作りながら, next.js で AMP に対応したときにやったことです。 コードはこちらです amdx/packages/ssg at master · mizchi/amdx AMP について Google の推奨する HTML のサブセット仕様です。制約付きのインライン CSS のみ + 一切の JS が書けず、代わりに動きがあるものは amp plugin を使って記述します。 モバイルでは、Google の検索結果画面からは GoogleCDN 上のキャッシュが返却されるので、非常に高速に開くことができます。 (⚡ マークが AMP 対応の印) モバイルに限らず、ある種のベストプラクティスの強制なので、PC でも AMP 対応することに意味はあります。 この記事では、実際にこのブログのための SSG を作る過程で、どのように next.js 上で AMP

[hiro14aki]

ちょうど Next.js の SSG を試してたところだったので参考になる。

[k2wanko]

ampは縛りプレイでスコアが上がるゲームのよう

[hiroomi]

"WebWorker 環境に指定要素の DOM の仮想的なオブジェクトを生成して、それを操作することで、DOM に反映させる"

[mizchi]

書いた。next.js の AMP 対応と、それを使って静的サイト(ジェネレータ)を作ってる話