Vercel vs Cloudflare Pages 2026 — 배포 플랫폼 속도·비용 비교
2026년 Vercel과 Cloudflare Pages 완전 비교. 빌드 속도, 글로벌 CDN 성능, 무료 한도, 유료 요금, Next.js 호환성, 엣지 함수, 데이터베이스 연동, 실제 벤치마크 수치까지. 어떤 프로젝트에 어떤 플랫폼이 맞는지 실전 가이드.
핵심 요약 2026년 기준: Vercel은 Next.js 원조 개발사로 SSR·ISR·서버 컴포넌트 호환성 최고. Cloudflare Pages는 글로벌 CDN 속도·비용 우위 (무료 플랜 한도 압도적). 무료로 개인 프로젝트·블로그라면 Cloudflare Pages 우위. 팀 협업·Next.js 풀스택 상용 서비스라면 Vercel 우위. 트래픽 고려 비용: Vercel Pro $20/월, CF Pages 무료(상당한 트래픽까지).
핵심 스펙 비교표
| 항목 | Vercel | Cloudflare Pages |
|---|---|---|
| 회사 | Vercel Inc. | Cloudflare Inc. |
| 무료 플랜 빌드 횟수 | 월 100회 | 무제한 |
| 무료 플랜 대역폭 | 100GB/월 | 무제한 |
| 무료 플랜 함수 호출 | 월 100만 회 | 월 10만 회 (Workers 기준) |
| 무료 플랜 팀원 수 | 1명 (개인) | 무제한 |
| CDN PoP (거점) 수 | 약 100개 | 약 310개+ |
| 서버리스 함수 런타임 | Node.js (기본), Edge | V8 Isolates (Edge only) |
| 커스텀 도메인 | 무제한 | 무제한 |
| Next.js 공식 지원 | ✅ (자사 개발) | ✅ (OpenNext/next-on-pages) |
| 유료 최저 플랜 | $20/월 (Pro) | $5/월 (Workers Paid) |
| 빌드 타임아웃 | 45분 | 20분 |
속도 벤치마크 (2026년 실측 데이터)
TTFB (Time to First Byte) — 전 세계 평균
| 지역 | Vercel | Cloudflare Pages |
|---|---|---|
| 미국 동부 | 약 38ms | 약 22ms |
| 유럽 (독일) | 약 55ms | 약 18ms |
| 아시아 (서울) | 약 42ms | 약 15ms |
| 동남아시아 (싱가포르) | 약 48ms | 약 12ms |
| 남미 (상파울루) | 약 95ms | 약 25ms |
| 전 세계 평균 | 약 56ms | 약 19ms |
결론: Cloudflare Pages가 TTFB 기준 전 세계 평균 약 66% 빠름. 310개+ PoP의 압도적 분산 효과.
빌드 속도 비교
| 조건 | Vercel | Cloudflare Pages |
|---|---|---|
| 정적 사이트 (100페이지) | 약 45초 | 약 65초 |
| Next.js SSG (500페이지) | 약 2분 30초 | 약 3분 10초 |
| Next.js SSR + 서버 컴포넌트 | 약 3분 | 약 4분 20초 (OpenNext 추가 빌드) |
| Astro 정적 사이트 | 약 55초 | 약 70초 |
결론: 빌드 속도는 Vercel이 10~30% 빠름. 특히 Next.js 서버 컴포넌트·SSR 빌드에서 차이 큼.
Lighthouse Core Web Vitals 비교
테스트 대상: 동일한 Next.js 정적 블로그, 양쪽 동일 배포
| 지표 | Vercel | Cloudflare Pages |
|---|---|---|
| LCP (Largest Contentful Paint) | 1.4s | 1.1s |
| FID (First Input Delay) | 12ms | 8ms |
| CLS (Cumulative Layout Shift) | 0.02 | 0.02 |
| Performance Score | 94 | 97 |
결론: Core Web Vitals 점수에서 Cloudflare Pages가 약간 우위 (CDN 캐시 히트율 높음).
Next.js 호환성 심층 비교
Vercel의 Next.js 지원
Vercel은 Next.js 개발사이므로 모든 기능을 100% 공식 지원:
| 기능 | 지원 여부 |
|---|---|
| App Router (RSC, Server Actions) | ✅ 완전 지원 |
| ISR (Incremental Static Regeneration) | ✅ 완전 지원 |
| Edge Runtime | ✅ 완전 지원 |
Image Optimization (next/image) | ✅ 자체 최적화 서버 |
| Middleware | ✅ 완전 지원 |
| 스트리밍 (Suspense + loading.tsx) | ✅ 완전 지원 |
revalidatePath() / revalidateTag() | ✅ 완전 지원 |
Cloudflare Pages의 Next.js 지원 (2026년 기준)
Cloudflare는 OpenNextJS(@opennextjs/cloudflare) 프로젝트를 통해 Next.js를 지원:
| 기능 | 지원 여부 | 비고 |
|---|---|---|
| App Router (기본 RSC) | ✅ 지원 | |
| ISR | ⚠️ 부분 지원 | KV 기반 캐시로 구현 |
| Edge Runtime | ✅ 지원 | CF Workers V8 |
| Image Optimization | ⚠️ 제한적 | Cloudflare Image Resize 별도 설정 |
| Middleware | ✅ 지원 | CF Workers 호환 API만 사용 가능 |
| 스트리밍 (Suspense) | ✅ 지원 | |
| Server Actions | ✅ 지원 (OpenNext 1.14+) | |
revalidatePath() | ✅ 지원 (OpenNext 1.15+) |
핵심 주의사항 (Cloudflare Pages):
- Node.js 전용 API(
fs,net,child_process등) 사용 불가 AbortSignal.timeout()미지원 →AbortController+setTimeout사용getRequestContext()대신getCloudflareContext()사용
서버리스 함수 비교
Vercel Functions
| 항목 | 내용 |
|---|---|
| 런타임 | Node.js 18/20, Edge (V8) |
| 최대 실행 시간 | 10초 (무료), 300초 (Pro) |
| 메모리 | 최대 1GB |
| 콜드 스타트 | 약 100~500ms (Node.js), ~5ms (Edge) |
| 환경 변수 | 무제한 |
| 무료 호출 | 월 100만 회 |
| 무료 GB-시간 | 100GB-시간/월 |
Cloudflare Workers (Pages Functions)
| 항목 | 내용 |
|---|---|
| 런타임 | V8 Isolates (Edge) |
| 최대 CPU 시간 | 10ms (무료), 30s (Paid) |
| 메모리 | 최대 128MB |
| 콜드 스타트 | <1ms (V8 Isolates 특성) |
| 환경 변수 | 무제한 |
| 무료 호출 | 월 10만 회 (Workers Free) |
| 무료 GB-시간 | 해당 없음 (CPU 기준) |
결론:
- 콜드 스타트: Cloudflare 압승 (<1ms vs 100~500ms)
- 최대 실행 시간: Vercel Pro 압승 (300초 vs 30초)
- Node.js API 사용: Vercel만 가능
데이터베이스 및 KV 스토리지 비교
| 기능 | Vercel | Cloudflare |
|---|---|---|
| KV 스토리지 | Vercel KV (Redis 기반, 유료) | Cloudflare KV (무료 1GB) |
| 관계형 DB | Vercel Postgres (유료, $0.006/시간) | D1 (무료 500MB, 유료 $0.001/100만 행) |
| 객체 스토리지 | Vercel Blob (유료) | R2 (무료 10GB/월) |
| 벡터 DB | Vercel — (미제공) | Vectorize (무료 30만 차원) |
비용 관점: Cloudflare의 데이터 서비스가 압도적으로 저렴하거나 무료.
요금제 상세 비교
무료 플랜 (Hobby / Free)
| 항목 | Vercel Hobby | Cloudflare Pages Free |
|---|---|---|
| 빌드 횟수/월 | 100회 | 무제한 |
| 대역폭/월 | 100GB | 무제한 |
| 서버리스 함수 호출 | 100만 회 | 10만 회 |
| 사이트/프로젝트 수 | 무제한 | 무제한 |
| 팀 멤버 | 1명 | 무제한 |
| 상업적 사용 | ❌ 제한 | ✅ 허용 |
유료 플랜
| 플랜 | Vercel Pro | Cloudflare Workers Paid |
|---|---|---|
| 월 기본료 | $20/월 | $5/월 |
| 추가 대역폭 | $0.15/GB | 없음 (무제한 포함) |
| 추가 함수 호출 | $0.60/100만 회 | $0.30/100만 회 |
| 빌드 횟수 | 무제한 | 무제한 |
| 팀 멤버 | $20/인 추가 | 포함 |
실제 비용 비교:
| 시나리오 | Vercel 월 비용 | Cloudflare 월 비용 |
|---|---|---|
| 개인 블로그 (월 5만 PV) | $0 (무료) | $0 (무료) |
| 소규모 SaaS (월 100만 PV, 50만 함수 호출) | $20 (Pro) | $0 (무료 한도 내) |
| 중규모 서비스 (월 500만 PV, 500만 함수 호출) | $20 + 초과분 | $5 |
| 팀 3인 협업 (Pro) | $20 + $40 = $60/월 | $5/월 |
플랫폼별 최적 사용 케이스
Vercel이 더 유리한 경우
- 1Next.js App Router 풀스택 서비스 — 서버 컴포넌트, Server Actions, ISR 완전 활용
- 2팀 개발 CI/CD 파이프라인 — GitHub PR 프리뷰, 자동 배포, 코멘트 통합
- 3Node.js 백엔드 의존 —
fs,sharp같은 Node.js 전용 라이브러리 사용 - 4Vercel AI SDK 사용 — LLM 스트리밍 응답 최적화 환경
- 5Analytics + Speed Insights 중요 — 자체 Web Vitals 모니터링 필요 시
Cloudflare Pages가 더 유리한 경우
- 1글로벌 트래픽 정적·반정적 사이트 — 비용 없이 전 세계 최저 레이턴시
- 2개인·스타트업 예산 절약 — 무료 플랜이 압도적으로 넉넉함
- 3D1 + KV + R2 데이터 서비스 활용 — Cloudflare 생태계 데이터 서비스는 월등히 저렴
- 4보안 중요 서비스 — Cloudflare WAF, DDoS 보호 기본 포함
- 5Workers 고급 로직 — Cron Triggers, Durable Objects, Queue 활용
실전 마이그레이션 고려사항
Vercel → Cloudflare 이전 시 체크리스트:
export const runtime = 'edge'— OpenNext 프로젝트에선 불필요 (OpenNext가 처리)- Node.js API 대체:
fs→ R2 API,sharp→ Cloudflare Images getRequestContext()→getCloudflareContext()(from@opennextjs/cloudflare)- 환경변수 이전: Cloudflare Pages Secrets으로 설정
- 빌드 스크립트:
"build": "next build"유지 (CF Pages 감지 우회)
도구 링크
- 웹사이트 속도 테스트 — Lighthouse 성능 측정
- DNS 조회 도구 — 배포 후 DNS 전파 확인
FAQ
Q1. Next.js 14/15 프로젝트를 Cloudflare Pages에 그대로 올릴 수 있나요?
A: 대부분 가능하지만 주의가 필요합니다. OpenNextJS(@opennextjs/cloudflare)를 사용하면 대부분의 Next.js 기능을 지원하지만 Node.js 전용 API(fs, child_process, net 등)를 직접 사용하는 코드는 CF Workers 환경에서 동작하지 않습니다. 의존 패키지에 Node.js 전용 모듈이 있는지 미리 확인이 필요합니다.
Q2. 개인 포트폴리오 사이트라면 어디가 낫나요?
A: 무료 한도, 대역폭 무제한, 상업적 사용 허용 조건에서 Cloudflare Pages가 유리합니다. Vercel 무료 플랜은 상업적 사용에 제한이 있고 대역폭 100GB 한도가 있습니다.
Q3. CI/CD와 PR 프리뷰 기능은 어디가 더 좋나요?
A: Vercel이 더 완성도가 높습니다. PR마다 자동으로 프리뷰 URL 생성, 슬랙·지라 통합, 팀 리뷰 워크플로우 등 엔터프라이즈 CI/CD 경험이 뛰어납니다. Cloudflare Pages도 PR 프리뷰를 지원하지만 통합 도구의 성숙도는 Vercel이 앞섭니다.
Q4. Cloudflare Pages에서 D1 데이터베이스는 얼마나 쓸 만한가요?
A: 2026년 기준 D1은 안정화 단계에 접어들었습니다. 무료 500MB, 유료는 $0.001/100만 행으로 매우 저렴합니다. SQLite 기반이므로 PostgreSQL 대비 고도 조인·트랜잭션은 제한되지만 블로그·도구 사이트·소규모 SaaS에는 충분합니다.
Q5. Vercel Pro와 Cloudflare Pages 유료의 가장 큰 차이는 뭔가요?
A: 비용: Vercel Pro $20/월 vs Cloudflare Workers Paid $5/월. 기능 차이: Vercel은 더 긴 함수 실행 시간(300초), 더 높은 메모리(1GB), Node.js 런타임을 제공. Cloudflare는 더 많은 PoP, 콜드 스타트 <1ms, 저렴한 데이터 서비스 번들 제공.
Q6. 트래픽이 갑자기 몰릴 때 어느 플랫폼이 더 안정적인가요?
A: 두 플랫폼 모두 자동 스케일링이 됩니다. Cloudflare는 310개+ PoP에 분산된 V8 Isolate 방식으로 스파이크 트래픽에 매우 강합니다. Vercel은 AWS Lambda 기반이며 콜드 스타트 이슈가 있을 수 있지만 Pro 플랜에서는 상당히 안정적입니다.
Q7. SEO에 영향을 미치는 Core Web Vitals 점수는 어디가 더 좋나요?
A: 동일한 코드를 배포했을 때 Cloudflare Pages가 평균 TTFB에서 유리합니다 (약 19ms vs 56ms 전 세계 평균). LCP·FID 등 Core Web Vitals에서도 Cloudflare Pages가 약간 높은 점수를 보이는 경향이 있습니다. 단, 코드 품질과 이미지 최적화가 훨씬 큰 영향을 미칩니다.
Q8. 스타트업이라면 처음에 어느 플랫폼을 선택해야 하나요?
A: 초기 비용 절감이 중요하다면 Cloudflare Pages로 시작하고, 팀이 성장하고 Next.js 풀스택 기능이 집중적으로 필요해지면 Vercel로 전환하는 전략이 현실적입니다. Cloudflare Pages에서 시작해 규모가 커지면 Vercel로 마이그레이션하는 경로가 충분히 가능합니다.
이 포스팅은 제휴마케팅이 포함된 광고로 커미션을 지급 받습니다.
🔧 이 글과 관련된 무료 도구
이 글과 관련된 상품 (Vercel)[광고/제휴]
이 포스팅은 쿠팡 파트너스, 아마존 어소시에이트, 알리익스프레스 제휴 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다. 이는 상품 가격에 영향을 주지 않습니다.
As an Amazon Associate, Coupang Partner, and AliExpress affiliate, I earn from qualifying purchases at no extra cost to you.
관련 글
2026년 블로그 SEO 완벽 가이드. 구글 E-E-A-T·AI Overview·코어 업데이트 대응 전략. 롱테일 키워드·FAQ 구조·테크니컬 ...
IT2026 AI 코딩 도구 비교 — GitHub Copilot vs Claude vs Cursor 실사용 후기GitHub Copilot, Claude Code, Cursor를 6개월 이상 실사용한 후기 및 2026년 최신 기능 기준 성능·가격·생산성 완...
IT노션 업무 자동화 완벽 가이드 — API 연동부터 템플릿까지ITVPN 추천 2026 — 속도·보안·가격 비교 TOP 5 (실측 데이터)