/

Third-Party Scripts
Meets Nuxt DX

Nuxt Scripts lets you load third-party scripts with better performance, privacy, security and DX. It includes many popular third-parties out of the box.

Get started Star on GitHub

Better Web Vitals

Load scripts when they're needed with best practices non-blocking the rendering of your Nuxt app by default.

Privacy for your users

Avoid leaking user data to third-party scripts that don't need it. Ensure your scripts are GDPR compliant.

Developer Experience First

Type-safe and SSR friendly composables that just work wherever you need them.

Secure third-parties

Protect your app from third-party scripts that could be compromised.

A powerful API with just enough magic

Nuxt Scripts provides an abstraction layer on top of third-party scripts, providing SSR support and type-safety while still giving you full low-level control over how a script is loaded.

app.vue

const { proxy } = useScript('/tracker.js', {
  trigger: 'onNuxtReady',
  use() {
    return { trackEvent: window.trackEvent }
  }
})

// fully typed, SSR safe
proxy.trackEvent('page_view')

Speed up with Facade Components

Nuxt Scripts provides several Facade Components out of the box.

Facade components are fake UI elements that get replaced once a third-party script loads, they can significantly improve your performance while still providing a great user experience, however they do have trade-offs .

Google Maps

Nuxt Scripts11.9x Faster

70ms

Iframe

830ms

YouTube

Nuxt Scripts46.4x Faster

70ms

Iframe

3.3s

Vimeo

Nuxt Scripts3.7x Faster

70ms

Iframe

260ms

Intercom

Nuxt Scripts3.9x Faster

220ms

Iframe

850ms

*Note that PageSpeed Insights lab data is a snapshot from a particular day, which tends to be variable.

Cookie consent that's good enough to eat

Nuxt Scripts aims to improve end-user privacy by providing a simple API for managing cookie consent .

All scripts can be loaded conditionally based on user consent, set it up however you need.

consent.vue

const consent = useScriptTriggerConsent()

useScript('https://analytics.example.com/track.js', {
  trigger: consent
})

// grant consent when user accepts
consent.accept()

Privacy-first social embeds

Embed posts from X, Instagram, and Bluesky without loading third-party scripts. All content is fetched server-side and proxied through your domain.

Zero client-side JavaScript, zero cookies, zero third-party requests.

Nuxt Scripts vs Native	X	Instagram	Bluesky
Client JS	0vs475 KB	0vs580 KB	0vs42 KB
Requests	0vs25	0vs34	0vs9
Cookies	NovsYes	NovsYes	NovsNo
Blocking Time	0msvs1,010ms	0msvs780ms	0msvs60ms

Alexander Lichter

@TheAlexLichter

✨Time to talk about the newest official @nuxt_js module - Nuxt Scripts! And not only covering why it is useful and what it does, but using the underlying `useScript` composable to load a *custom script* right into a demo application. Don't miss it out! 💚 Link below 👇 https://t.co/UjefeB3Ny9

12:30 PM · Aug 30, 20242 replies94 likes

CommentSave

52 likes

Jakub Andrzejewski

@jacobandrewsky.bsky.social

Are you struggling with third party scripts affecting performance of your @nuxt.com application? 🤔 Check out Nuxt Scripts module that brings several solutions to this problem with the amazing Developer Experience! 🚀 scripts.nuxt.com

11:12 AM · Apr 1, 20250 replies0 reposts4 likes