[レベル: 上級]
AMP プロジェクトは、オリジンのサーバーから配信する AMP ページをさらに高速化する方法を公開しました。
AMP ページの表示はキャッシュほどには速くない
Google 検索をはじめ、AMP をサポートしている多くのプラットフォームでは、AMP ページそのものではなく CDN サーバーにキャッシュされたページを返します。
AMP の高速表示は、キャッシュを利用したときに最大限に発揮されます。
しかし、AMP ページ（の URL）に直接アクセスしたときは、CDN サーバーが保持しているキャッシュからではなくサイトをホストしているウェブサーバーから AMP ページ本体が返されます。
Twitter は AMP をサポートしていますが、キャッシュではなく AMP ページ本体を返すことに気付いている人もいるはずです。
AMP はそれ自身でも高速化のための技術が数多く採用しています。
ですが、直接配信したときは、キャッシュ配信ほどには速くはありません。
そこで、直接配信したときのチューニング方法のドキュメントを AMP プロジェクトは公開しました。
サーバー配信 AMP の最適化
サーバーから配信する AMP ページの最適化の手段としてドキュメントは次を提案しています。
- AMP ランタイムの最適化――AMP ランタイム（AMP が使う JavaScript）が他のリソースの読み込みをブロックしないように、
<head>セクション内の要素の順番を整えます。必要に応じて、link rel=preloadやlink rel=preconnect、link rel=dns-prefetchを設定して読み込みの優先度を上げます。 - 画像のプリロード――
link rel=preloadを用いて、重要な画像を優先読み込みさせます。 - Service Worker――Service Worker を構成してプリキャッシュ機能を利用します。
- カスタムフォントの最適化――（可能であれば）timeout を 0 に設定します。
preloadやpreconnect、dns-prefetchを必要に応じて設定します。 - サーバー サイド レンダリング――AMP でもサーバー サイド レンダリング (SSR) を使えます。AMP 用の SSR として AMP Optimizer というツールが提供されています。
このほか、一般的なウェブサイトでも実行できる次の高速化施策は AMP でも有効です。
これらの高速化チューニングした AMP ページは、キャッシュ配信には劣りますが、概して言えばパフォーマンス改善が確認できたとのことです。
AMP 頑張ってる人はぜひ挑戦してみてください。
公式ブログでの紹介記事はこちら、技術的なドキュメントはこちらになります。