MENU

Server Component (Static Rendering)

Static Rendering in Next.js involves rendering routes at build time or in the background after data revalidation. The rendered result is cached and can be distributed via a Content Delivery Network (CDN). This method is ideal for routes with non-personalized data that can be determined at build time, like static blog posts or product pages, allowing the same content to be efficiently shared across users and requests.

By default (without a dynamic function and an uncached data request), Next.js will render a page statically. This means that the page will be generated at build time and served as a static file.

If you build the site statically and then run the production server (instead of running on the hot-reloeading development server here), you will see all 'counts: 2' even after you refresh the page.

Because Next.js tries to fetch the data at build time, you should consider running a separate server listening to a different port for the API end points.