Cool Features Of Next JS 12

Raghav Mrituanjaya

Cover Image for Cool Features Of Next JS 12

Today at Next.js conf, Vercel the company behind next.js announced the public availability of next.js 12 which brings a lot of cool features into action

Rust Compiler Makes build and Refreshes faster

Next.js 12 includes a brand new Rust compiler that takes advantage of native compilation which gives 3x faster refresh locally and 5x faster builds for production which can reduce your CI/CD build time drastically. To turn on the Rust minify feature add swcMinify: true to your next.config.js file

URL Module Imports ๐Ÿ˜

Next.js 12 supports CDN module imports which means you can import any HTTP(S) dependencies as a local module. To import any HTTP(S) module just add the following lines to your next.config.js file

module.exports = {
	experimental: {
		urlImports: ['', '']

Now you can import the module by
import confetti from ''

I think it's time to say goodbye to hefty node_modules ๐Ÿค”. What do you guys think do let me know in the comments below

Middleware supports

If your app has a common logic for all the server-side rendering this is an amazing feature that lets you share logic between different pages

// pages/_middleware.js
export function middleware(req, ev) {
	return new Response('Hello, world!')

AVIF support ๐Ÿ˜

Out of the box, Next.js 12 supports AVIF image optimization, Reducing your image size by 20% more than WebP
To enable this feature just add the following to your next.config.js file

images: {
	formats: ['image/avif', 'image/webp']


  • There were more features that were introduced on Next.js 12 which were not listed here as it contains only some of the cool features that I personally like. To know about all the features kindly read their Post on all the features
  • Run yarn add [email protected] or npm i [email protected] to install Next.js 12
Buy Me A Coffee
How Can You Make Your Site Faster ๐Ÿš€ Using A CDN? cover image

Raghav Mrituanjaya

ยท min read

Making a REST API Using Python - Flask cover image


Making a REST API Using Python - Flask

This post explains to you an easy way to create REST API using Flask which is a popular python micro...

Raghav Mrituanjaya

ยท min read

What is Flask(Python)? - Web Development cover image


What is Flask(Python)? - Web Development

A small introduction to web development in python using flask, comparison with Django, and a starter...

Raghav Mrituanjaya

ยท min read

ยฉ 2023