About
I was testing some Next.js features and how they affect navigation performance. I decided to create this demo project to share it and make it easier to understand the differences.
Demos
App Router
Static
Static pages with app router.
Dynamic
Dynamic pages with app router.
Suspense
Using Suspense for loading state.
Loading
Adding a loading.tsx file.
Edge Runtime
Using the faster Edge Runtime.
Client Cache
Client-side router caching.
Server Cache
Caching the dynamic content on the server-side.
Partial Prerendering
Combining static and dynamic rendering.
Prefetch
Prefetching pages for instant navigation.
Almighty
Combining multiple optimizations for best performance.