Question

我扩展了pdf.js查看器，以便可以将.svgs插入.pdf中。

这意味着，我只是在每个页面imageWrapper中插入了一个额外的div，并在其中添加了.svgs作为objects。结果看起来.svgs位于.pdf内，尽管它们当然只是查看器的一部分。

对于不熟悉的人：here，您可以找到查看器的演示；只需查看.pdf页，您就会理解我的解释。

但是，如果我只是向上/向下滚动，只要.svgs靠近视口，观看者就会变得反应迟钝和迟钝。可能需要补充一点的是，这种行为不会插入视频或图像时显示。另外，.svgs很大（大约3MB的3倍），但是如果我将它们放在一个普通的html网站中，并带有一些盲文本，那么滚动根本不是问题。

在我看来，这似乎是某种布局调整问题。尽管如此，我还是无法真正找到原因：

Chrome的性能工具将我引向ui_utils.js文件，尤其是以下代码段：

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;
}

这对我来说很有意义，因为像scrollLeft这样的命令会触发重排，但是用currentX和currentY注释掉零件并没有明显改变行为。

非常感谢您提供解决此问题的所有技巧，尤其是对pdf.js 的滚动行为的一些解释。

编辑：同时，我得出的结论是，这可能只是垃圾收集问题。也许隐藏.svgs会有所帮助。

pdf.js查看器扩展很慢

0 个答案: