What is FullStory, exactly? We sometimes describe it as a “DVR for your website”, but that could mean any number of things: video, keypresses, mouse movements.

To understand exactly what FullStory is, it helps to start with what we want it to do. Our goal is to help you understand what your users are doing, so that you can help them when they get stuck, know what features are being used, and improve the site’s usability.

FullStory needs to be precise, but also give you a higher-level view, so that you can search through user interactions and summarize trends. To make this clearer, let’s use an example.

Not long after we released FullStory, we briefly had a bug in the code that saved the“blocked element list”. We fixed it quickly, but needed to know if it had actually affected any of our customers. So we simply searched for everyone who clicked the “save” button in the settings UI:

Then we watched a couple of sessions to verify that the bug had manifested as we expected. Lo and behold, there it was:

At this point, all we had to do was narrow the search to the time period during which the bug was live, then reach out to the affected customers to apologize and advise them to update their settings.

How does FullStory work?

If you’ve ever built or modified a website, then you’ve seen HTML. The tags in HTML (e.g., <p>Here’s a paragraph.</p>) generate what are called Document Object Model elements (DOM elements, for short). The styles applied to these elements (size, colors, borders, background images, and so forth) are defined by Cascading Style Sheets, or CSS. Dynamic sites (often referred to as AJAX) work by running code in Javascript to manipulate these elements in response to user interactions.

We realized that if we record all DOM elements, along with their associated CSS styles, then we can reproduce a static web page precisely. Then, if we can record allchanges to the page, we can reproduce a dynamic web page just as precisely. So that’s exactly what FullStory does.

What does record?

Here’s a partial list of interesting things (apart from the basics) that FullStory can record:

  • CSS animations
  • Vector graphics in SVG (including animations)
  • Hover cursors and effects
  • Embedded <iframe>s
  • Script-modified input values
  • Window resizing
  • AJAX URL navigation
  • HTML5 <audio> and <video> playback
  • Multi-touch events (on mobile devices)

So, does FullStory record sites built with ${framework}?

Notably absent from the things FullStory records is any mention of Javascript or data retrieved from the server. We needn’t record any of this, because anything the user actually saw is, by definition, represented in changes to DOM elements on the web page.

This is why the answer to this question is always “yes”. It doesn’t matter how the page is manipulated, only that FullStory sees the results of those changes.

Why should I care?

The value of a tool like FullStory is only realized if you can completely trust what it is showing you. You need to know exactly what your users are experiencing in order to serve them better. We can understand if you’re still skeptical, so why don’t you give it a try? It’s free to try, and we’re certain you won’t be disappointed.

All the best,
Joel