Why Upgrade?
Next.js 16 brought significant improvements in build performance, React 19 support, and the new proxy system. We decided the benefits outweighed the migration effort.
Key Changes
1. Middleware to Proxy Migration
The biggest change: middleware.ts is now proxy.ts with a different API:
// Old: middleware.ts
export function middleware(request: NextRequest) {
// ...
}
// New: proxy.ts
export function proxy(request: NextRequest) {
// Same logic, different export name
}2. React 19 Features
We now use React 19's improved concurrent features and automatic batching. The new use hook simplifies data fetching in some scenarios.
3. Turbopack Improvements
Development builds are noticeably faster with the improved Turbopack bundler.
Migration Challenges
- Some third-party packages needed updates for React 19 compatibility
- Type definitions for new Next.js APIs required attention
- Testing the proxy behavior thoroughly took time
Results
Build times improved by ~30%, and the development experience is smoother. The upgrade was worth it.
