Using heatmap within a SPA that doesn't have routing

  • 19 October 2023
  • 2 replies

Is it possible to get heatmap to work within a single-page application without having to implement a router?


Best answer by ALabs I Bhupender 19 October 2023, 12:50

View original

2 replies

Userlevel 3
Badge +1


Heatmaps and Session replay both works out-of-the box with all Single Page Apps (SPAs), including Angular and React.

Single Page Applications (SPAs) leverage browser history APIs to alter the webpage's URL, initiating adjustments in the displayed content within the Document Object Model (DOM). Session replay and Heatmaps functionality actively monitors these browser API interactions and tracks all modifications made to the DOM, capturing both URL alterations and changes in the content.

Hope this helps!


The issue we’re having is that some sections of our app wouldn’t naturally have a different route, for instance an airbnb style search dropdown, but would be very valuable to have heatmap data on. Is there some way to use the heatmap without a route for each section you want to see?


Also, even on the main page, we’re seeing just empty loading state on the heatmap instead of our UI elements. Is there some way to specify that we’re looking for a different state or structure our app differently?