Previous EntryNext Entry
kova98/Barelytics

Session Replays POC Working

Continuing the debugging from yesterday.

Some of the requests fail, including the first one ever sent. Could it be because of the size? I need to check:

  • Does Chrome enforce a size limitation for fetch
  • Does the Go Standard Library enforce a size limitation on requests

Doesn't seem so... Hmm...

I can see that the first request (the one failing) doesn't come after a preflight like the others

alt text

I got it, finally.

Chrome DOES enforce a limit on fetch, but only when keepalive is used. From the fetch spec:

If the sum of contentLengthValue and inflightKeepaliveBytes is greater than 64 kibibytes, then return a network error.

And as I haven't optimized anything yet, and I'm waiting for 15 seconds between flushes, the request is 200KB!!

Weird that Chrome just rejects it silently.

I'll disable it for now, but I'll have to reenable it after optimizing. It's crucial to capture the whole sessions.

It works! Finally!

alt text

Next up, I have some cleaning up to do:

  • clean up the sessions UI
    • done
  • refactor both endpoints into single ingestion endpoint
    • done
  • clean up the tracking script and set up a proper dev workflow
    • done
  • add the missing session information
    • done

Phew, that took a while. I refactored a lot of the code, cleaned things up, set up a proper dev workflow and added the missing data. I removed the device info from the frontend script to add it back on the backend, but haven't managed to finish today.

The rrweb-player ui seems pretty unstable. I hacked my way into making it resize properly, but something is wrong. Whenever you resize the replay window, the layout in the actual recording changes. It's also resizing based on the recording resolution. I'll have to spent some more time on this.

It will take a lot of work before this is ready for prod. Namely the compression and optimization of the recordings. I can't deploy anything until that's in an acceptable state.

alt text

Next steps:

  • add user agent/device info parsing on backend
  • resolve the UI issues
  • optimize rrweb recording
  • add compression