---
title: "Inline Minification"
description: "Minify inline scripts and styles at build time, with optional minification for dynamic SSR."
canonical_url: "https://nuxtseo.com/docs/seo-utils/guides/minification"
---

> Index of every page on this site: [llms.txt](https://nuxtseo.com/llms.txt)

Nuxt SEO Utils automatically minifies inline `<script>` and `<style>` tags at build time. Runtime minification is opt-in.

## How It Works

The module provides two complementary minification modes that can be toggled independently.

### Build Mode

At build time, the module has access to native tooling for full minification:

- **JavaScript**: Minified with [Rolldown](https://rolldown.rs/) (Vite 8+) or [esbuild](https://esbuild.github.io/) (Vite 7), automatically detected
- **CSS**: Minified with [lightningcss](https://lightningcss.dev/) (full CSS optimization)

This applies to:

- Static scripts and styles defined in `app.head` within your `nuxt.config`
- JSON scripts and inline styles in prerendered/generated route HTML

### Runtime Mode

For dynamic SSR where scripts are generated per request (hydration payloads, `useHead()` injections), the module registers an [Unhead](https://unhead.unjs.io/) `ssr:render` plugin that minifies `HeadTag` content before it's serialized to HTML.

Runtime mode compacts JSON scripts and inline CSS. It preserves JavaScript, import maps, speculation rules, and custom script types.

JavaScript minification needs a parser. The module runs parser-based JavaScript minification only at build time.

Build mode uses parser-based minifiers and has no runtime cost. Runtime mode adds work to every SSR request. Enable it only after measuring the transfer savings and CPU cost for your application.

## Configuration

Build mode is enabled by default. You can configure both modes in your `nuxt.config`:

::code-group
```ts [Build only (default)]
export default defineNuxtConfig({
  seo: {
    minify: { build: true, runtime: false },
  },
})
```

```ts [Both]
export default defineNuxtConfig({
  seo: {
    minify: true,
  },
})
```

```ts [Runtime only]
export default defineNuxtConfig({
  seo: {
    minify: { runtime: true, build: false },
  },
})
```

```ts [Disabled]
export default defineNuxtConfig({
  seo: {
    minify: false,
  },
})
```
::

## What Gets Minified

| Content                     | Build Mode                         | Runtime Mode    |
| --------------------------- | ---------------------------------- | --------------- |
| `app.head` scripts/styles   | Rolldown or esbuild / lightningcss | n/a (static)    |
| Prerendered route HTML      | JSON / lightweight CSS             | n/a (static)    |
| Dynamic JavaScript          | Preserved                          | Preserved       |
| `useHead()` JSON scripts    | JSON                               | JSON            |
| `useHead()` injected styles | n/a (dynamic)                      | Lightweight CSS |

## What Gets Skipped

The following are skipped by the JS minifier:

- JSON script types (`application/ld+json`, `application/json`) are minified via `JSON.parse`/`JSON.stringify` instead of JS minification
- `importmap` and `speculationrules` script types are left completely untouched
- External scripts (with `src` attribute)
- Custom script types are preserved at build time and runtime
- Dynamic JavaScript is preserved during SSR and prerendering

## Sitemap

See the full [sitemap](https://nuxtseo.com/sitemap.md) for all pages.
