Vercel, the company behind the React and JavaScript framework Next.js, announced the release of Next.js 11 at its Next.js Conf.
New improvements include faster starts and changes, real-time feedback, live collaboration, and image optimizations.
Vercel announced a preview of Next.js Live, which enables developers to develop in their web browsers. According to the company, this allows developers to collaborate and share with a URL, leading to faster feedback loops, less time spent waiting for builds, and real-time peer programming.
The company also announced that the Aurora team at Google Chrome has created Conformance, which provides solutions and rules for optimal loading. Conformance offers script prioritization and font enhancement automations which can reduce First and Largest Contentful Paint times, enabling developers to improve Core Web Vitals scores.
“At Google Chrome, we believe our collaboration with Next.js is an example of how to set predictable outcomes for loading performance,” said Houssein Djirdeh, developer advocate at Google. “We love working together with great frameworks to help developers make the web faster and we’re incredibly grateful for the maintainers and sponsors of the frameworks that enable the web to thrive. A special thanks to the Next.js team for testing with us and sharing the cost of many early attempts.”
Next.js 11 also adds a new tool to help developers migrate from Create React App to Next.js. According to Vercel, there has been an increase in these migrations over the past six months. The new tool adds a ‘pages/’ directory, moves CSS imports to the right location, and enables a Create React App compatibility mode which ensures patterns work with Next.js.
In addition, with this release webpack 5 is now the default configuration for all Next.js applications.
Image optimizations in this release include automatic size detection for local images and support for blur-up image placeholders to ease the transition from blank spaces to images.
“Whether you’re starting with a single static page or deploying a dynamic site with billions of pages, Next.js is the hybrid framework that meets you where you are and grows with you,” said Vercel CEO Guillermo Rauch. “We believe the fastest and most enjoyable end-user experience must go hand in hand with the fastest and most enjoyable developer experience.”
