JS Conf JP

可児 潤也

可児 潤也

株式会社リクルートにてフロントエンドエンジニアに従事。 Web 開発リードを担当。

AMP キャッシュを超えるシステムを自社ドメインで実現する方法

11/27/2021, 14:30 - 15:00
Track B
Spoken language: ja
Slide language: ja

(Untranslated) ・AMP は、Web Components を用いるためのライブラリとしての側面と Google 独自のキャッシュ配信基盤としての側面を持っている。 ・AMP の提供している Web Components は高速で UX も問題ない。 ・AMP キャッシュは検索結果の時点で HTML をプリフェッチできる利点がある。 ・しかし AMP キャッシュはドメインが Google になるという欠点がある。 ・各種アナリティクスツールの計測観点ではドメインが変わることで必要なマーケティングが行えない。 ・そこで、AMP をライブラリとしてのみ活用し、AMP キャッシュに替わるキャッシュシステムを自分たちで実装して実現した。 ・fastly の CDN を配置し AMP キャッシュと同様の SWR キャッシュを採用した。 ・そして Google Bot が AMP ページをあらかじめキャッシュするように、キャッシュを温めるための自サイト向けクローラを用意した。 ・AMP はライブラリとして使いつつ AMP valid にはさせないよう Next.js や AMP のバリデータに独自の使い方を適用させた。 ・開発体験を充実させるために Next.js x TypeScript x AMP の組み合わせを実現した。 ・さらに SXG キャッシュで検索結果からのプリフェッチも実現した。