pdf.js viewer extension is laggy

Question

I extended the pdf.js viewer so that I can "insert .svgs into the .pdf".

That means, I just inserted an extra imageWrapper into each page div and added .svgs as objects inside. The result looks like the .svgs are inside the .pdf, although they are just part of the viewer, of course.

For those not familiar: here you can find a demo of the viewer; just inspect a .pdf-page and you will understand my explanation.

However, if I just scroll up/down, the viewer is quite unresponsive and laggy whenever .svgs are near the viewport. It may be relevant to add that this behaviour doesn't show up if I insert videos or images. Additionally, the .svgs are quite big (3x around 3MB), but if I have these inside a plain html-website with some blindtext, scrolling isn't a problem at all.

To me it rather seems like this is some kind of layout thrashing issue. Nevertheless I wasn't really able to track down the cause(s):

The performance tool from Chrome pointed me towards the ui_utils.js file and in particular this code snippet:

function watchScroll(viewAreaElement, callback) {
  let debounceScroll = function(evt) {
    if (rAF) {
      return;
    }
    // schedule an invocation of scroll for next animation frame.
    rAF = window.requestAnimationFrame(function viewAreaElementScrolled() {
      rAF = null;

      let currentX = viewAreaElement.scrollLeft;
      let lastX = state.lastX;
      if (currentX !== lastX) {
        state.right = currentX > lastX;
      }
      state.lastX = currentX;
      let currentY = viewAreaElement.scrollTop;
      let lastY = state.lastY;
      if (currentY !== lastY) {
        state.down = currentY > lastY;
      }
      state.lastY = currentY;
      callback(state);
    });
  };

  let state = {
    right: true,
    down: true,
    lastX: viewAreaElement.scrollLeft,
    lastY: viewAreaElement.scrollTop,
    _eventHandler: debounceScroll,
  };

  let rAF = null;
  viewAreaElement.addEventListener('scroll', debounceScroll, true);
  return state;
}

This made sense to me as commands like scrollLeft trigger reflow, but commenting out the part with currentX and currentY didn't change the behaviour noticably.

I would appreciate any tips on solving this problem and especially some explanation on the scrolling behaviour of pdf.js very much.

EDIT: In the meantime I have come to the conclusion that this might just be an garbage collection problem. Maybe hiding the .svgs helps.