Page Rules for Cache Control — Edge Caching Strategies in Cloudflare

In this tutorial, you'll learn about Page Rules for Cache Control. We cover key concepts, practical examples, and best practices to help you understand and apply this topic effectively.

Cloudflare Page Rules for cache control let you define precisely how long content is cached at the edge, which files bypass the cache entirely, and how the origin's cache headers are interpreted across your domain.

What You'll Learn

By the end of this tutorial, you will understand the cache-related Page Rule actions, how to set edge and browser TTLs, and how to build a cache control Strategy that balances freshness with performance.

Why It Matters

Proper cache configuration reduces origin server load by 60-90%, improves page load times for returning visitors, and protects your backend during traffic spikes. Cloudflare Page Rules give you surgical control over Caching per URL pattern.

Real-World Use

Durga Antivirus Pro uses aggressive Caching for static signature files that update daily. The same Page Rules approach applies to any website with a mix of static and dynamic content: cache the static assets long, bypass the dynamic endpoints, and serve stale content during updates.

Your Learning Path

flowchart LR
  A[Page Rules Intro] --> B[Page Rules Caching]
  B --> C[Page Rules URL Forwarding]
  C --> D[More Cloudflare Features]
  B --> E{You Are Here}
  style E fill:#f90,color:#fff

Cache-Related Page Rule Actions

Cache Level Options

flowchart TD
  A[Request matches Page Rule] --> B{Cache Level}
  B -->|Bypass| C[Always fetch from origin]
  B -->|No Query String| D[Cache without query string]
  B -->|Ignore Query String| E[Cache ignoring query parameters]
  B -->|Standard| F[Respect origin Cache-Control]
  B -->|Cache Everything| G[Cache regardless of origin headers]
  style B fill:#f90,color:#fff

Standard vs Cache Everything

# Standard caching: Cloudflare respects origin Cache-Control headers
# Origin sends: Cache-Control: public, max-age=3600
# Cloudflare caches for exactly 3600 seconds.

# Cache Everything: Cloudflare caches regardless of origin headers
# Origin sends: Cache-Control: no-cache
# Cloudflare caches based on Edge Cache TTL set in the Page Rule.

Practical Cache Strategies

Strategy 1: Static Asset Cache

# Pattern: *example.com/assets/*
# Cache Level: Cache Everything
# Edge Cache TTL: 2,592,000 seconds (30 days)
# Browser Cache TTL: 2,592,000 seconds (30 days)

# Purpose: Asset files with versioned filenames never change.
# Cache aggressively. Update is triggered by filename change.

Strategy 2: News Article Cache

# Pattern: *example.com/news/*
# Cache Level: Standard
# Edge Cache TTL: 300 seconds (5 minutes)
# Browser Cache TTL: 60 seconds (1 minute)

# Purpose: News content changes frequently but can tolerate
# a short cache window. Readers get fresh content within minutes.

Strategy 3: API Cache with Stale Serving

// Cloudflare Worker implementing stale-while-revalidate
export default {
  async fetch(request, env) {
    const cache = caches.default;
    const cachedResponse = await cache.match(request);

    if (cachedResponse) {
      // Serve stale cache and revalidate in background
      const fetchPromise = fetchAndUpdateCache(request, cache);
      return cachedResponse;
    }

    return fetchAndUpdateCache(request, cache);
  }
};

async function fetchAndUpdateCache(request, cache) {
  const response = await fetch(request);
  const headers = new Headers(response.headers);
  headers.set('Cache-Control', 'public, max-age=60, stale-while-revalidate=3600');
  const cachedResponse = new Response(response.body, { ...response, headers });
  await cache.put(request, cachedResponse.clone());
  return cachedResponse;
}

// Expected behavior:
// First request: fetch from origin, cache for 60s
// Requests within 60s: serve from cache
// Requests 60-3660s after: serve stale cache + background revalidation

Monitoring Cache Performance

# Use curl to inspect Cloudflare cache status
curl -I https://yourdomain.com/style.css

# Look for the CF-Cache-Status header:
# CF-Cache-Status: HIT     <-- served from edge cache
# CF-Cache-Status: MISS    <-- not in cache, fetched from origin
# CF-Cache-Status: DYNAMIC <-- intentionally not cached
# CF-Cache-Status: STALE   <-- served stale, revalidating

# Expected output for a cached asset:
# HTTP/2 200
# cf-cache-status: HIT
# cache-control: public, max-age=2592000

Common Errors

Cache Everything without Edge TTL. Without an explicit Edge Cache TTL, Cloudflare uses the origin's Cache-Control. For Cache Everything mode, always set an Edge Cache TTL.

Bypass cache too broad. A single *example.com/* rule set to Bypass disables all edge Caching. Create narrow bypass rules and a broader cache rule below them.

Browser Cache TTL too long. Setting Browser Cache TTL to 30 days for HTML pages means users see stale content even after you publish updates. Use shorter TTLs for HTML and long TTLs for hashed assets.

Ignoring query strings unintentionally. If your application varies content by query parameters, use Cache Key actions or No Query String carefully. Two API calls with different parameters should not share a cached response.

Stale content from origin Cache-Control override. When Origin Cache Control is enabled, Cloudflare respects the origin's s-maxage header. If the origin sends s-maxage=0, edge Caching is effectively disabled regardless of Page Rules.

Practice Questions

1. What is the difference between Cache Everything and Standard cache levels?
2. How does the CF-Cache-Status header indicate whether content was served from cache?
3. Why should browser cache TTL be shorter for HTML pages than for hashed assets?

Challenge

Design a cache Strategy for a website with the following content types: versioned JavaScript files (hash in filename), unversioned CSS, blog posts (updated weekly), and user dashboard pages. Write the Page Rules with patterns, levels, and TTLs.

Real-World Task

Inspect your production site's CF-Cache-Status headers for 10 different URLs. Identify any that show DYNAMIC or MISS unexpectedly. Create Page Rules to improve cache hit ratio.

FAQ

Related Tutorials

• Page Rules Intro — URL pattern matching fundamentals
• Page Rules URL Forwarding — Redirect and rewrite rules
• Cloudflare — Complete platform guide

Built by the developers of Doda Browser, DodaZIP, and Durga Antivirus Pro — security-first tools for the modern web.