Static websites are fast. When you deploy static frontends to Now, we automatically serve them from every edge of our global Smart CDN network.
But static websites are also... static. Static site generators create all your pages during the build process — all of them, all at once. Ever had to quickly fix a typo in a page, only to wait minutes or hours for your change to go live?
Today, we are introducing Serverless Pre-Rendering, an industry-defining feature of our Smart CDN network that allows you to get the best of both worlds: the speed and reliability of static, and the versatility of dynamic data rendering.
Let's start with a demo. You’ve built a landing page. You used React, Next.js, CSS-in-JS (or your favorite modern frontend stack). All of which you pushed to GitHub or GitLab for it to be automatically deployed.
We don’t want to wait, so for this demo we wanted to edit the data in real-time. For the task, we picked our favorite document editing tool, Notion, and queried its API from Next.js.
In this video, you can see that we make edits to the Notion page, and it makes updates to the site instantly.
Towards the end of the video, we measure the performance of this dynamic page. The response is instant, from our CDN edge. Using Serverless Pre-rendering, you can provide an instant experience even with dynamic content.
How does that work?
When an end-user accesses your website, we always serve a static version
A serverless Now Lambda function computes a new copy querying dynamic APIs in the background
No matter how much traffic you are serving, only one background invocation is made at an interval you decide
What this means for you:
No more hard decisions between static and dynamic. SPR marries both paradigms
If your backend is slow, your responses are still always fast
Your backend functions and datasources can go down, and you will likely tolerate their downtime
Traffic to your backend is minimized, which results in massive cost reductions
As we’ll see next, the best part is that this integrates easily into your existing codebase, and takes advantage of a HTTP standard proposal.