Sitecore Symposium: Why DXP + Next.js is a Game-Changer

At this year’s Sitecore Symposium, we learned more about how heavily Sitecore is investing in their headless DXP (digital experience platform) architecture. But should your organization invest in it as well? Yes—now is the time.

Even if you can’t dive into DXP today, you need to start planning for it now. Headless architectures are here to stay and for good reason. Everyone wants blazingly fast digital experiences, and headless architectures can deliver that. They can also let your organization respond quickly to shifting market demands. Sitecore JSS has been our headless option for years but Vercel’s Next.js unleashes Sitecore’s full headless potential.

What is Next.js?

Next.js is a framework developed by Vercel that’s built on top of React. The framework’s goal is to significantly increase performance and reduce the complexity of a React application. The feature set is designed to empower React developers; not just developers on the Sitecore platform.

Who is Vercel?

Vercel is the company that developed Next.js. Not only are they developing Next.js and adding incredible features, but they also offer cloud hosting for Next.js applications on their cloud infrastructure.

Static Site Generation (SSG)

With Next.js when you deploy your site, you have the option to generate static markup. This is part of the reason you get blazingly fast pages. Instead of creating a page when the user requests it, the page is created before they ask for it.

But Next.js is even more sophisticated. It generates static markup at a component level, and it can create your site header and footer once, for every user. It gets better—the React application knows if the user has already downloaded the site header and footer. If the user already has the header and footer because they visited another page, they don’t download the header and footer again. Users only download the parts of the site they haven’t seen before. For every component, you can fully control the cache duration for that component.

No CD Servers

With multiple Sitecore CD servers, it’s typical to manage and monitor each CD server individually. But with Vercel’s hosting, you don’t need CD servers at all. Vercel handles all your scaling (up and down), so you don’t need to worry about load balancing and blue/green deployments.

Deployments and Rollbacks

With Vercel hosting, you can configure Vercel to spin up an individual preview instance of your site each time you commit code to a branch. This doesn’t impact your production site and gives your team a chance to fully test in the same infrastructure as your production site.

Once your team is satisfied with the code changes, you can easily promote your preview site to production. It’s a seamless deployment and with SSG, your site is pre-warmed—no more cold startups. Since it’s so easy to promote a site to production, if you ever need to roll back, you simply re-promote your previous version of the site to production.

Vercel Is Constantly Adding Features

We use Vercel to host our sites during development. While we’ve been using them, they’ve added features we didn’t even realize we wanted. A commenting feature (in beta) was added, allowing our team to make comments directly during a specific deployment of our site.

We also mentioned that Vercel gives us a preview site every time we deploy our code. This means that our comments are specific to individual code deployments, making it extremely easy to reproduce bugs. Vercel even captures the browser version and viewport size when the comment was added!

Investing in Sitecore’s Headless DXP

As we’ve revealed, there are many reasons why you should invest in Sitecore’s headless DXP architecture with Vercel’s Next.js. You can unleash Sitecore’s full headless potential with static site and component generation, the ability to scale your servers with the cloud, site preview instances and the option to quickly rollback changes, and a wealth of new features that Vercel is releasing like the ability to comment on specific deployments.

Want to learn more about Next.js and why your organization should invest in Sitecore’s headless architecture? Contact us, and one of our Sitecore MVPs would be happy to assist you.