Question

我使用paper.js来管理我的html5绘图。在Chrome中，如果我在页面底部重新加载并查看此行，则很明显：

如果我在底部重新加载，我可以向上和向下滚动，线条将保持其保真度。

但如果我在页面顶部重新加载并向下滚动，那么这条线看起来是锯齿状的而不是消除锯齿的，就像这样：

奇怪的是，如果我在最初加载到页面顶部后向上和向下滚动几次，则保真度会变差：

在Safari中也会发生这种情况，并且在Firefox中它会发生，但几乎到了不明显的程度。我的假设是，这与以下事实有关：当我在底部加载时，加载上方的所有dom元素都在页面加载时呈现。如果我在顶部加载，元素只在滚动到视图时呈现（因此与滚动事件争用并重新绘制CPU？）

但是我能做些什么来确保所有dom事件都是在页面加载时呈现的吗？我已经将初始绘图函数包装在$（document）.ready。

中

Answer 1

这似乎与性能有关（我还没有对它进行分析，所以我不确定CPU或内存是否是限制因素）。但我可以简单地在onFrame循环中向console.log添加一个计算，尽管没有html5启动的动画或在屏幕上重绘，但这些行会出现锯齿状。

编辑：

真正的问题是将大小调整添加到canvas标签，如：

<canvas resize></canvas>

将导致页面中某一点下的所有内容重新绘制。