Cloudflare Pages vs Netlify vs Vercel for Static Sites

By Kokil Thapa | Last reviewed: September 2026

Choosing between Cloudflare Pages vs Netlify vs Vercel for static sites is no longer a trivial decision. Marketing pages, documentation, and landing pages that convert now depend on build pipelines, edge caching, and preview URLs. I've deployed static frontends for law-firm portals, travel sites, and client portfolios on all three platforms. Each one ships fast global delivery. Each one also has trade-offs that only show up under real traffic, custom domains, or team workflows. This guide compares them the way a production engineer would: concrete limits, config files, and a clear verdict by use case.

What Is the Difference Between Cloudflare Pages, Netlify, and Vercel?

All three platforms take a Git push and publish HTML, CSS, JavaScript, and assets to a global edge network. The differences sit in build runners, serverless functions, pricing tiers, and framework coupling.

Cloudflare Pages runs on Cloudflare's edge. Builds happen on Cloudflare infrastructure. Static assets and Workers sit on the same network as Cloudflare CDN DNS. Netlify pioneered the JAMstack workflow. It offers mature build plugins, form handling, and identity features. Vercel created Next.js and optimises deeply for React, Next.js, and modern full-stack JavaScript.

None of these replace a full web development backend when you need Laravel, WordPress, or custom PHP. They excel at the static or headless frontend layer. Many projects I maintain pair a Laravel API on Ubuntu with a static marketing site on one of these platforms.

How Do You Deploy a Static Site on Each Platform?

All three connect to Git and auto-deploy on push. The config file names differ. Build commands and output directories must match your generator.

Cloudflare Pages

Create a project in the Cloudflare dashboard or use Wrangler CLI. Point it at your repo. Set the build command and output folder.

# wrangler.toml (optional for advanced Workers binding)
name = "my-static-site"
compatibility_date = "2026-01-01"

[site]
bucket = "./dist"

Typical settings for a Vite 8.x project: build command npm run build, output directory dist. Cloudflare runs Node.js 26 on current build images. Connect your custom domain inside the same dashboard where DNS already lives. That single-vendor setup is why I often pick Pages for brochure sites tied to domain and hosting work.

Netlify

Netlify reads a netlify.toml at the repo root. Redirects, headers, and build settings live in one file.

[build]
  command = "npm run build"
  publish = "dist"

[[redirects]]
  from = "/api/*"
  to = "https://api.example.com/:splat"
  status = 200
  force = true

Netlify's deploy previews generate a unique URL per pull request. That workflow helps agencies review client pages before merge. I've used this on portfolio and legal-info sites where stakeholders need visual sign-off.

Vercel

Vercel auto-detects many frameworks. For static export from Next.js, set output: 'export' in next.config.js. For plain Vite or Hugo, configure via the dashboard or vercel.json.

{
  "buildCommand": "npm run build",
  "outputDirectory": "dist",
  "framework": null
}

Vercel preview URLs are fast and reliable. Branch deployments map cleanly to Git workflow. If your team already runs Next.js 15+, the zero-config path is hard to beat.

Which Platform Offers the Best Pricing for Static Sites?

Free tiers on all three cover many small business sites. Costs rise with build minutes, bandwidth, team seats, and serverless invocations. Always model your expected traffic before committing.

Cloudflare's unlimited static bandwidth on the free tier is the standout for high-traffic brochure sites. A legal-info portal or news-style static site can serve heavy traffic without bandwidth shock. Netlify's credit system bundles builds, functions, and bandwidth into one pool. Watch credit burn if you deploy frequently or run heavy function workloads.

Vercel hobby tier restricts commercial use. Client projects typically need Pro at roughly USD 20 per member per month. That is about Rs 2,700 at typical 2026 exchange rates. For a Nepali SMB publishing a static marketing site with modest traffic, Cloudflare Pages free tier often costs zero.

Use the Nepal EMI calculator mindset here: project monthly cost across 12 months before picking a paid tier. A few dollars per seat adds up across a small agency team.

How Do Cloudflare Pages, Netlify, and Vercel Affect SEO and Performance?

Static HTML served from edge nodes is excellent for SEO and Core Web Vitals. Google crawls plain HTML easily. No JavaScript rendering delay. The platform choice matters less than your HTML structure, but edge latency and header control still differ.

All three support custom headers for cache control, security, and Link preload hints. Netlify and Cloudflare expose _headers or _redirects files. Vercel uses vercel.json headers array. Set long cache for fingerprinted assets and short cache for HTML.

