aicode8
FrontendUpdated: 2026-09-08

Cloudflare Pages architecture: layered patterns for high-concurrency edge apps

The edge-delivery view of Cloudflare Pages's layering and data flow.

On this page

Quick answer

Why are _headers and _redirects not taking effect?

Both files must live in the output root (e.g. dist/). Placing them under src/ means they never ship. Pure static projects should not force a _worker.js either, or you lose the zero-cold-start advantage.

Machine-readable page data: /data/cloudflare-architecture.json

In-depth analysis

Cloudflare Pages watches your Git branch, builds on every commit, and atomically publishes the result to the global edge — zero-ops static hosting. Architecture should be edge-first — static pre-render sinks to the edge, dynamic capability falls back to functions with circuit breakers.

Cloudflare Pages · Config example
# public/_headers — security headers ride with static assets (Cloudflare convention)
/*
  X-Content-Type-Options: nosniff
  Strict-Transport-Security: max-age=63072000; includeSubDomains
  X-Frame-Options: DENY
  Referrer-Policy: strict-origin-when-cross-origin
Best practices:Static pre-rendering sinks to the edge; dynamic capability falls back to functions with circuit breakers. Third-party calls get timeouts and circuit breakers so a single failure cannot take the site down.
Pitfalls:_headers and _redirects must live in the output root (e.g. dist/) — placing them under src/ means they never ship. Pure static projects should not add _worker.js either, or you lose the zero-cold-start advantage. Every third-party call needs a timeout and circuit breaker — otherwise a single failure takes the whole site down.

Cloudflare Pages Architecture · Key takeaways

  • Static and dynamic boundaries defined
  • Third-party calls wrapped in circuit breakers
  • Environment config separated from code
  • Boundary contracts documented

FAQ & pitfalls

How do I precisely invalidate Cloudflare edge cache?

Static assets get immutable with a long max-age, HTML gets must-revalidate. Change the filename, change the URL — Cloudflare picks up the new version automatically.

Share & save

My shelf0
← Back to homeTopic: Cloudflare Architecture

What readers are asking

Questions that keep coming back in reader feedback, already answered.

  1. 01
    Why are _headers / _redirects not taking effect?

    Both files must sit at the root of the output directory (dist/); anything under src/ is never uploaded. A purely static project should not add _worker.js either — that gives up the zero-cold-start advantage.

    See the full guide →
  2. 02
    How do I invalidate the Cloudflare edge cache precisely?

    Give static assets a long immutable max-age and serve HTML with must-revalidate. Changing a filename changes the URL, so Cloudflare fetches the new version automatically.

    See the full guide →
  3. 03
    Why is my Astro component's interactivity not working?

    Components ship as zero-JS HTML by default, so an interactive one needs a client:* directive (client:load, client:visible, …). Without it the script is never bundled into the page.

    See the full guide →
All questions →

Follow along as I build with AI

Get the honest, real-time record: what I build, what breaks, and what I learn — from a non-technical founder. No jargon, no fluff.

We respect your inbox. One click to unsubscribe, anytime.