Skip to content
Netlify Docs

Prerendering

Set up prerendering to make your app’s content discoverable to AI agents, SEO crawlers, and preview services, such as for social media previews.

Overview

Section titled “Overview”

Once set up, prerendering automatically serves pre-rendered HTML to crawlers, agents, and preview services, while regular site visitors continue to receive your standard JavaScript application.

Prerendering is designed for apps that use JavaScript to generate page content instead of serving most or all content in HTML, such as for single-page applications (SPAs) built with frameworks like React, Vue, or Angular.

Check prerendering needs

Section titled “Check prerendering needs”

Not sure if your site/app needs prerendering?

Find out using our prerendering checker tool and your project URL.

Why does my project need prerendering?

Section titled “Why does my project need prerendering?”

SPAs (single-page applications) rely on client-side JavaScript to render pages, leaving the HTML body mostly empty. While this works for browsers and major search engines like Google, many tools, such as AI agents, chat services, and crawlers, cannot run JavaScript. Even search engines that do run JavaScript may penalize slow-loading pages, lowering SEO scores.

Websites using Server-Side Rendering (SSR) or Static Site Generation (SSG) avoid these issues, though some use a hybrid approach.

Prerender extension

Section titled “Prerender extension”

The Prerender extension replaces the legacy beta prerendering feature, which is now deprecated. Learn more about legacy feature’s deprecation timeline.

As a Team Owner, you can install the Prerender extension for your team. Then you or any developer on your team can enable the extension for a project they work on.

To set up the Netlify Prerender extension, follow these steps:

  1. If necessary, disable the legacy built-in Prerendering feature. To disable, go to Project configuration Build & deploy Post processing Prerendering.
  2. To install the Prerender extension, go to https://app.netlify.com/extensions/prerender.
  3. All your projects will now show the Prerender extension under Extensions in the left sidebar of your project navigation. To enable for a specific project, select the Prerender extension and Enable prerendering.
  4. To activate the extension, save your changes and re-deploy your project.

To learn more about advanced confirguration options and how this extension works, check out the Prerender extension README or the extension details page.

How it works

Section titled “How it works”

Once enabled, the Netlify prerender extension adds two components to your site:

  1. Edge function - Runs only for relevant requests (made by a relevant user-agent for HTML content) and rewrites these requests to the prerender function.
  2. Serverless function - Uses a headless browser to load the requested page, and returns the fully-rendered HTML with proper caching headers.

Your human visitors continue to load your site normally, while crawlers and AI tools receive HTML with all content already rendered. There is no additional cost other than regular billing for the functions invoked, based on your plan. Since the functions are invoked in your account, you get full visibility with logs and metrics - just like for any other function you have deployed.

This extension uses sensible defaults, and very often requires no additional configuration.

After installing the extension to your team, you need to enable it for a specific project.

All other configuration changes beyond enabling/disabling do not require a re-deploy, as these are stored in a blob object.

To learn more about configuration options, check out the Prerender extension README or the extension details page.

Legacy Netlify Prerendering

Section titled “Legacy Netlify Prerendering”

This feature is deprecated. We recommend disabling it and using another prerendering option.

To disable this feature, go to Project configuration Build & deploy Post processing Prerendering.

Enabling Netlify’s built-in prerendering.

If enabled, our built-in prerendering service will cache prerendered pages for between 24 and 48 hours; this is not adjustable.

How it works

Section titled “How it works”

This is how our Legacy Netlify Prerendering service works:

  1. When a request hits one of our CDN servers, our CDN software determines if it’s a prerendering request from a crawler.
  2. If prerendering is enabled for your site, our cache servers will contact the prerendering backend straight from our CDN nodes instead of serving the normal cached request.

External services for legacy prerendering

Section titled “External services for legacy prerendering”

This feature is available on all Pro and Enterprise plans.

If you have set up external services for the legacy prerendering feature, you can migrate to our Prerender extension or reach out to us through Netlify Support to discuss other options.

Support for these external services with the legacy prerendering feature will end when the legacy feature is disabled and fully sunset or removed from Netlify.

If you previously enabled the legacy prerendering feature, these were the external services that could automate prerendering for you:

If you want to use an external service, send us an email at support@netlify.com to let us know which service you’re using and its API token, and we’ll get you set up.