如何解决当开发者控制台打开时,为什么鼠标事件的采样率更高?作为开发者,我可以/应该做些什么?
当我发现开发人员控制台打开时,我正在绘制的线条更加“像素化”时,我正在使用mousemove
事件在HTML画布上绘画。我怀疑原因是在开发人员控制台打开时,鼠标事件的采样/触发速率要高得多。
您可以使用以下代码段进行验证。在装有Chrome和Opera的Windows 10笔记本电脑上,除非我打开开发者控制台(使用Ctrl + Shift + J),否则每秒最多最多可以看到60个事件。
const header = document.querySelector('h3');
let eventsPerSec = 0;
function decreaseCounter() {
eventsPerSec--;
renderText();
}
function renderText() {
header.innerHTML = `Mouse move events in the last second: ${eventsPerSec}`
}
document.addEventListener('mousemove',event => {
eventsPerSec++;
setTimeout(decreaseCounter,1000);
renderText();
})
renderText();
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>Count Events</title>
<h3>
</h3>
</head>
所以我的问题有两个:
- 为什么Chrome和Opera会以这种方式运行?我认为让系统处于调试/开发人员模式与生产环境的行为通常是一个坏主意。
- 作为开发人员,我可以还是应该以某种方式弥补这些差异?对于绘图应用程序,差异是显而易见的,但差异很小,因此我可以忽略它们,但是我可以想象在某些情况下影响更大。
PS:结果可能会因浏览器和版本(可能是操作系统或其他原因)而异。在Chrome和Edge中打开开发者控制台时,一个朋友每秒最多只能接收128个事件。不论有无开发控制台,Firefox的最高支持为60。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。