CODEWITHSUNDEEP
javascriptnext.jsfrontendserver-side-renderingpre-rendering
Fateme Hemmati
Fateme Hemmati

Reputation: 55

does nextjs prerender all pages or only the first page?

I'm learning nextjs and read in some places that nextjs only prerenders the first page and in some other places they say nextjs prerenders all pages by default so I cant understand which one is true

Upvotes: 4

Views: 2102

Answers (1)

JeanJacquesGourdin
JeanJacquesGourdin

Reputation: 1843

There are different rendering stategies. You can select which one NextJs will choose for each page by adding a method in your page file.

  1. getStaticProps will prerender an HTML file ate the build time, you can still have a useEffect to hydrate the content of the page.

  2. getStaticPath is kinda same but you can prerender differents pages for different routes, or on demand on non existing paths if fallback: 'blocking'is provided

  3. You can also go form ISR (Incremental Static Regeneration), an inbetween Static/SSR, where pages are generated on the demand and cached for the amount of time specified by adding revalidate.

  4. getServerSideProps will render the page on demand

Every one of this rendering strategies have strength and drawbacks, static pages are useful for first render but can need another round trip to hydrate content. Server render is usefull for SEO but can yield to higher server CPU usage.

What is nice is that you can choose which strategy to employ depending on the page you render.

Edit: I did not add it but the principe of these methods is that you fetch data/do stuff in them, and their return statement will be consumed by the page they live in as parameters.

Upvotes: 2

Related Questions