Loving Next.js 13 & All The New Features
Jan 13, 2023

BIG ASS(terisk) NOTE: Some features in Nextjs 13 are still experimental, but fully (and incrementally) upgradeable. Most new features are still in alpha (not even in beta yet) so don't blame me if your project suffers a blowout because you didn't read the docs....

It's important to understand that I’m not beating my blog-drums with a tone of, “ng and Vue all suck, React/Next.js is the only/best place to be….” because at anytime, Angular, Vue or React can issue an update and release some cool new features, giving their respective technologies a sudden edge over the other 2 front-end technologies. The front-end space has been very active in the last few years so if you give it a few weeks I bet your favorite front end stack will likely issue its own update(s) including the very feature other frameworks are blowing their own horns about.

Cool new features, in no particular order:
· First of all unless you say otherwise all of your components are now server side components. You can still run client side components but this may impact how you (re-) architect your new or migration project.

· Next.js' new server-side-component-approach builds on React's new fetch() API emphasis . Ask for your data and you'll get a returned promise. Add in request de-duping and it still maintains its own caching and revalidating. getServerSideProps(), getStaticProps(), getInitialProps() are now deprecated in favor of the new data fetching/server side component approach. That front end data requesting paradigm needed a little bit of clean-up; I'm glad to see how easy they've now made it. Pretty cool stuff.

· Reserved page names like loading.tsx, not-found.tsx, error.tsx . These pages display as these http events are encountered. Simple, easy to use and about time.

· Layout and UI experts will really like Next.js' Pages and Layouts , which now make site-wide layouts and sub-sites easier to format and manage.

· Lots and lots of little features , like SEO is now easier with version 13. Streaming page content progressively rendered and incrementally streamed as it becomes available to the requested page during hydration.

· Performance gains up-the-wazoo: Developers will enjoy the devex and deployments will also benefit from Turbopack's replacement for Webpack. 700x faster than Webpack (and even faster than Vite)!

My understanding is that almost all of these new features can be incrementally added to your project, and from my own experiences - so far so good. As I get into rolling out some of the more impressive features I'll post about them separately.