Next.js 13 beta released


The long-anticipated major update of the popular JavaScript framework, Next.js, has finally arrived.

Let's see what's new.

System requirements



Native support for custom images and fonts


Improved performance, on-demand image resizing, and images loaded only when they are in the viewport, just to name a few improvements to the image handling in Next.js 13.

The fonts now include automatic self-hosting for any font file, improving performance and UX.


Script optimisation


The script component (next/script) allows loading third-party scripts anywhere in the Next.js app, including inline scripts.

Scripts can also be offloaded to a worker by adding strategy="worker", like so:

import Script from 'next/script'  
export default function MyPage() {   
  return (

However, this is an experimental feature and must be turned on in next.config.js.



Routing is now redone and route files and directories are live (optionally) in the app/ directory. Layouts, error handling and loading states are also easier to work with.



Turbopack is replacing Webpack. Turbopack is 4 times faster on cold start than Webpack and handles updates 700 times faster than Webpack. Turbopack supports TypeScript, JSX, CSS and others out of the box.



The newly introduced features seem to be inspired by SvelteKit.

Either way, these are genuinely refreshing features in Next.js and will make creating websites more pleasant.


Next.js is created by Vercel. The Next.js logo used in this article is under a CC licence.