Static vs Dynamic Pages in Next.js

Next.js pages can be rendered statically at build time or dynamically on each request depending on data needs.

Static Page

Static pages are generated once and cached. Every user sees the same content instantly.

fetch("API", { cache: "force-cache" });

Example static data: sunt aut facere repellat provident occaecati excepturi optio reprehenderit

Dynamic Page

Dynamic pages fetch fresh data on every request.

fetch("API", { cache: "no-store" });

Example dynamic data: qui est esse

Key Differences

• Static = pre-rendered and cached
• Dynamic = rendered per request
• Static = faster delivery
• Dynamic = always fresh data
• Static = scalable
• Dynamic = flexible

Real-World Example

Static pages suit blogs or docs. Dynamic pages suit dashboards or live inventory systems.

Interview Tip

Static pages are built once and cached, while dynamic pages fetch data on each request for real-time updates.