Next.js, positioned as a React framework for the enterprise, is available in a new version that emphasizes static site generation. The update, Next.js 9.3, was released on March 9.
Next.js 9.3 includes API additions that provide built-in, optimized static site generation through new data-fetching methods. These methods include `getStaticProps`
, which is used to fetch data at build time and specify dynamic routes to pre-render based on data, and `getServerSideProps`
, which fetches data on each request.
Next.js 9.3 also features a way to offer parameters to statically generate static pages for dynamic routes, called `getStaticPaths`
. The new methods offer advantages over the previous `getInitialPaths`
model, providing a clear distinction between server-side rendering and static generation.
Other new capabilities and improvements in Next.js 9.3 include:
- A 32KB reduction in the runtime for all Next.js applications, done through optimizations.
- Preview Mode, for bypassing statically generated pages to display drafts from a CMS.
- Built-in Sass support for global stylesheets, with applications now able to directly import
.scss
files as global stylesheets. - Built-in CSS module support for component-level styles, in which locally scoped CSS can be imported and used in an application, using the
`module.scss`
file convention. - Automatic static optimization for the 404 page, with improved reliability and speed by statically serving the 404 page.
All changes cited for Next.js 9.3 are non-breaking and backward-compatible. To access the upgrade, developers should run the following command:
$ npm i next@latest react@latest react-dom@latest