Next.js
Data fetch methods (WIP)
4
CSR - Client side rendering (react, vue, angular) SSR - Server side rendering (pHp, java, ASP.net) SSG - Static side generation (nextjs, gatsby, nuxt) ISR - Incremental static (re)generation
CSR
done when seo is not important, page is very dynamic, admin, crm, accounting website Markup from server -> Client & only then fetch data(useEffect) from DB
disadvantages
not SEO friendly
-> fetch on useEffect
not much html in source
SSR
quite dynamic data
fetch data in the server & then send bundle to client on refresh data re-fetched in server
-> serversideprops api call actual html is on source
SSG
blog, service page markup with data prebuilt then send to client if refresh no rebuild of page, just re-served
getstaticprops
ISR
dynamic blog, product page changes sometimes
just like ssg but rebuilds the page in defined interval. so that latest update from db is there
getstaticprops with revalidate in return
How to Build Scalable Architecture for your Next.js Project - Alex Eagleson
Last updated