Keynote

Title: Highlights of Next.js Conf 2023 Keynote by Guillermo Raunch

Author: Umair Anwar

Subject: Next.js

Language: English

Introduction

Guillermo Rauch started building Next.js seven years ago with the aim to have blazing fast framework without worring about the tools much. Now we have grew to a community of 850,000 active developers worldwide using Next.js.

Vote

To make this Keynote personalized, a vote was conducted at the below url:

next.js.org/vote

The top choices were in the following order;

nextjs 14
performance
Ecosystem
App Router

App Router

The app router is designed to be Flexible, powerful and faster.

Flexible

Nested Layouts
Colocated files
Metadata API
Simple Data Fetching
Extend Web APIs

Powerful

Async Components
Server Actions
On-Demand Revalidation
Static and Dynamic
Integrated Caching
Cache Tags

Faster

Server Components
Integrated Caching
Optimized Compiler
Streaming
Faster Cold Boots
Less Client JS The react app router adoption to this date is upto 8263 websites. This really means that it has been battle tested.

Next.js 14

No new APIs, hurray.
New API Docs.
Updated Designs.
Improved Search.
nextjs.org/learn: A complete guide to build with the App Router and everything you need to ship a production grade next.js sapplication.

React.js and App Router

The next.js framework is built on top of react.js but it used hooks like suspense to fill components and it needed a new router, a new data fetching system and a streaming architecture. This vision actually visualized the new app routher.

Server Actions

With Next.js 14, server actions are stable.

Performance

22% Faster Initial Compile
29% Faster Code Updates: It means when a developer saves and it appears in the browser. These improvements are as a result of implementing Next.js in RUST and will be in RUST for now. The goals are;

Fast dev server
Fast code updates
Fast builds

Performance improvements that turbo-pack is going to unlock.

RUST powered Compiler
53% Faster Initial Compile
5000 Tests passing
94% Faster code updates

next dev --turbo

The turbo-pack is under development. To keep track of it, visit areweturboyet.com

Simplify Next.js

The speed of the website can be measured in following metrics.

Fast Initial Visual
Fast Dynamic Visual
Great DX

Partial Pre-Rendering.

The static content is pre-rendered at compile time and also pre-render the fallbacks of the dynamic content. Next.js can give static content immediate and then start to stream the dynamic content to fill in.

Review of the Keynote

As a developer, I am mainly interested in speed and ease of development. This is This is something that Next.js is taking headon by giving us the ability to code both backend and frontend in one place. The app router, performance and the server-actions are the key differentiators. Personally, I am developing my 2nd project in Next.js and I will start upgrading them to Next 14. Hopefully, server actions will help me reducing a few APIs.

Wish you best of luck, Next.js team.

Happy Coding!