I've deployed on all three platforms. Each has clear strengths in pricing, speed, and features. Here's how to choose for your project.
Tired of naming classes? Writing CSS directly inside HTML sounds ugly, but it became the world standard. Why?
Class is there, but style is missing? Debugging Tailwind CSS like a detective.
For visually impaired, for keyboard users, and for your future self. Small `alt` tag makes a big difference.
How to deploy without shutting down servers. Differences between Rolling, Canary, and Blue-Green. Deep dive into Database Rollback strategies, Online Schema Changes, AWS CodeDeploy integration, and Feature Toggles.
I've deployed production apps on all three platforms over the past six months. Each time I switched, I learned something new about what really matters in a deployment platform. It's not about which one is "best" — it's about matching the tool to your specific needs.
Let me share what I discovered.
These platforms look similar on the surface. They all promise "git push equals deployed site." But their origins shape everything they do.
Vercel was built by the team that created Next.js. This isn't just tight integration — it's native support. Features like ISR, Edge Runtime, and Middleware work perfectly because the platform and framework evolved together. Using Next.js on Vercel feels like using an iPhone — everything just works. Using it elsewhere feels like running Mac apps on Windows — technically possible but not quite right.
Netlify emerged as the champion of Jamstack before static site generators went mainstream. They built an ecosystem around static sites: forms without backends, authentication without servers, CMS without databases. It's not just a deployment platform — it's a complete web development toolkit for teams building static-first applications.
Cloudflare Pages leverages the world's largest CDN infrastructure. Cloudflare operates in 275 cities globally. Pages sits on top of this network, delivering sites at CDN speeds everywhere. When you add Workers for edge computing, you get a serverless platform that responds in 20-50ms worldwide.
Understanding these origins clarified my decision-making instantly.
Free tiers matter for side projects. Here's what you actually get:
| Feature | Vercel | Netlify | Cloudflare Pages |
|---|---|---|---|
| Build time | 100 hours/mo | 300 mins/mo | 500 builds/mo (unlimited time) |
| Bandwidth | 100GB/mo | 100GB/mo | Unlimited |
| Serverless | 100 GB-hours | 125K requests/mo | 100K requests/day |
| Team members | 1 | Unlimited | Unlimited |
Vercel's "100 hours" looks generous until you realize they measure GB-hours, not hours. Large builds consume multiple GB of memory. Netlify's 300 minutes often goes further in practice.
Cloudflare's unlimited build time was refreshing. Build takes an hour? No problem. They limit by build count instead — 500 per month is plenty unless you're deploying 20+ times daily.
But unlimited bandwidth changes everything. When your side project hits Hacker News and traffic explodes, Vercel and Netlify send you bills. Cloudflare doesn't charge extra. I've seen projects rack up $400 in bandwidth overages in a single weekend on Vercel. Same traffic on Cloudflare? Zero extra cost.
// Bandwidth scenario: 1TB monthly usage
// Vercel: 100GB free → 900GB overage = ~$200-400
// Netlify: 100GB free → 900GB overage = ~$495
// Cloudflare Pages: Unlimited = $0 additional
// When your post goes viral, this difference matters
Deploying Next.js to Vercel feels magical. Push code, get deployment. Environment variables through GUI. Automatic previews. Built-in analytics. Zero configuration needed.
But there's a success tax.
Vercel Pro starts at $20/month. Seems reasonable. Add a team member? Another $20. Three-person team? $60/month. Exceed bandwidth? More charges. Success multiplies costs exponentially.
Many developers now deploy Next.js elsewhere. Netlify supports it. Cloudflare runs Next.js 13+ reasonably well. Not perfect — you lose some features — but 80-90% works fine.
// next.config.js for Cloudflare Pages
module.exports = {
output: 'export', // Static export only
images: {
unoptimized: true, // No Image Optimization
},
}
// On Vercel, this config isn't needed
// Everything just works automatically
The trade-off is clear. Vercel offers zero-config perfection. Other platforms require compromises. You sacrifice Image Optimization, ISR, or Middleware — or find workarounds.
My criteria evolved to:
Using Netlify revealed it's not just a deployment platform — it's an all-in-one web development toolkit.
Netlify Forms impressed me most. Add data-netlify="true" to any HTML form. Done. No backend needed. Contact forms, newsletter signups, surveys — all work instantly.
<!-- Netlify Forms example -->
<form name="contact" method="POST" data-netlify="true">
<input type="text" name="name" />
<input type="email" name="email" />
<textarea name="message"></textarea>
<button type="submit">Send</button>
</form>
<!-- That's it. Zero backend code. -->
Netlify Identity provides authentication. Add Google or GitHub login in five minutes. JWT tokens issued automatically. Perfect for small projects where Auth0 or Clerk feels excessive.
Netlify CMS creates a Git-based content management system. Edit markdown files through a GUI. Ideal for blogs or documentation when non-developers need editing access.
These features make Netlify perfect for startup MVPs and landing pages. Build fast, validate, migrate later if needed.
I initially thought Cloudflare Pages was just "fast static hosting." Then I combined it with Workers and everything changed.
Workers are serverless functions running at the edge. Powered by V8 engine, they have near-zero cold starts (0-5ms). Much faster than Node.js runtimes.
// Cloudflare Workers example
export default {
async fetch(request: Request): Promise<Response> {
const url = new URL(request.url);
// Intercept API requests for caching
if (url.pathname.startsWith('/api/')) {
const cache = caches.default;
let response = await cache.match(request);
if (!response) {
response = await fetch(request);
const cacheResponse = new Response(response.body, response);
cacheResponse.headers.set('Cache-Control', 'max-age=3600');
await cache.put(request, cacheResponse);
}
return response;
}
return fetch(request);
}
}
This enables powerful patterns:
The speed impressed me most. Vercel Edge Functions are fast, but Cloudflare operates on another level. 20-50ms response times globally. The reason? Cloudflare's network is the most distributed on Earth.
All three platforms offer GUI-based environment variable management. But the details differ.
Vercel separates Preview, Development, and Production. Configure the same variable differently per environment. Pull them locally via CLI:
vercel env pull .env.local
Netlify organizes by Context: Production, Deploy Preview, Branch Deploy. You can also manage via .toml files and commit them (for non-secrets):
# netlify.toml
[build.environment]
NODE_VERSION = "18"
NEXT_PUBLIC_API_URL = "https://api.example.com"
[context.production.environment]
NEXT_PUBLIC_API_URL = "https://api.production.com"
Cloudflare Pages integrates with Workers Secrets. Direct connections to KV, Durable Objects, R2 storage. The UI is more complex though — you'll often need Wrangler CLI.
Critical tip: Never expose sensitive API keys to the client. Variables with NEXT_PUBLIC_ prefix get bundled. Handle secrets in serverless functions or edge functions instead.
When your side project succeeds and traffic explodes, cost differences become stark.
Vercel pricing is aggressive. Pro plan ($20/user) works initially, but Enterprise requires negotiation. No middle tier. One million monthly visitors typically means $200-500 minimum monthly cost.
Netlify is similar. Pro at $19/user. Bandwidth overages cost $55/100GB. High traffic gets expensive fast.
Cloudflare Pages differs fundamentally. Pro plan is $20/month for the entire team. Bandwidth is unlimited. You only pay for Workers calls beyond the free tier (100K requests/day).
// 1 million monthly visitors, 2MB average page size
// Vercel
// 100GB free → 1TB usage ≈ $200-400 charge
// Netlify
// 100GB free → 1TB usage ≈ $495 charge
// Cloudflare Pages
// Unlimited bandwidth → $0 additional
// 3M Workers calls → ~$15
When you understand this, the choice becomes obvious. Unpredictable traffic? Choose Cloudflare. Clear growth trajectory with funding? Vercel or Netlify make sense.
After six months across three platforms, here's my framework:
Choose Vercel when:My current strategy:
If you're unsure? Start with Cloudflare Pages. It's free, fast, and easy to migrate from. Going the other direction — Vercel to Cloudflare — is harder, especially if you're using advanced Next.js features.
There's no "perfect platform." There's only the right platform for your situation. Define your project's priorities, then choose accordingly. That's the most important lesson from my six-month journey across all three.