Skip to main content

How it works

The inspector (our client side code) attaches itself to the window object as early as possible.

Its operation is entirely event-driven, meaning it remains idle until it detects user activity. This design ensures minimal impact on site performance.

When user activity is detected, a inspector event module gathers only the most essential data. Instead of processing this data immediately, it dispatches an event to an event bus.

The event bus determines the optimal time for processing—typically when the page is under minimal load. At that point, the event is processed, and the data is formatted and prepared for analysis.

Example: User Click Event​

Let’s break down what happens when a user clicks:

User Clicks​

The user interacts with the page, such as clicking a <button /> element.

Data Collection​

The click module gathers key information:

  • The click position.
  • The element that was clicked (e.g. <button />).
  • The timestamp of the action.
  • The page where the click occurred.

Event Dispatch​

This data is dispatched to the event bus for later processing.

Processing​

Once the event bus has determined the time for processing, the click module is allowed to run some additional calculations and sync it to our backend.

Performance Considerations​

This process ensures that site performance is minimally impacted. By deferring computations to optimal times, and using background workers, the inspector avoids interfering with your users experience.

Rest assured, no data is lost due to this deferred processing. Systems are in place to ensure all data is gathered and collected before the session is lost. We’ll cover those systems in more detail later.

The complete client package is 440 kB unpkg.