What Next.js 13 actually means for clients

This is a brief "layman's" rundown of features for Next.js 13 from the perspective of a client. Rather than the "why", we are focusing on "what" it actually means.

app/ Directory (beta) - you get the absolute latest from React - better performance and better scalability due to enforcing the way developers layout code. It's basically explained perfectly on this website - Next.js just pretty much stole Remix's unique selling point (kind of...)

Turbopack (alpha) - Faster website builds: when you make a change, your website should show it in production faster... Although it’s in Alpha right now, so you probably shouldn’t be running it on production - unless you’re the kind of person that likes running with scissors

New next/image (stable) - it means your images will react more natively on your website - in other words you won’t really notice but Google will.

New @next/font (beta) - font is usually the main culprit for why your website looks crappy when it first loads. This completely solves this issue. No more Times New Roman appearing for a brief half second.

Improved next/link - Simplified API with automatic <a> - this was something that is easily missed out from a website with potentially catastrophic SEO effects. If you’ve ever noticed your website isn’t linking from page to page correctly in Google Analytics - this was probably the reason. It’s very easily done, and this update essentially rules out the possibility of forgetting to put a <a> and Google not knowing that two pages are linked together.