Partytown
Third party scripts slow down your initial page load substantially by blocking the main thread.
Partytown is a tool that allows you to defer third party scripts like Google Analytics, Facebook Pixel, etc off the main thread by using a web worker. For more information about this tool visit the Partytown docs.
Usage
You can add Partytown easily by using the following Qwik starter script:
npm run qwik add partytown
The previous command updates your app and sets the correct configuration in vite.config.ts.
It also adds new files inside to your components folder.
/src/root.tsx
import { QwikPartytown } from './components/partytown/partytown';
export default component$(() => {
return (
<QwikCityProvider>
<head>
<meta charSet="utf-8" />
<QwikPartytown forward={['dataLayer.push']} />
<script
async
type="text/partytown"
src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXX"
/>
</head>
<body lang="en"></body>
</QwikCityProvider>
);
});
Advanced
To further configure Partytown with more options, please visit the Partytown Documentation