Notion CMSブログの表示速度と更新性を改善! — Astro, Cloudflare Workers KV, CDNによるキャッシュシステム構築ガイド Published : 2025年4月12日 Updated : 2025年5月8日 Tags : Technology Table of Contents ▼ はじめに 改善前の課題 (失敗した) 最初のアプローチ システムアーキテクチャ システム全体図 & コンポーネント構成 データフロー (概要) メイン: Cloudflare Workers KV と CDN キャッシュ戦略 データ取得フロー詳細: KV キャッシュ戦略 CDN キャッシュ戦略（概要） 主なヘッダーの説明： ⚠️ 本番でハマったキャッシュの罠と、その対処法 1. KVが使えない！？Cloudflare Pagesの盲点 2. put()したのに get()で反映されない ― KVの整合性問題 3. CDNが「最新っぽい古いもの」を返してくる 自動キャッシュ更新基盤 CLI コマンド (キャッシュ生成スクリプト): GitHub Actions 自動化フロー: フロントエンド実装 (Astro) SSR ページ 画像の遅延読み込み (Lazy Loading) & キャッシュ JavaScriptのDynamic Import Notion コンテンツの HTML 変換 特殊ブロック例 (Callout): 実装による効果とメリット パフォーマンス向上 更新の信頼性向上: 開発性の向上: まとめと今後の展望 システムの要点: 今後の課題とCloudflareサービスの活用展望 1. ストレージ層の拡張：R2 / D1 2. 高度なパフォーマンス・配信最適化