{"library":"mixpanel-browser","title":"Mixpanel Browser SDK","description":"The `mixpanel-browser` library is the official JavaScript browser client for Mixpanel, enabling web applications to send analytics data, capture user events, perform session replay, manage feature flags, and track network telemetry. Currently at version 2.78.0, the library receives frequent updates, typically on a weekly or bi-weekly cadence, reflecting active development and the introduction of new features such as enhanced session recording capabilities (cross-origin iframe support, network recording, event-triggered recording), a refined masking API for sensitive data, and advanced autocapture options. Key differentiators include its comprehensive feature set for client-side analytics, robust session replay with masking and console recording, and a flexible module loading system allowing for optimized bundle sizes by excluding session recording components when not needed. It provides first-party TypeScript types and supports modern ESM import patterns.","language":"javascript","status":"active","last_verified":"Sun Apr 19","install":{"commands":["npm install mixpanel-browser"],"cli":null},"imports":["import mixpanel from 'mixpanel-browser';","import mixpanel from 'mixpanel-browser/src/loaders/loader-module-core';","import mixpanel from 'mixpanel-browser/src/loaders/loader-module-with-async-modules';","mixpanel.flags.loadFlags();"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"import mixpanel from 'mixpanel-browser';\n\nconst MIXPANEL_TOKEN = process.env.MIXPANEL_TOKEN ?? 'YOUR_MIXPANEL_PROJECT_TOKEN';\n\n// Initialize Mixpanel with autocapture, session recording, and debug mode\nmixpanel.init(MIXPANEL_TOKEN, {\n  autocapture: true, // Automatically track common user interactions\n  track_pageview: true, // Automatically track page views\n  record_sessions_percent: 100, // Record 100% of user sessions for replay\n  record_heatmap_data: true, // Enable heatmap, rage click, and dead click collection\n  persistence: 'localStorage', // Use localStorage for more reliable persistence than cookies\n  debug: true, // Enable debug logs in the console\n  // Example of cross-origin iframe recording allowlist for security (since v2.77.0)\n  // record_allowed_iframe_origins: ['https://embedded-widget.example.com'],\n});\n\n// Identify a user after they log in or sign up\nmixpanel.identify('USER_ID_123', {\n  name: 'John Doe',\n  email: 'john.doe@example.com',\n  plan: 'Enterprise'\n});\n\n// Track a custom event with properties\nmixpanel.track('Signed Up', {\n  'Signup Type': 'Referral',\n  'Source Page': '/pricing'\n});\n\n// Track a page view explicitly (if not using track_pageview: true in init)\n// mixpanel.track('Page View', {\n//   'Page Title': document.title,\n//   'Page URL': window.location.href\n// });\n\n// Set or update user profile properties\nmixpanel.people.set({\n  '$last_login': new Date().toISOString(),\n  'Subscription Status': 'Active'\n});\n\n// Example of using feature flags (requires feature flags configured in Mixpanel)\nmixpanel.flags.whenReady().then(() => {\n  if (mixpanel.flags.enabled('new-feature-flag')) {\n    console.log('New feature is enabled for this user!');\n  } else {\n    console.log('New feature is NOT enabled for this user.');\n  }\n});","lang":"typescript","description":"Initializes Mixpanel with common configuration options, identifies a user, tracks a custom event, sets user profile properties, and demonstrates basic feature flag usage.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}