vinext: The Next.js Alternative Built for Speed on Cloudflare
Quick Take: What You Need to Know About vinext
| Key Feature | What It Means for You |
|---|---|
| What It Is | A drop-in replacement for Next.js that runs on Vite instead of Turbopack |
| Main Benefit | Builds apps up to 4.4x faster with 57% smaller file sizes |
| Cloudflare Integration | Deploy directly to Cloudflare Workers with one command: vinext deploy |
| Compatibility | Works with 94% of Next.js 16 features. Your existing app/, pages/, and next.config.js files work without changes |
| Current Status | Experimental but already in production use by some companies |
| Best For | Next.js developers who want faster builds and easy Cloudflare deployment |
| Not Ready For | Sites that need 100% static pre-rendering at build time (coming later) |
1. What Is vinext?
vinext (pronounced "vee-next") is a new tool that rebuilds the popular Next.js framework on top of Vite, a different build system. Think of it as a new engine for your Next.js car. The outside looks and drives the same, but under the hood, everything works faster and more efficiently.
Cloudflare built vinext in just one week using AI assistance. It cost about $1,100 in AI tokens to create. The goal was simple: let Next.js developers deploy their apps to Cloudflare Workers without complicated workarounds.
The name "vinext" combines Vite and Next.js, showing how these two technologies work together.
2. How to Use vinext
Getting started with vinext takes just a few minutes. You have three ways to migrate your existing Next.js project:
Method 1: Use an AI Agent (Recommended)
npx skills add cloudflare/vinext
Then open your project in Cursor, Claude Code, or OpenCode and tell the AI: "migrate this project to vinext." The AI handles everything.
Method 2: Automatic CLI Migration
npx vinext init
This command checks your project, installs dependencies, and sets up the configuration for you.
Method 3: Manual Installation
npm install vinext
Then change your package.json scripts from "next" to "vinext".
After migration, these are the commands you'll use:
| Command | What It Does |
|---|---|
vinext dev |
Starts the development server with hot module replacement |
vinext build |
Creates a production-ready build of your app |
vinext deploy |
Builds your app and deploys it to Cloudflare Workers |
3. Core Features
vinext brings together the best of Next.js and Vite with special Cloudflare integration. Here are the main features explained simply:
Next.js Compatibility
- App Router Support: Nested layouts, loading states, error boundaries, parallel routes, and intercepting routes all work exactly as they do in Next.js
- Pages Router Support:
getStaticProps,getServerSideProps,getStaticPaths,_app, and_documentfunction normally - All next/ Imports*: 33 module shims cover every import like
next/link,next/image,next/navigation, andnext/server
React Features
- React Server Components: "use client" and "use server" directives work correctly in both development and production
- Server Actions: Form submissions, mutations, and redirect() inside actions all work with full FormData support
- Streaming SSR: Server rendering streams content with Suspense boundaries for both routers
Performance Improvements
- 4.4x Faster Builds: Compared to Next.js 16 with Turbopack, vinext with Vite 8 and Rolldown builds much quicker
- 57% Smaller Bundles: Gzipped client bundles shrink from 168.9 KB to just 72.9 KB
- 2,080+ Tests: Extensive testing with Vitest and Playwright E2E ensures reliability
Cloudflare Integration
- One-Command Deploy:
vinext deployauto-generates Worker config and ships your app globally - ISR with Cloudflare KV: Incremental Static Regeneration works with KV storage for caching
- Full Platform Access: Use Durable Objects, AI bindings, KV, and R2 without workarounds
- Traffic-aware Pre-Rendering: Experimental feature that pre-renders only popular pages based on actual traffic data
4. Use Cases
Different developers will find vinext useful for different situations. Here are the most common scenarios:
For Next.js Developers Moving to Cloudflare
You have a Next.js app and want to deploy it to Cloudflare Workers. Instead of fighting with adapters and workarounds, vinext lets you deploy with one command. Everything works the same, but now your app runs on Cloudflare's global network.
For Teams Needing Faster Build Times
Your Next.js app takes 10 or 15 minutes to build, slowing down your team. vinext cuts build times dramatically. What took 7.38 seconds in Next.js takes just 1.67 seconds with vinext. Your developers ship features faster.
For Sites with Traffic Spikes
You run an e-commerce site with thousands of product pages. Most pages get little traffic, but a few popular products get millions of visits. vinext's Traffic-aware Pre-Rendering builds only the popular pages at deploy time. Everything else renders on-demand and caches after the first visit. Your builds stay fast even as your catalog grows.
For Apps Using Cloudflare-Specific Features
You want to use Durable Objects or AI bindings in your Next.js app. With regular Next.js, testing these features in development is tricky. vinext runs everything in workerd, the same runtime as Cloudflare Workers, during both development and production. What works in dev works in production.
For Cost-Conscious Teams
Smaller bundle sizes mean faster load times for users and lower bandwidth costs for you. A 57% smaller bundle saves money on every page view.
5. Frequently Asked Questions
Is vinext ready for production use?
vinext is experimental but already in production use by some companies like National Design Studio for CIO.gov. The team recommends caution for production apps but notes the extensive test suite of over 2,080 tests provides good coverage.
Will my Next.js app work without changes?
vinext covers 94% of the Next.js 16 API surface. Most apps work without changes, but you should check the README for unsupported features. The npx vinext init command checks compatibility during migration.
What about static sites that need pre-rendering?
vinext supports ISR (Incremental Static Regeneration) but doesn't yet pre-render static pages at build time like Next.js does. This feature is on the roadmap. For purely static sites, the team suggests Astro as an alternative.
How does Traffic-aware Pre-Rendering work?
When you deploy with --experimental-tpr, vinext checks Cloudflare analytics for your domain's traffic over the last 24 hours. It finds the pages that get 90% of your visits and pre-renders only those. The rest render on first request and cache afterward. Each new deploy updates the list based on current traffic.
Can I use vinext with other hosting platforms?
Currently, Cloudflare Workers is the main deployment target. However, 95% of vinext is platform-agnostic Vite code. The team got a proof-of-concept working on Vercel in under 30 minutes and welcomes PRs for other platforms.
How was vinext built so quickly?
One engineer used AI assistants (mostly Claude in OpenCode) to write almost every line of code. The project cost about $1,100 in AI tokens over 800+ sessions. The engineer provided direction and quality control while AI handled implementation.
What's the difference between vinext and OpenNext?
OpenNext tries to adapt Next.js build output to run on different platforms. This approach can be fragile because it reverse-engineers Next.js internals. vinext reimplements the Next.js API surface directly on Vite, making it more stable and predictable.
6. Contact Information
- GitHub Repository:
github.com/cloudflare/vinext(for issues, PRs, and feedback) - Blog Announcement:
blog.cloudflare.com/vinext(detailed story of how it was built) - Live Examples:
basic-vinext.prod.beige-skyline.workers.devvinext-cloudflare-agents.prod.bright-sun-8284.workers.dev
- Cloudflare Developer Platform:
developers.cloudflare.com
7. Company Background
Cloudflare built vinext. You might know Cloudflare for their security services like DDoS protection or their free 1.1.1.1 DNS resolver. But Cloudflare also runs a huge developer platform called Cloudflare Workers.
Workers let you run code on Cloudflare's global network of data centers. Your app runs close to your users anywhere in the world. With vinext, Cloudflare makes it easier for Next.js developers to use this platform.
The vinext project shows something new about Cloudflare: they're willing to rebuild existing tools from scratch to make them work better with their platform. The fact that one engineer built it in a week with AI help shows how fast development can happen now.
8. Technology Stack
Understanding the technology behind vinext helps explain why it's so fast:
| Technology | Role in vinext |
|---|---|
| Vite | The core build tool that handles fast development and production builds |
| Rolldown | Rust-based bundler coming in Vite 8 that makes builds 4.4x faster |
| @vitejs/plugin-rsc | Adds React Server Components support to Vite |
| workerd | Cloudflare's JavaScript runtime that runs your app in development and production |
| Cloudflare KV | Key-value storage for caching and ISR |
| Vitest + Playwright | Testing frameworks with over 2,080 tests ensuring quality |
| TypeScript | Full type safety throughout the codebase |
The stack matters because Vite's architecture has structural advantages for build performance. By building on Vite instead of Turbopack, vinext inherits these speed benefits automatically.
9. Alternatives to vinext
Depending on your needs, other tools might work better. Here's how they compare:
| Tool | Best For | Key Difference from vinext |
|---|---|---|
| Next.js | Teams committed to Vercel's ecosystem | Original framework; slower builds but more mature |
| Astro | Content-heavy static sites | Designed for static content; deploys to Cloudflare Workers |
| OpenNext | Running Next.js on other platforms | Adapts Next.js output instead of rebuilding it |
| Remix | Full-stack web apps | Different API; built on Vite but not Next.js compatible |
| SvelteKit | Svelte developers | Different framework; built on Vite |
If you have a purely static site with no dynamic features, Astro might serve you better. If you must stay with standard Next.js for team or policy reasons, OpenNext offers a path to Cloudflare Workers, though with more complexity.
10. What People Also Ask About vinext
Based on developer discussions and common questions, here are the topics people care about most:
"Is vinext just a wrapper around Next.js?"
No. vinext is a complete reimplementation of the Next.js API surface on Vite. It doesn't use any Next.js code internally. This makes it more stable than wrapper approaches.
"Will my next.config.js plugins work?"
vinext aims for compatibility with the Next.js configuration API. Most plugins that work through standard Next.js interfaces should work, but plugins that depend on Turbopack internals might not.
"How does vinext handle image optimization?"
vinext includes a shim for next/image that works with Cloudflare's image optimization features. The implementation aims to match Next.js behavior while using Cloudflare's infrastructure.
"Can I use environment variables the same way?"
Yes. vinext supports .env.local, .env.production, and the NEXT_PUBLIC_ prefix just like Next.js. Environment variables work during build and runtime.
"What about API routes?"
API routes work on Cloudflare Workers. You get full access to the Workers runtime, including platform features like KV and Durable Objects in your API handlers.
"How often does vinext update to match new Next.js features?"
The project is open source and community-driven. Cloudflare has committed to ongoing investment, but new Next.js features may take time to implement. Check the GitHub repository for the latest compatibility status.
"Does vinext support incremental adoption?"
Yes. You can migrate one page at a time if you prefer. The npx vinext init command is non-destructive, keeping your original Next.js setup intact while adding vinext alongside it.
"What happens when Next.js 17 comes out?"
The vinext team will evaluate new APIs and decide which to implement based on community demand. The project maintains its own roadmap independent of Next.js releases.
The Bottom Line
vinext represents a new way of thinking about frameworks. Instead of adapting Next.js to run on Cloudflare, Cloudflare rebuilt Next.js on better foundations. The result is faster builds, smaller bundles, and one-command deployment to the world's fastest network.
For Next.js developers who want Cloudflare's global reach without complicated setups, vinext offers a compelling path forward. It's experimental but proven, with real customers already running production apps. And with AI-assisted development lowering the cost of building software, vinext might be the first of many such reimaginings.
Ready to try it? Install with npm install vinext or visit github.com/cloudflare/vinext to learn more.