Third-Party Scripts
Meets Nuxt DX
Load third-party scripts with better performance, privacy, security and DX. Includes many popular third-parties out of the box.
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.
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.
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
YouTube
Vimeo
Intercom
*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.
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 |
✨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
