Partytown

第三方脚本会通过阻塞主线程来显著减慢您的初始页面加载速度。

Partytown 是一款工具，它允许您通过使用 Web Worker 将第三方脚本（如 Google Analytics、Facebook Pixel 等）从主线程中延迟。有关此工具的更多信息，请访问 Partytown 文档。

用法

您可以使用以下 Qwik 启动脚本轻松添加 Partytown

npm run qwik add partytown

之前的命令会更新您的应用程序并在 vite.config.ts 中设置正确的配置。

它还会将新文件添加到您的 components 文件夹中。

src/root.tsx

import { QwikPartytown } from './components/partytown/partytown';
 
export default component$(() => {
  return (
    <QwikCityProvider>
      <head>
        <meta charSet="utf-8" />
        <QwikPartytown forward={['gtag','dataLayer.push']} />
        <script
          async
          type="text/partytown"
          src="https://#/gtag/js?id=G-XXXXXXX"
        />
        <script
          type="text/partytown"
          dangerouslySetInnerHTML={`
            window.dataLayer = window.dataLayer || [];
            window.gtag = function() {
              dataLayer.push(arguments);
            }
            gtag('js', new Date());
            gtag('config', 'G-XXXXXX');
          `}
        />
      </head>
      <body lang="en"></body>
    </QwikCityProvider>
  );
});

高级

要使用更多选项进一步配置 Partytown，请访问 Partytown 文档

贡献者

感谢所有帮助改进这份文档的贡献者！