ProNextJS
    Loading
    lesson

    Why You Should Choose Next.js

    Jack HerringtonJack Herrington
    Code

    Next.js has emerged as the clear front-runner among server-side rendered frameworks, outshining competitors like Remix, Redwood, and Waku. Let's dive into the key features that set Next.js apart and make it the go-to choice for building modern web applications.

    React Server Components

    React Server Components, introduced in React 19, revolutionize the architecture of server-side rendered applications. These components render on the server, can be asynchronous, request data from servers or databases, and their code is not sent to the client. Currently, only Next.js and Waku support this groundbreaking feature.

    Streaming

    Streaming is a vital feature for complex applications that demand high performance. With streaming, the server can send back the page content as soon as it's available, even if some data is still pending. Next.js has built-in streaming support in its app router, making it incredibly easy to implement. Simply wrap your component in a React Suspense component, and you're ready to go.

    <Suspense fallback={<Loading />}>
  <YourComponent />
</Suspense>

    Remix also supports streaming but requires an additional Await component provided by the framework.

    Partial Pre-Rendering

    Partial Pre-Rendering is another capability exclusive to Next.js. It allows you to send back the shell of your app to the customer within milliseconds of their request, while the content streams in as it becomes available.

    Parallel Routing

    Next.js offers Parallel Routing, enabling you to segment portions of the page into blocks and individually stream each section. This is another feature that is exclusively available in Next.js.

    Flexible Rendering Modes

    While Remix, Redwood, and Waku are server-driven frameworks that require a running server to serve pages, Next.js offers flexibility in rendering modes. You can selectively statically generate pages (SSG) for parts of the application that don't require server-side rendering for every request. This results in significant performance gains and allows you to tailor your rendering strategy based on your application's needs.

    A Practical Focus on Building Applications

    Next.js is known for its practical focus on building real-world applications. While Waku emphasizes flexibility and options, and Remix prioritizes standards compliance, Next.js strikes a balance between these aspects while maintaining a strong emphasis on application development. This practical approach has earned Next.js a loyal following among developers.

    While download count isn't everything, Next.js has 20 times more downloads than its nearest competitor, Remix. Because of this popularity and the size of the community, SaaS companies often prioritize Next.js when releasing wrappers for their APIs.

    The abundance of educational resources, such as courses and YouTube videos, further solidifies Next.js as the popular choice for learning and implementing server-side rendered applications.

    Next.js has earned its reputation through its reliability, responsiveness to customer needs, and focus on real-world application development.

    To sum things up, you've made the right choice in learning Next.js, and you've made an even better choice by learning with this course!

    Transcript

    So let's say I've sold you on using a server-side rendered framework, like Remix or Next.js. Why should you choose Next.js as opposed to one of those like Remix or Redwood or Waku? So let me give you a few reasons why Next.js in particular is, in my opinion, the clear winner right now.

    And has been for a while. Let's break down some key features. First up, React Server Components. These are a new type of React component, came out with React 19. Any render on the server, they can be asynchronous and request data from servers or databases and their code is not sent to the client.

    It's a revolutionary approach to the architecture of server-side rendered applications. And at the time of this production, as I'm recording this video right now, it's only available on Next.js and Waku. Another business critical feature of the Next.js app router is streaming. Most of the time our web servers are talking to back-end services or databases and those

    can take a long time to respond. But we want to send back the page right away, we want to be snappy. And what streaming allows us to do is send back the content of the page for the day that we have and then hold that connection open as new data comes in and then stream that to the client where it updates in place.

    And that is a critical feature for complex applications that also want to be performant for the customer. Streaming support is built right into the Next.js app router at the base level. All you need to do is just wrap your component in a React Suspense component and you've got streaming.

    Streaming is available on Remix as well, but it requires an additional Await component and that's provided by the Remix framework. And speaking of performance, there's an awesome feature called Partial Pre-Rendering. And what Partial Pre-Rendering does is it allows you to send back the shell of your app to the customer just like milliseconds after they make a request and then the content

    stream back in as they come in. It's really cool and it is exclusively a Next.js feature. Another wildly underrated feature of Next.js is Parallel Routing. It gives you the ability to segment portions of the page into blocks and then individually

    stream each section and it's again only available on Next.js. Then there are rendering modes. So Remix and Redwood and Waku are server-driven frameworks. That means you need to be running a server in order to get pages out of them.

    Of course, you can run Next.js that way, but you can also selectively statically generate pages or statically site-generate or SSG and that's a huge performance win if you have parts of that application that don't need to go back to the server for every request. And finally, in our comparison, and I admit that this is a bit more subjective, but from

    my experience, I've seen that Next.js tends to be more practically focused on building applications. So in comparison, Waku I think is focused primarily on flexibility and options and that's great because they're exposing what we can do with all of React 19 and that's fantastic.

    And Remix is primarily focused on being like a standards compliant framework. They're really into that, which is super laudable. But Next.js and Redwood.js I would say are the two that are practically focused on building applications. Redwood.js in particular has actually, I would say, even more focused on building applications

    than Next.js. So I think when you add it all up, Next.js is the clear front runner when it comes to server-side rendered frameworks. And one last reason, and I'm not a huge fan of this argument, but I think it is relevant, is popularity.

    Next.js has 20 times more downloads than the nearest SSR framework, Remix. There's also a huge community around it and lots of skilled developers who are familiar with it. And when SaaS companies release web developer-centered technologies like Auth or databases, they

    usually come out with wrappers that support Next.js first. There's also a vibrant ecosystem around Next.js, including projects like SST and OpenNext. Not to mention all the educational resources that are available for it, including of course this course and YouTube videos and all the rest.

    And it's really not surprising that it's gotten this big because it's, one, it's been around for a long time, but it's also been very reliable and they've been really responsive to customer needs and the needs of folks trying to build real world applications. And that's why it's got a very loyal following of developers.

    So to sum up, I think you made the right choice in learning Next.js and you made the right choice in learning it with this course.