Next.js adds incremental static pages regeneration

Next.js adds incremental static pages regeneration

New mechanism for page updates in Next.js 9.5 promises to eliminate latency spikes and prevent pages from ever going offline

Credit: Dreamstime

Next.js, a framework for building applications that leverage the React JavaScript UI library, is getting a refresh. Next.js 9.5 adds capabilities including incremental static regeneration and rewrites/redirects support.

Incremental static regeneration updates pages by re-rendering them in the background as traffic flows in. Traffic is served uninterrupted, statically, with the newly built page pushed only after it is done generating. Benefits include no spikes in latency and pages never going offline.

Support for rewrites aids in incremental adoption of Next.js, allowing developers to make an incoming request with a different destination path, including external URLs. Support for redirects, which are used in situations such as changing the structure of application routes, takes the form of a list of redirects in next.config.js under the redirects key.

Developed by edge network provider Vercel, open source Next.js is intended as an enterprise-level tool for purposes including building static websites, pre-rendered apps and mobile web apps.

Other new features and improvements in Next.js 9.5 include a basePath configuration option enables easy hosting of a Next.js application on a subpath of a domain. Developers may want to host an application under a subpath such as /docs so the application only covers that subsection of a domain.

In addition, a trailingSlash option is offered as part of next.config.js. When this option is set to true, Next.js will automatically add a trailing slash to URLs.

Furthermore, JavaScript bundles use content hashes instead of the build ID - which allows for pages that have not changed between deploys to stay in the browser cache without having to be downloaded again - while Fast Refresh, introduced in Next.js 9.4, has been refined to show more helpful application error messages.

Delving deeper, production React profiling is also available - a previously introduced Profiler API enabled tracking of performance issues in React components, but required a separate version of ReactDOM to be used to profile in production. With Next.js 9.5, developers can automatically set up correct aliases for react-dom and scheduler modules.

Optional catch-all dynamic routes provide more flexibility and choice in application routing needs, with the feature is labelled as experimental in documentation. Finally, beta support is offered for the Webpack 5 module bundler, which has improvements such as better tree-shaking and persistent caching.

Tags javascript

Show Comments