SSRした動的コンテンツをFastlyにキャッシュする

Transcript

1. SSRした動的コンテンツをFastlyにキャッシュする SPACEMARKETトップページの事例 2019年4月16日 KAKINOKI DAISHI
2. 2 誰？ • KAKINOKI DAISHI(@d_kakinoki) • SPACEMARKET所属 • Engineering Manager • サーバサイドがメイン • 今後Fastlyでやりたいこと ◦ A/B Testing
3. 3 SPACEMARKET？ スペースを 借りたい人 (ゲスト) スペースを 貸したい人 (ホスト) 探す・借りる 掲載する・貸す
4. 写真
5. 写真
6. 写真
7. 7 SSRした動的コンテンツをキャッシュする
8. 8 Fastlyでトップページをキャッシュするまでの背景(2018年夏) • 既にアセットはFastly経由で配信 • 2018年11~12月にかけて全国CM放映を予定 →負荷対策、速度の改善が必要 →裏も対策するが、表も対策しておきたい →アクセスが集中するトップページをキャッシュ • 必要に応じてすぐにパージ • とりあえずシンプルに
9. 9 トップページの何をキャッシュするか バナー ヘッダ(未ログイン状態) アイキャッチ カテゴリのランキング など フッタ 未ログインコンテンツをキャッ シュ バナー ヘッダ(ログイン状態) アイキャッチ カテゴリのランキングな ど フッタ 閲覧履歴 お気に入り クライアントで ログインコンテンツを取得し レンダリング
10. 10 以前(イメージ)
11. 11 Fastlyでキャッシュ(イメージ) 有効なキャッシュがな ければオリジンへ
12. 12 • Cache-ControlとSurrogate-Controlを組み合わせる ◦ (例) • キャッシュとログインコンテンツの要否 ◦ アクセストークン(Cookie)の有無で制御 • キャッシュしないその他のページは、全てCache-Control: private キャッシュ周りの実装など
13. 13 • www.spacemarket.comのDNSレコード ◦ A → CNAMEに変更、Fastlyを指定 ◦ 全てFastly経由に • SSL証明書 ◦ EV証明書 ◦ ホスティングサービスを利用 ドメイン周り
14. 14 • Fastly-Debugヘッダ • stagingで事前に確認 ◦ ACL使ってる • 福田さん(中の方)の記事が分かりやすい ◦ FastlyにキャッシュされたオブジェクトのTTL確認方法 • Fastlyのサポート側(福田さん)でも動作確認してくれた 動作確認
15. 15 • 全国CM放映問題なし • その後のTV放映などもキャッシュを利用し負荷対策 • 速度も改善 効果
16. 16 • ドキュメントしっかりしてる • 福田さんのQiita記事が更に分かりやすい • 導入サポートも充実 • 特に福田さん、ありがとうございました。 (お礼を言いにきた) サポート体制
17. 17 まとめ
18. 18 まとめ • 福田さんありがとうございました。 (お礼を言いにきた)
19. ご静聴ありがとうございました。