# chrisvfritz/prerender-spa-plugin

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/chrisvfritz-prerender-spa-plugin).**

7,278 stars · 615 forks · JavaScript · MIT · archived

## Links

- GitHub: https://github.com/chrisvfritz/prerender-spa-plugin
- awesome-repositories: https://awesome-repositories.com/repository/chrisvfritz-prerender-spa-plugin.md

## Topics

`prerender` `seo` `spa` `static-site-generator` `webpack` `webpack-plugin`

## Description

This project is a build-time tool that converts single-page application routes into static HTML files. It functions as a Webpack build plugin that uses a headless browser to execute JavaScript and capture the final DOM state as static markup to improve search engine optimization and initial page load speeds.

The system provides precise control over the capture process through custom render triggers, allowing HTML generation to be delayed until a specific DOM element appears, a custom event fires, or a timer expires. It also supports global state injection, which embeds JSON-serializable data into the browser window object before the rendering process begins.

Further capabilities include route specification for defining which paths to crawl and a post-processing function to modify HTML content or file paths before storage. To optimize production delivery, the tool includes an HTML minification utility to compress the generated output.

## Tags

### Content Management & Publishing

- [Static Page Rendering](https://awesome-repositories.com/f/content-management-publishing/static-page-rendering.md) — Automates the capture of SPA application states into static HTML files during the software build process.
- [SPA Static Prerenderers](https://awesome-repositories.com/f/content-management-publishing/spa-static-prerenderers.md) — Provides a build-time tool for converting single-page application routes into static HTML files to improve SEO and speed.

### DevOps & Infrastructure

- [Static Route Prerendering](https://awesome-repositories.com/f/devops-infrastructure/deployment-management-strategies/static-site-deployments/static-route-prerendering.md) — Iterates through specified application paths to generate corresponding static HTML files during the build process.
- [Prerender Capture Triggers](https://awesome-repositories.com/f/devops-infrastructure/cloud-infrastructure/cloud-computing-serverless/backend-as-a-service/render-triggers/prerender-capture-triggers.md) — Delays HTML capture until a specific DOM element appears, a custom event fires, or a timer expires. ([source](https://github.com/chrisvfritz/prerender-spa-plugin/blob/master/README.md))

### Web Development

- [Headless Browsers](https://awesome-repositories.com/f/web-development/headless-browsers.md) — Uses a headless browser to execute JavaScript and capture the resulting DOM as static HTML.
- [Route Prerendering](https://awesome-repositories.com/f/web-development/rendering-templating/route-prerendering.md) — Allows users to define the specific application paths to be crawled and converted into static files. ([source](https://github.com/chrisvfritz/prerender-spa-plugin/blob/master/examples/angular-cli-eject))
- [Static Site Generators](https://awesome-repositories.com/f/web-development/static-site-generators.md) — Transforms application routes into static HTML assets during the build process for improved visibility and speed. ([source](https://github.com/chrisvfritz/prerender-spa-plugin/blob/master/examples/vue2-webpack-router))
- [Search Engine Optimization](https://awesome-repositories.com/f/web-development/web-standards/search-engine-optimization.md) — Converts single-page application routes into static HTML to enable more effective indexing by search engines.
- [Initial State Injection](https://awesome-repositories.com/f/web-development/global-state-access/debug-state-injection/initial-state-injection.md) — Embeds JSON-serializable data into the browser window object to initialize application state before the rendering process begins.

### Development Tools & Productivity

- [Webpack Asset Generators](https://awesome-repositories.com/f/development-tools-productivity/webpack-asset-generators.md) — Integrates as a Webpack plugin to automate the generation of static HTML files based on application paths.

### Graphics & Multimedia

- [Client Side Rendering](https://awesome-repositories.com/f/graphics-multimedia/graphics-engines-rendering/rendering/systems/dom-web-rendering-strategies/client-side-rendering.md) — Improves initial paint performance by serving pre-rendered static HTML before the client-side JavaScript initializes.

### Software Engineering & Architecture

- [Render Timing Triggers](https://awesome-repositories.com/f/software-engineering-architecture/event-driven-architectures/render-timing-triggers.md) — Allows precise control over when the HTML is captured by waiting for specific DOM elements or events.
- [Window Object State Injection](https://awesome-repositories.com/f/software-engineering-architecture/integration-extensibility/dependency-injection/view-template-component-injection/global-variable-injections/window-object-state-injection.md) — Injects JSON-serializable objects into the global window scope to provide initial state before rendering. ([source](https://github.com/chrisvfritz/prerender-spa-plugin#readme))