Partytown Has a Free API That Most Developers Don't Know About

#webdev #javascript #performance #analytics

Partytown relocates resource-intensive third-party scripts (analytics, ads, chat widgets) off the main thread into a web worker. Your site stays fast while tracking still works.

How It Works

Partytown runs third-party scripts in a web worker, proxying DOM access back to the main thread synchronously using Atomics.

Setup with React/Next.js

// app/layout.tsx
import { Partytown } from "@builder.io/partytown/react";

export default function Layout({ children }) {
  return (
    <html>
      <head>
        <Partytown debug={false} forward={["dataLayer.push"]} />
        <script
          type="text/partytown"
          dangerouslySetInnerHTML={{
            __html: `(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({"gtm.start":
            new Date().getTime(),event:"gtm.js"});var f=d.getElementsByTagName(s)[0],
            j=d.createElement(s),dl=l!="dataLayer"?"&l="+l:"";j.async=true;
            j.src="https://www.googletagmanager.com/gtm.js?id="+i+dl;
            f.parentNode.insertBefore(j,f);})(window,document,"script","dataLayer","GTM-XXXXX");`
          }}
        />
      </head>
      <body>{children}</body>
    </html>
  );
}

Key: type="text/partytown"

Just change type="text/javascript" to type="text/partytown" on any script:

<!-- Before: blocks main thread -->
<script type="text/javascript" src="https://analytics.example.com/tracker.js"></script>

<!-- After: runs in web worker -->
<script type="text/partytown" src="https://analytics.example.com/tracker.js"></script>

Forwarding Events

<Partytown
  forward={[
    "dataLayer.push",   // GTM
    "fbq",              // Facebook Pixel
    "gtag",             // Google Analytics
    "_hsq.push"         // HubSpot
  ]}
/>

Performance Impact

Main thread JS: reduced by 90%+ for analytics-heavy pages
Time to Interactive: 2-5x improvement
Core Web Vitals: significant INP/FID improvements

Key Features

Zero config for common scripts (GA, GTM, FB Pixel)
Works with any framework — React, Vue, Angular, Qwik, Astro
DOM access proxied transparently
Forwarding API for custom events

Need to scrape or monitor web data at scale? Check out my web scraping actors on Apify — ready-made tools that extract data from any website in minutes. Or email me at spinov001@gmail.com for custom solutions.