Partial Prerender - The Next.js Feature I've Wanted For Years

S/O Ph4se0n3 for the awesome edit 🙏

[leerob]

I laughed out loud when you say "that's my job" for reading the blog post. I was totally stealing your move 😂

[LucaMatteis]

This feels to me more of a Vercel feature than a Next.js one. You can't easily configure existing edge CDNs to serve static and dynamic content from a single request

[carloslfu]

Vercel: Not yet recommeded for production use.
Theo: Let's use it in prod! :)

[shadowfaxenator]

We need standard web caching using headers and not nextjs’s proprietary file based solution. That’s why I love remix, we can do the same thing there but using standard caching mechanism of cdn and not only vercel

[wlockuz]

Its cool to see how far Next.js can take React, but in the end Vercel is a private company so you always have to be cautiously optimistic.

[TheIpicon]

I feel like we're coming back around to the behaviors we tried to leave behind with a classic SPA.
Theo always mentions how bad SPAs are, and gives twitter(X) as an example: "you go into the page, see some data first and then you have all this loading spinners until all your data fetches".
now with partial pre rendering we'll have the same behavior (just a bit faster), same as the previous example just instead of "fetches" we'll say "streamed in".
and you'll get a ""you go into the page, see some data first(faster cuz you don't download the whole js bundle) and then you have skeletons(the cool loading spinners) until all your data is streamed in".

[marcoio]

My question here is do we still consider this SSR? in terms of first loading and streaming data later what does a crawler see? I remember that we kind of moved away from plain lib/frameworks like React etc specifically for SEO related problems. Although this seems very cool I wonder, are we going back to the first paradigm?

[BluSmoke]

Does this only work if you host on Vercel? Seems like it’s relying on their edge network, how would this work on self hosted next.js for example?

[connorskudlarek]

For the more Junior devs (like me), the "next-learn/dashboard" project tutorial they have is a great step into Next.js 14 to get a feel for it. The partial pre-rendering is siiiick.

I'm coming into Next.js at exactly the right time, I think. This and their router system are exactly what I felt was missing when I learned CRA, haha.

[ymi_yugy]

This is pretty cool, but having to make sure stuff loads in the right order and avoiding layout shift scares me. For something like a view counter this sounds amazing, but if I had a page where all the user cares about is dynamic content I might still be inclined to use a global loading spinner and instead focus on making my backend as fast as possible.

[Kulimantang]

Will this also work properly outside of Vercel? Does Vercel handle the CDN part automatically? So this would mean I need to setup my own CDN when deploying Next myself?

[LetondAtreides]

Ahh... Definitely. I've wanted this feature for a long time.

[mubashir]

This sounds like the standard “render as you fetch” technique that Facebook has been using for years with relay and graphql. Relay is more difficult to learn. But, is a very elegant solution, once you get the hang of it.

[_____case]

When you deploy your entire app as pre-compiled WASM, you can serve the entire app from a CDN.

[tradfluteman]

For people saying this is a Vercel feature hack, I don't use Vercel, and I don't even use the integrated NextJS server with middleware, I use a custom server, which is only documented for the Pages router. However almost all the features of the NextJS 14 app router including PPR work.

[buzzebee]

PPR looks great! This is pretty much what I want from nextjs. Will it only work on vercel? Or will it work with open next/amplify?

Our backend will be hosted in aws. So we'll ideally want our next server to be close to that (in the same vpc if possible).

[ThugLifeModafocah]

I'm not getting it. Is it not the same thing that was shown with the use of suspense when next 13 came out? I remember examples of the same thing already there.

[orcdev]

Had no clue that it was not working on Vercel 😂Good thing they fixed it quickly!

[albertgao]

It is something we have been applied to SPA for years for a more performant manner, , , , for each entry of a page, instead of using a blank index.html, we give it a bit of a flavor by adding a loading skeleton. Good to see that next.js finally catching up, but not quite, SSG makes more sense in this case.

[adamzajler]

I'm curious how it works with loading.tsx; Is this still necessary for partial prerendering?