我为这个网站写了一个小绘图脚本（画布）：http : //scri.ch/
当您单击文档时，每个mousemove事件基本上都会执行以下操作：
- 获取坐标。
-context.lineTo()在这一点和前一点之间
-context.stroke()线
如您所见，如果您非常快地移动光标，则事件触发不够（取决于您的 CPU / 浏览器 / 等），并且会跟踪一条直线。
在伪代码中：
window.addEventListener('mousemove', function(e){
myContext.lineTo(e.pageX, e.pageY);
myContext.stroke();
}, false);
这是一个已知问题，解决方案很好，但我想对其进行优化。
因此，不是stroke()每次触发 mousemove 事件时，我都会将新坐标放入数组队列中，并使用计时器定期绘制/清空它。
在伪代码中：
var coordsQueue = [];
window.addEventListener('mousemove', function(e){
coordsQueue.push([e.pageX, e.pageY]);
}, false);
function drawLoop(){
window.setTimeout(function(){
var coords;
while (coords = coordsQueue.shift()) {
myContext.lineTo(coords[0], coords[1]);
}
myContext.stroke();
drawLoop();
}, 1000); // For testing purposes
}
但它并没有改善线路。所以我试着只在mousemove. 相同的结果：点之间的空间太大。
这让我意识到第一个代码块足够高效，只是mousemove事件触发太慢了。
所以，在我花了一些时间实现了一个无用的优化之后，轮到你了：有没有办法优化mousemoveDOM 脚本中的触发速度？
是否可以随时“请求”鼠标位置？
感谢您的建议！