feat(APP-469): upgrade to Next.js 16 with React Compiler and Turbopack

[tyhonchik]

Description

• Bump Next.js to 16 and other deps
• Enable React Compiler and Turbopack resolve aliases
• Replace webpack config with serverExternalPackages and empty browser fallbacks
• Use next experimental-analyze for build:analyze
• Rename middleware to proxy and middlewareUtils to proxyUtils

Summary

Upgrade from Next.js 15.5.12 (Webpack) to Next.js 16.1.6 (Turbopack) with React Compiler and deferred AppKit initialization.

What changed:

• Next.js 15 → 16: Turbopack replaces Webpack as the default production bundler. Build time drops from ~68s to ~19s (3.5x faster), .next output from 3.0 GB to 166 MB (18x smaller), build warnings from 8 to 0
• React Compiler enabled: babel-plugin-react-compiler provides automatic component memoization at build time
• Webpack config → Turbopack config: replaced webpack block in next.config.mjs with serverExternalPackages + turbopack.resolveAlias; added src/empty.ts stub for react-native/async-storage browser fallbacks
• Sentry config updated: disableLogger → bundleSizeOptimizations.excludeDebugStatements (replaces deprecated API)
• middleware.ts → proxy.ts: renamed middleware and its utils to follow Next.js 16 conventions
• CI/CD simplified: removed shared-build.yml workflow; deployment jobs no longer depend on a separate build step (Vercel handles builds)
• Deferred AppKit init: moved createAppKit() from module-scope side effect to a lazy ensureAppKit() called from ConnectWalletDialog. Reduces initial JS parse cost on every page — transferred size delta halved from +22% to +10% vs N15

Performance tradeoff (warm Vercel preview, 3 runs × 5 pages):

Metric	N15 → N16	Notes
TBT	−34% (35 → 23 ms)	Less main-thread blocking on every page
LCP	+10% (1,781 → 1,961 ms)	Light pages improve (Settings −7%), data-heavy regress
FCP	+1.4% (flat)	Within noise
Transferred	+10%	Turbopack chunking overhead, partially offset by deferred AppKit
CLS	No change	Visual stability intact

Full impact analysis: Next.js 15 → 16 Upgrade: Impact Analysis

Type of Change

• Major: Breaking change (change that would cause existing functionality to not work as expected)
• Minor: Feature (non-breaking change which adds new functionality)
• Patch: Enhancement (non-breaking change to an existing feature)
• Patch: Bug fix (non-breaking change which fixes an issue)

Developer Checklist:

• Manually smoke tested the functionality in a preview or locally
• Confirmed there are no new warnings or errors in the browser console
• (For User Stories only) Double-checked that all Acceptance Criteria are satisfied
• Confirmed there are no new warnings on automated tests
• Merged and published any dependent changes in downstream modules
• Selected the correct base branch
• Commented the code in hard-to-understand areas
• Followed the code style guidelines of this project
• Reviewed that the Files Changed in Github’s UI reflect my intended changes
• Confirmed the pipeline checks are not failing

Review Checklist:

• (For User Stories only) Tested in a preview or locally that all Acceptance Criteria are satisfied
• Confirmed that changes follow the code style guidelines of this project

[linear]

APP-469 Upgrade NextJs to v16

[github-actions]

🚀 Preview Deployment: View Here

[github-actions]

E2E Smoke Results

Base URL	https://app-next-goepy8f4a-aragon-app.vercel.app
Suite	smoke
Result	✅ passed
Run	#3741

[milosh86]

looks good, left a couple of Qs

[milosh86]

Looks good 👍