Q50: What are the main architectural tradeoffs of the Pages Router compared to the App Router?
- Pages Router Strengths: Simple mental model, proven stability, straightforward page-level data methods (
getStaticProps/getServerSideProps), extensive legacy ecosystem support. - Pages Router Tradeoffs: Larger client JS bundle sizes (no React Server Components), rigid page-level layout constraints (lacks nested layout tree persistence), coarse request-time data fetching granularities.
Key Takeaways
- Pages Router: Page-centric rendering with mandatory client hydration.
- App Router: Component-centric rendering powered by React Server Components and nested layouts.
Knowledge Check
What primary React capability is available natively in the App Router but absent in the Pages Router architecture?