Can setTimeout on KeyDown affect performance?(按键时设置超时会影响性能吗?)
问题描述
在另一个Stack Overflow成员的帮助下,我获得了使用Keydown设置快捷键的代码。
How to Check if jQuery .keydown() has any other keys pressed or not?
代码为每个单独的Keydown事件使用setTimeout函数。我在一个用户通常输入超过1000个单词的页面上使用它。(我假定为4K-5K字符)
这意味着Keydown将在所有5000次按键上运行,并且新的超时将多次启动。
var NewKeys = {};
var NewTimeout;
jQuery(document).keydown(function (e) {
if (NewTimeout) {
clearTimeout(NewTimeout);
}
NewKeys[e.which] = true;
NewTimeout = setTimeout(function () {
if (typeof NewKeys[17] !== "undefined" && typeof NewKeys[83] !== "undefined" && Object.keys(NewKeys).length === 2) {
e.preventDefault();
if(!jQuery('.SearchCreations').hasClass('Show')){
e.preventDefault();
jQuery('.SaveCreation').click();
}
}
if (typeof NewKeys[27] !== "undefined" && Object.keys(NewKeys).length === 1) {
jQuery('.Thumbnail.Close').click();
jQuery('.Action').removeClass('Collapse');
}
if (typeof NewKeys[16] !== "undefined" && typeof NewKeys[17] !== "undefined" && typeof NewKeys[83] !== "undefined" && Object.keys(NewKeys).length === 3) {
e.preventDefault();
if(jQuery('.CreationEditor').hasClass('Autosaving')){
jQuery('.StopSave').click();
}
else{
jQuery('.AutoSave').click();
}
}
}, 200);
});
这是否会影响最终用户的性能/可靠性。
您最不想做的事情就是拥有一个占用大量资源的网页,以至于您的用户设备无法正常工作。
我在6-7岁的笔记本电脑(i5,4 GB内存,Windows 10)上试用了这个代码。我注意到,如果我继续使用这个页面,它就可以正常工作。但如果我使用
Alt + Tab
将窗口切换到其他应用程序,并在大约5-7秒内返回到我的站点的浏览器,快捷键将停止工作。
我可以确认此行为是一致的,并且现在可以在多台Windows 10计算机上重现。
推荐答案
这在很大程度上取决于您的超时值以及您的打字速度。例如,您的超时时间是3,而您在秒内输入了5个字母。然后,您将得到15个同时运行的函数。
这很好,但如果您使用更长的超时时间,例如10s,并且您的速度是10个字母/秒,那么您将有100个函数同时运行,这是不合适的。
尤其是当您尝试执行比更改类和一些DOM操作更重的任务时。
这篇关于按键时设置超时会影响性能吗?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:按键时设置超时会影响性能吗?


基础教程推荐
- 如何在 Laravel 5.3 注册中添加动态下拉列表列? 2021-01-01
- 如何在 Laravel 中使用 React Router? 2022-01-01
- 学说 dbal querybuilder 作为准备好的语句 2022-01-01
- 有什么方法可以用编码 UTF-8 而不是 Unicode 返回 PHP`json_encode`? 2021-01-01
- PHP PDO MySQL 查询 LIKE ->多个关键词 2021-01-01
- PHP 类:全局变量作为类中的属性 2021-01-01
- 在PHP中根据W3C规范Unicode 2022-01-01
- 如何替换eregi() 2022-01-01
- YouTube API v3 点赞视频,但计数器不增加 2022-01-01
- Cron Jobs 调用带有变量的 PHP 脚本 2022-01-01