ScaleBun
Skip to article

Plain JavaScript, CDN & GTM

webDeveloper

Use ScaleBun with no framework and no build step — the npm core, an async loader snippet, a declarative script tag, or a Google Tag Manager template.

Updated Reviewed

The core package is framework-agnostic. If your framework has no adapter — or you have no framework at all — this is the whole integration.

With a bundler#

Terminal
npm i @scalebun/web
TypeScript
import ScaleBun from '@scalebun/web';
await ScaleBun.init({  clientKey: 'skb_live_ck_…',  apiBaseUrl: 'https://api.scalebun.com/api/v1',});

Then wire the two seams an adapter would wire for you:

TypeScript
// 1. route changes — call this wherever your router navigatesScaleBun.trackScreen('/checkout');
// 2. errors your framework swallows before window.onerrortry {  render();} catch (error) {  ScaleBun.captureError(error);}

Uncaught errors, unhandled rejections, network requests, Web Vitals and autocaptured clicks need no wiring — they are captured from init().

Without a build step#

Two script-tag shapes, plus Tag Manager. All three load the same runtime.

Async loader snippet#

Recommended. The inline stub queues calls made before the bundle finishes loading and replays them in order, so nothing is lost in the race.

HTML
<script>  !function(w,d){w.ScaleBun=w.ScaleBun||{q:[]};    ['init','track','identify','trackPurchase','setConsent','reset','register','group','alias']      .forEach(function(m){w.ScaleBun[m]=w.ScaleBun[m]||function(){w.ScaleBun.q.push([m,arguments]);};});    var s=d.createElement('script');s.async=true;    s.src='https://cdn.jsdelivr.net/npm/@scalebun/web@1/dist/scalebun.min.js';    d.head.appendChild(s);}(window,document);
  ScaleBun.init({    clientKey: 'skb_live_ck_…',    apiBaseUrl: 'https://api.scalebun.com/api/v1',  });</script>

Only the nine methods listed in the stub are queued. Anything else called before load is lost — add a method name to the array if you need it early.

Declarative tag#

No inline JavaScript at all, which suits a strict CSP.

HTML
<script async        src="https://cdn.jsdelivr.net/npm/@scalebun/web@1/dist/scalebun.min.js"        data-client-key="skb_live_ck_…"        data-api-base-url="https://api.scalebun.com/api/v1"        data-environment="production"></script>

The tag reads exactly four attributes:

AttributeRequired
data-client-keyYes
data-api-base-urlYes
data-environmentNo
data-autocaptureNo — set "false" to disable

Both required attributes must be present or auto-init does not run. There is no data-release, no data-replay — for any other option, use the loader snippet and pass a real config object.

Google Tag Manager#

Import the ScaleBun custom template, then set the Client key and API base URL fields. The template installs the same loader queue, queues init(), and injects the CDN bundle — so a marketing team can deploy the SDK without an app release.

After it loads#

Either no-build path exposes the same facade on window:

HTML
<script>  ScaleBun.identify('user_42', { plan: 'pro' });  ScaleBun.track('add_to_cart', { sku: 'A-1' });  ScaleBun.trackScreen(location.pathname);</script>

It is the same runtime as the npm build — one SDK, three delivery paths.

Next#

Plain JavaScript, CDN & GTM · Integrations · Web SDK · ScaleBun