Script

The <Script> component manages third-party scripts, analytics, and inline scripts with priority loading strategies.

Import

usage

import { Script } from "swift-rust";

Loading Strategies

afterInteractive (default) — Injected right after the page becomes interactive. Suitable for tag managers, analytics, and chat widgets.
beforeInteractive — Injected into the initial HTML document shell before any application code hydrates. Suitable for bot detection, consent banners, and polyfills.
lazyOnload — Loaded during idle browser network time (via requestIdleCallback). Ideal for non-critical social embeds and widgets.
worker — Offloads script execution to a web worker to preserve the main thread.

Examples

app/layout.tsx

import { Script } from "swift-rust";

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <html lang="en">
      <body>
        {children}
        <Script
          src="https://www.googletagmanager.com/gtag/js?id=GA_TRACKING_ID"
          strategy="afterInteractive"
        />
        <Script id="google-analytics" strategy="afterInteractive">
          {`
            window.dataLayer = window.dataLayer || [];
            function gtag(){dataLayer.push(arguments);}
            gtag('js', new Date());
            gtag('config', 'GA_TRACKING_ID');
          `}
        </Script>
      </body>
    </html>
  );
}