Zero Runtime

When using Nuxt as a server-side app with prerendered OG Images, you are forced to have runtime OG images as well which added significant overhead to the server build.

To address this, we introduce the zeroRuntime config, which ensures all tree-shakable OG image code is removed from the final output.

Usage

To enable zero runtime, add the following to your config:

export default {
  ogImage: {
    zeroRuntime: true
  }
}

You will need to make sure you're prerendering all of your pages that use OG images, as the server runtime will not be available.

export default defineNuxtConfig({
  nitro: {
    prerender: {
      crawlLinks: true,
      routes: [
        '/',
        // ...
      ],
    },
  }
})

Limitations

When using the Zero Runtime mode none of the community templates will be available in your final build, you must copy+paste any community template that you wish to use into your components/OgImage folder.

Benchmarks

Nuxt OG Image - Defaults

Nitro: 1.6mb

• node_modules: 25mb

Nuxt OG Image - Zero Runtime

Nitro: 306kb (81% reduction)

• node_modules: 2.0mb (92% reduction)