---
title: "Inline Minification"
description: "Automatically minify inline scripts and styles in your SSR responses to reduce page weight."
canonical_url: "https://nuxtseo.com/docs/seo-utils/guides/minification"
last_updated: "2026-05-06T21:34:42.903Z"
---

Nuxt SEO Utils automatically minifies inline `<script>` and `<style>` tags in your SSR responses. This is enabled by default in production builds.

## 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`
- All inline scripts and 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.

This uses lightweight pure JS minifiers with zero native dependencies, ensuring compatibility with any deployment target (serverless, edge, Docker).

## Configuration

Minification is enabled by default. You can configure it in your `nuxt.config`:

<code-group>

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

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

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

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

</code-group>

## What Gets Minified

<table>
<thead>
  <tr>
    <th>
      Content
    </th>
    
    <th>
      Build Mode
    </th>
    
    <th>
      Runtime Mode
    </th>
  </tr>
</thead>

<tbody>
  <tr>
    <td>
      <code>
        app.head
      </code>
      
       scripts/styles
    </td>
    
    <td>
      Rolldown or esbuild / lightningcss
    </td>
    
    <td>
      n/a (static)
    </td>
  </tr>
  
  <tr>
    <td>
      Prerendered route HTML
    </td>
    
    <td>
      Rolldown or esbuild / lightningcss
    </td>
    
    <td>
      n/a (static)
    </td>
  </tr>
  
  <tr>
    <td>
      Hydration payload (<code>
        __NUXT__
      </code>
      
      )
    </td>
    
    <td>
      n/a (dynamic)
    </td>
    
    <td>
      Lightweight JS
    </td>
  </tr>
  
  <tr>
    <td>
      <code>
        useHead()
      </code>
      
       injected scripts
    </td>
    
    <td>
      n/a (dynamic)
    </td>
    
    <td>
      Lightweight JS
    </td>
  </tr>
  
  <tr>
    <td>
      <code>
        useHead()
      </code>
      
       injected styles
    </td>
    
    <td>
      n/a (dynamic)
    </td>
    
    <td>
      Lightweight CSS
    </td>
  </tr>
</tbody>
</table>

## 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)

## Performance

Build mode minification has no runtime cost. Runtime mode adds minimal overhead per request since the lightweight minifiers are simple single-pass transforms (comment stripping, whitespace collapsing) with no parsing or AST construction.