SDK Guide

End‑to‑end guide to integrate the Sublyzer SDK. Covers initialization, event collection, performance, error tracking, and best practices.

1) Download the SDK and place it in your site

Use the SDK Customizer (Dashboard → SDK Customizer) and click Download. Save the file as sublyzer.js under your app's public assets, for example:

frontend/public/sdks/sublyzer.js

In Next.js, anything inside public/ is served statically. The SDK will then be available at /sdks/sublyzer.js.

2) Add the HTML tag to your site

Paste this into your HTML (Document, layout, or template):

<script
  src="/sdks/sublyzer.js"
  data-integration-code="YOUR_24_CHAR_CODE"
  data-api-url="http://localhost:3001">
</script>

On page load, the SDK initializes and starts collecting signals automatically.

3) Get your Integration Code
Create an Integration in the dashboard and copy the 24‑char Integration Code. Replace YOUR_24_CHAR_CODE above with it.
4) Run your site

Once you've added the HTML tag, start your dev server or deploy. The SDK will:

  • Initialize on page load
  • Capture JavaScript errors and stack traces
  • Collect performance signals (Core Web Vitals)
  • Track sessions and basic interactions
  • Send data periodically (default ~30s, configurable)
npm packages (optional)

If you prefer npm, you can use the scoped packages (when published in your org):

npm install @sublyzer/browser
npm install @sublyzer/react
npm install @sublyzer/nextjs
npm install @sublyzer/node

For multi‑app companies, create multiple Integrations (one per site/app) — see Integrations.

Best practices
  • Do not include secrets in client SDKs. Use only the public Integration Code.
  • Use sublyzer.flush() on page hide/unload to avoid data loss.
  • Avoid sending PII in events; prefer identifiers.

Need help? Join our Discord.