Cloudflare

DNS, global CDN, SSL termination, and security headers — all on the Free plan, sitting between visitors and the GitHub Pages origin.

Architecture

The TABS site is statically exported by Next.js and hosted on GitHub Pages. Cloudflare sits in front of GitHub Pages as a reverse proxy — all traffic to technologyadoptionbarriers.org flows through Cloudflare’s edge network before reaching the origin:

Visitor → Cloudflare Edge (270+ cities) → DNS resolution + DDoS protection → SSL/TLS termination → CDN cache check → Security headers injection → GitHub Pages origin (static files)

The Next.js application itself has no awareness of Cloudflare. There are no Cloudflare Workers, no wrangler.toml, no edge functions. Cloudflare is a purely infrastructure-level integration configured entirely through the Cloudflare dashboard.

DNS Configuration

The domain’s nameservers are delegated to Cloudflare. All DNS records have Proxy status = Proxied (orange cloud), meaning traffic is routed through Cloudflare’s network rather than directly to GitHub:

TypeNameContentProxy
A@185.199.108.153Proxied
A@185.199.109.153Proxied
A@185.199.110.153Proxied
A@185.199.111.153Proxied
CNAMEwww<username>.github.ioProxied

The four A records point to GitHub Pages’ load-balanced IP addresses. The www CNAME redirects to the apex domain. A corresponding public/CNAME file in the repository tells GitHub Pages which custom domain to serve.

CDN & Caching Strategy

Cloudflare’s Free plan provides 3 Page Rules, all of which are allocated to TABS with a tiered caching strategy:

PriorityURL PatternEdge TTLBrowser TTLRationale
1*/_next/static/*1 month1 yearContent-hashed immutable assets — filename changes on rebuild
2*/Images/*, */Svgs/*1 month1 yearStatic images and SVGs rarely change
3*.html1 hour1 hourHTML pages update on deployment — short TTL for freshness

Expected performance gains

  • Cache hit ratio: 70–90% for static assets
  • TTFB improvement: 30–50% from CDN proximity
  • LCP improvement: 15–30%
  • Bandwidth savings: 40–60%

SSL/TLS

SettingValue
Encryption modeFull (strict) — end-to-end encryption, GitHub Pages certificate validated
Minimum TLS versionTLS 1.2
Always Use HTTPSEnabled — HTTP requests redirected to HTTPS
Automatic HTTPS RewritesEnabled — rewrites mixed-content http:// links in responses

The Full (strict) mode is critical: it means Cloudflare validates the origin server’s SSL certificate (issued by GitHub to *.github.io), preventing man-in-the-middle attacks between Cloudflare and GitHub Pages.

Performance Optimizations

Several Cloudflare features are enabled to improve page load times, all available on the Free plan:

FeatureImpact
Auto Minify (JS/CSS/HTML)10–30% smaller file sizes
Brotli CompressionBetter compression ratio than Gzip for text-based assets
Early Hints (103)Preloads critical resources before the full response arrives
HTTP/3 (QUIC)Faster connection establishment and reduced latency
0-RTT Connection ResumptionZero round-trip reconnection for returning visitors

Security Headers

Cloudflare Transform Rules inject security headers on every response. These headers are configured in the Cloudflare dashboard (not in the application code) and apply consistently to all pages:

HeaderValuePurpose
X-Content-Type-OptionsnosniffPrevent MIME-type sniffing
X-Frame-OptionsSAMEORIGINPrevent clickjacking
X-XSS-Protection1; mode=blockLegacy XSS filter
Referrer-Policystrict-origin-when-cross-originControl referer leakage
Permissions-Policygeolocation=(), microphone=(), camera=()Disable sensitive browser APIs

DDoS Protection

Cloudflare’s proxy provides built-in DDoS mitigation at no cost. Because the TABS site is a statically exported Next.js application, the attack surface is inherently small:

  • No server-side logic — there are no API routes, no database queries, and no dynamic rendering to overwhelm
  • High cacheability — most requests are served from Cloudflare’s edge cache without reaching the origin
  • CDN absorption — even under heavy load, Cloudflare’s global network absorbs the traffic across 270+ points of presence

A Web Application Firewall (WAF) evaluation is on the long-term security roadmap. For a static site, the Free plan’s managed rules and DDoS protection provide a strong baseline.

What Cloudflare Does Not Do

To keep the architecture simple, several Cloudflare features are intentionally not used:

  • Cloudflare Workers / Pages — the site is deployed via GitHub Pages, not Cloudflare Pages. Cloudflare Pages is recommended as a future option for PR preview deployments.
  • Cloudflare Analytics — analytics are handled by Google Analytics and Microsoft Clarity, which provide richer behavioral data
  • Cloudflare Access / Zero Trust — the site is fully public with no restricted areas
  • Email routing — email is handled outside Cloudflare

Lessons Learned

  • The Free plan is genuinely sufficient. Between 3 Page Rules, 10 Transform Rules, unlimited bandwidth, and global CDN — the Free tier covers everything a static nonprofit site needs.
  • Full (strict) SSL is non-negotiable. Using "Flexible" or "Full" encryption modes would leave the connection between Cloudflare and GitHub Pages unverified. "Full (strict)" validates the origin certificate and provides genuine end-to-end encryption.
  • Tiered caching avoids stale pages. Giving HTML files a 1-hour TTL means deployments propagate quickly, while hashed static assets can be cached aggressively without ever serving stale content.
  • Security headers belong at the edge. Injecting headers via Cloudflare Transform Rules means they apply to every response — including error pages and redirects — without relying on application-level middleware that a static export cannot provide.

Related