The Human Behavior SDK allows you to record user sessions and track behavior analytics in web applications for use with the Human Behavior platform.
Important: By using the HumanBehavior SDK, you agree to comply with our Terms of Service and Privacy Policy.

Quickstart

If you are using a framework such as React, NextJS, or Vite, we recommend using one of our Framework Guides instead of the quickstart.
The fastest way to get started is by adding a simple JS snippet at the top of your website.

Step 1: Get your Public API Key

This will help identify your website to Human Behavior when users visit it.
How to find your Public API Key: Project Home → Settings (on sidebar) → Public API Key
Where to find your Public API Key
Security Best Practice: Store your API key in environment variables rather than hardcoding it in your source code. This prevents accidental exposure of your key in version control.

Step 2: Install the Tracker

Option 1: CDN

Add this to the top of your file.
<script src="https://unpkg.com/humanbehavior-js@latest/dist/index.min.js"></script>

Option 2: Package Manager

Install using npm, yarn, or your package manager of choice.
npm install humanbehavior-js

Step 3: Add the tracker to your project

<head>
	<!-- your other metadata here -->
	<script>const tracker = HumanBehaviorTracker.init('YOUR_API_KEY_HERE');</script>
</head>
<body>
	<!-- your website content here -->
</body>

Simple HTML Example

Here is a simple HTML website using the CDN version:
<!DOCTYPE html>
<html>
  <head>
    <title>My Website</title>
    <link rel="stylesheet" href="style.css">

    <!-- Load the HumanBehavior SDK -->
    <script src="https://unpkg.com/humanbehavior-js@latest/dist/index.min.js"></script>

    <!-- Initialize the tracker -->
    <script>const tracker = HumanBehaviorTracker.init('your-api-key');</script>

  </head>
  <body>
    <h1>Welcome to My App</h1>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
  </body>
</html>
That’s it! The SDK automatically tracks user interactions, navigation, and console events. You don’t need to add any custom event tracking unless you want to track specific business events. See Custom Events for more information.

Browser Compatibility

The SDK supports all modern browsers:
BrowserVersion
Chrome60+
Firefox55+
Safari12+
Edge79+
Internet Explorer is not supported. The SDK uses modern JavaScript features that are not available in IE.

Bundle Size

The SDK is optimized for size:
  • Core SDK: ~45KB (gzipped)
  • With React integration: ~50KB (gzipped)
  • CDN version: ~60KB (gzipped)
Best Practice:Always initialize the tracker in the <head> section, before any user interaction can occur. This ensures all events—including those on page load—are captured.

What Happens Next?

Once you’ve completed the setup:
  1. Automatic Session Recording: The SDK automatically captures user interactions using rrweb
  2. Automatic Event Tracking: Button clicks, link clicks, and form submissions are tracked automatically
  3. Session Persistence: Sessions persist across page reloads for 30 minutes
  4. Navigation Tracking: SPA navigation and URL changes are automatically tracked
  5. Console Tracking: Console logs, warnings, and errors are captured
  6. Data Processing: Events are processed and sent to your dashboard
  7. User Identification: Users are automatically identified using cookies
  8. Analytics: View session recordings and analytics in your HumanBehavior dashboard