Next. Js 12 was released today, the biggest release to date, with a lot of exciting new features.

Rust compiler support

For JS ecosphere, it is a bombshell, marking the further invasion of non-JS languages into JS ecosphere.

Next. Js 12 uses SWC, and we hired SWC author DongYoon Kang for the production environment. Now many projects, such as Esbuild for Vite. Inevitably, more and more work will be done by other languages. The js tool chain will be richer and richer. Things like BabelJS, Webpack, etc.

In addition to SWC authors, discover Next has also recruited Maia Teegarden, one of the core developers of Parcel, another well-known compilation tool.

With SWC, the official result is a 3x refresh speed and a 5x build speed

SWC is 17 times faster than Babel at converting JS and TS code, and 7 times faster than Terser at compression.

A new Css Parser was written in Rust specifically to be compatible with Babel transformations.

Babel can write its own plugins in JS, but if Rust is used in the future, how to deal with the customization requirements and how to solve the existing Babel plugins is a problem in front of us.

The React 18 support

React 18 is not officially available yet, but Next. Js is supported, very up-to-date and can be opened in experimental mode.

Suspense, Server Components, and many other features are available now

ES module and URL imports are supported

This is also a welcome feature. The ES module is natively supported in browsers, which greatly reduces module dependency parsing time. Tools such as Vite and Snowpack are based on this feature.

In addition to module parsing, browsers also support loading JS directly from remote sources, such as

import confetti from 'https://cdn.skypack.dev/canvas-confetti'
Copy the code

You don’t need to install it locally.

If you go one step further, with import maps, local dependencies on node_modules are almost zero, and rails7 is ahead.

The ES module supports +http2 + CDN, which can solve the headache of node_modules size problem, so it can be skipped in the future.

Picture AVIF support

This is a new image format that was officially introduced in 2019 and is 20% smaller than webP.

Next. Js can automatically choose to use AVIF or Webp based on browser sniffing.

According to the need to pack

Analysis relies on only hitting needed packages, greatly reducing the volume.

You can see how much progress these initiatives have made, and there’s every reason to try this framework