Blogに戻る

CDN Optimization

#パフォーマンス #インフラ #Web開発
作成日: 2024年2月21日
更新日: 2024年2月21日

CDNの役割

Content Delivery Network (CDN)は、コンテンツを地理的に分散して配信し、レスポンス時間を短縮します。

CDN最適化テクニック

エッジロケーション活用

// Cloudflare Workers Example
addEventListener('fetch', event => {
  event.respondWith(handleRequest(event.request))
})
 
async function handleRequest(request) {
  const cache = caches.default
  const response = await cache.match(request)
  
  if (response) return response
  
  const fetchResponse = await fetch(request)
  event.waitUntil(cache.put(request, fetchResponse.clone()))
  
  return fetchResponse
}

画像最適化

キャッシュ戦略

# 静的アセット
location ~* \.(jpg|jpeg|png|gif|ico|css|js)$ {
    expires 1y;
    add_header Cache-Control "public, immutable";
}
 
# HTMLファイル
location ~* \.html$ {
    expires 1h;
    add_header Cache-Control "public, must-revalidate";
}

パフォーマンスメトリクス