PostHog JS

rrweb (record and replay the web) is a tool designed to record and replay user interactions on the web. It operates through two primary functions:

1. Record: Captures all mutations occurring in the DOM.
2. Replay: Replays those recorded mutations sequentially based on their corresponding timestamps to recreate the user's session.

The @rrweb/all package is a convenience bundle that includes the following core rrweb packages:

• rrweb: The main library
• @rrweb/record: For recording user sessions
• @rrweb/replay: For replaying recorded sessions
• @rrweb/packer: For compressing/unpacking data

@rrweb/utils is a package containing shared utility functions used across various rrweb packages. It serves as a foundational library for the rrweb ecosystem.

For detailed information on how to use rrweb, refer to the main rrweb guide.

The following example scripts demonstrate how to track various OpenAI API calls using PostHog AI:

• chat-completions.ts: Chat Completions API with tool calling.
• chat-completions-streaming.ts: Chat Completions with streaming support.
• responses.ts: Responses API with tool calling.
• responses-streaming.ts: Responses API with streaming support.
• embeddings.ts: Generating text embeddings.
• transcription.ts: Audio transcription using Whisper.
• image-generation.ts: Image generation via the Responses API.

The PostHog logging integrations for state management libraries support several key features to ensure efficient and secure telemetry:

• Action and state logging: Captures transitions and current state in PostHog.
• Rate limiting: Prevents log flooding by limiting the frequency of events.
• State diffing: Optimizes logs by only recording values that have changed.
• Action/state masking: Protects sensitive data by masking specific fields before they are sent to PostHog.
• Performance monitoring: Detects and logs slow actions to help identify bottlenecks.

The examples demonstrate two different implementation styles:

• Redux: Implemented via posthogReduxLogger middleware.
• Kea: Implemented via posthogKeaLogger plugin, which provides a cleaner API for Kea users.

The Remix playground demonstrates several key PostHog integration patterns:

• Automatic pageview tracking: Configured using capture_pageview: 'history_change' to ensure pageviews are tracked during client-side navigation.
• Custom event capture: Demonstrates how to use PostHog React hooks to capture specific user actions.
• PostHog React Provider: Shows how to wrap the application with the necessary provider for React-based tracking.
• SSR Support: Includes Vite configuration optimized for Server-Side Rendering.
• Session Replay Testing: Includes a media page with base64 images to test session replay capabilities.

The @posthog/convex example serves as a reference for integrating PostHog with Convex, covering the following capabilities:

• Analytics: Capturing events (Sections 01–03) that appear in the PostHog activity feed.
• Feature Flag Evaluation:
  • Local Evaluation: Using query context and reactive methods.
  • Remote Evaluation: Using action context and per-call /flags requests.
  • Reactive Updates: The app demonstrates a live, reactive view of flag values for the current Distinct ID that updates when flags change in PostHog.
• AI Generation Tracing: Capturing $ai_generation events using the @posthog/ai package. By default, it uses OpenTelemetry, but manual capture is also supported.