# public/_headers (Netlify or Cloudflare Pages)
/assets/*
  Cache-Control: public, max-age=31536000, immutable

/*
  X-Frame-Options: DENY
  X-Content-Type-Options: nosniff

For page speed optimisation, Cloudflare's network often delivers the lowest TTFB in Asia-Pacific regions. That includes users in Nepal on mobile networks. Vercel's image optimisation helps Next.js projects but is less relevant for pure static HTML. Netlify's prerendering and split-testing plugins can help marketing experiments without touching application code.

Static hosts do not replace on-page SEO fundamentals. You still need clean URLs, meta tags, schema markup, and a sitemap. Generate sitemap.xml at build time and submit it in Google Search Console.

When Should You Choose Each Platform for Your Project?

There is no universal winner. Match the host to your stack, team, and traffic profile. Here is how I decide on real client work.

Choose Cloudflare Pages when

• Your site is truly static: Hugo, Eleventy, Vite, or hand-built HTML.
• DNS and CDN already live on Cloudflare.
• You expect high bandwidth without per-GB billing.
• You want Workers on the same vendor for lightweight API routes.
• Budget is tight and the project is a Nepali SMB brochure site.

Choose Netlify when

• You need built-in form handling without a backend.
• Deploy previews and split testing are part of the workflow.
• The team wants a polished dashboard and mature plugin ecosystem.
• You run Jamstack with occasional serverless functions at moderate volume.

Choose Vercel when

• The project is Next.js with SSR, ISR, or React Server Components.
• Your team lives in the Vercel plus Next.js toolchain daily.
• Preview deployments per branch are non-negotiable for frontend teams.
• You accept Pro pricing for commercial client work.

For a law-firm marketing site with static content and a separate Laravel booking backend, Cloudflare Pages is my default. For a travel agency site where the marketing team edits content and tests hero variants, Netlify's preview URLs earn their keep. I do not pick Vercel unless the codebase is Next.js.

Hybrid setups work well. Static marketing on Cloudflare Pages. Laravel API on a VPS. WordPress blog on managed hosting. Connect them with reverse proxy rules or subdomain routing. See multi-region deployment patterns for larger setups.

What Are Common Mistakes When Hosting Static Sites on These Platforms?

Most failures I troubleshoot are configuration errors, not platform bugs. These recur across client migrations and new launches.

1. Wrong publish directory. Vite outputs to dist. Hugo outputs to public. Jekyll uses _site. A mismatch publishes an empty folder.
2. Client-side routing without redirects. Single-page apps need a catch-all redirect to index.html. Without it, direct URL visits return 404.
3. Environment variables not set in the dashboard. Build-time vars like VITE_API_URL must be configured per environment. Local .env files do not travel with Git.
4. Ignoring cache invalidation. After deploy, users may see stale HTML if cache headers are too aggressive on non-fingerprinted files.
5. Mixing commercial use on hobby tiers. Vercel hobby terms restrict client work. Upgrade before launch, not after a billing surprise.
6. Skipping HTTPS and www canonicalisation. Pick apex or www. Redirect the other. Set canonical tags in HTML. See SPA vs MPA SEO for routing implications.

For JSON config testing during setup, a local JSON formatter catches syntax errors in vercel.json before push. Small tooling habits prevent redeploy loops.

When migrating from shared hosting, map old URLs to new paths. Both Netlify and Cloudflare support bulk redirect rules. A botched migration destroys rankings you built over years. Read the website migration checklist before switching DNS.

Official docs remain the source of truth for limits that change quarterly. Consult Cloudflare Pages documentation, Netlify documentation, and Vercel documentation before locking architecture.

Key Takeaways

• Cloudflare Pages offers the best free-tier bandwidth for pure static HTML and pairs naturally with Cloudflare DNS.
• Netlify wins on forms, split testing, and deploy-preview workflows for non-technical stakeholders.
• Vercel is the clear choice for Next.js and React SSR; avoid it for simple static HTML unless the team already uses it.
• All three need correct output directories, SPA redirect rules, and cache headers for production SEO.
• Static hosts complement — not replace — Laravel, WordPress, or PHP backends on a VPS.
• Model total cost including team seats, build minutes, and function invocations before committing to a paid tier.

People Also Ask

Is Cloudflare Pages completely free for static sites?

Cloudflare Pages free tier includes 500 builds per month and unlimited static bandwidth for personal and commercial projects. Workers and advanced features have separate quotas. For a typical brochure site with weekly deploys, you stay within free limits easily.

Can I host a Next.js site on Netlify or Cloudflare Pages?

Yes, with limits. Netlify supports Next.js via its Next.js runtime plugin. Cloudflare supports Next.js through the @cloudflare/next-on-pages adapter. Vercel still provides the smoothest Next.js experience with full SSR and ISR support out of the box.

Which platform is fastest for users in Nepal and South Asia?

Cloudflare's edge network density often delivers the lowest TTFB across Asia-Pacific. All three perform well for static assets. Actual speed depends on image compression, HTML weight, and cache header configuration more than platform brand.

Do I still need a server if I use Vercel or Netlify?

For pure static content, no. If you need Laravel, custom PHP, MySQL transactions, or WordPress admin, you still need a backend server or managed CMS. Static hosts excel at the frontend layer and lightweight serverless functions.

Pick the Host That Matches Your Stack, Not the Hype

The Cloudflare Pages vs Netlify vs Vercel for static sites decision boils down to three questions. What framework do you run? How much traffic and bandwidth do you expect? What does your team need beyond file hosting? Cloudflare Pages is my default for static HTML on budget-conscious Nepali projects. Netlify earns its place when previews and forms matter. Vercel belongs in Next.js workflows.

None of these platforms fix bad content or missing speed optimisation discipline. They deliver files fast. You still own HTML quality, redirects, and analytics. If you want help choosing a stack, migrating DNS, or pairing a static frontend with a Laravel API, contact us or browse the portfolio for examples. For ongoing tips, follow the blog or read about portfolio sites that convert and WordPress Cloudflare integration.