通过setTimeout来取消因大量计算造成的网页卡顿

js是单线程的,所以有些大量计算的操作会占用线程资源,导致页面卡住。

今天遇到这样一个场景,选择一个下拉框之后,对数据进行筛选,这个过程中有大量计算,点了selecte的option之后,option不隐藏,一直卡在那里,直到筛选计算完成。

这个体验非常差,于是想,能不能接触当前线程的占用,让交互看起来流畅些?

试着用刚刚触发的时候显示一个loading,然后用   setTimeout(func,0),  把计算的操作放到线程任务队列末尾,这样做果然页面操作不再卡顿了

时间: 2024-08-02 07:11:04

通过setTimeout来取消因大量计算造成的网页卡顿的相关文章

复利计算公器 网页版 0600

1.在myeclipse正常运行后,在浏览器地址栏输入:http://localhost:8080/calculate/Main,跳转到如下图程序首页, 2.程序提供了:两种计算方法:单利计算,复利计算.默认选择进入“单利计算”页面,如要进“复利计算”页面可以自行切换. 2.1:单利计算页面 2.2:复利计算页面 3.1 0600版本比0500版本增加了复利计算功能,同时,处于某个功能页面时,相应的按钮呈现高亮状态,更加人性化: 3.2 0600版本比0500版本增加了复利计算功能,还增加了,复

JavaScript 异步进化史

前言 JS 中最基础的异步调用方式是 callback,它将回调函数 callback 传给异步 API,由浏览器或 Node 在异步完成后,通知 JS 引擎调用 callback.对于简单的异步操作,用 callback 实现,是够用的.但随着负责交互页面和 Node 出现,callback 方案的弊端开始浮现出来. Promise 规范孕育而生,并被纳入 ES6 的规范中.后来 ES7 又在 Promise 的基础上将 async 函数纳入标准.此为 JavaScript 异步进化史. 同步

【转】JavaScript 异步进化史

前言 JS 中最基础的异步调用方式是 callback,它将回调函数 callback 传给异步 API,由浏览器或 Node 在异步完成后,通知 JS 引擎调用 callback.对于简单的异步操作,用 callback 实现,是够用的.但随着负责交互页面和 Node 出现,callback 方案的弊端开始浮现出来. Promise 规范孕育而生,并被纳入 ES6 的规范中.后来 ES7 又在 Promise 的基础上将 async 函数纳入标准.此为 JavaScript 异步进化史. 同步

游戏服务器主程白皮书-3.1 运行稳定性

3.1 运行稳定性 服务器的运行稳定性的产品展现当然就是7*24小时,甚至更久的不间断运行的产品质量.通俗一点说,就是服务器在7*24小时运行时间内服务器不出现卡顿,不出现宕机. 对于C++来说,宕机的原因99.9%是因为内存问题,内存的直接操作是让C++程序员又爱又恨的东西.其他的可能还包括物理故障.除数为0.系统问题(虚拟机问题)等.而卡顿的原因主要体现在CPU的使用率上.服务器CPU使用率过高了会因为CPU性能瓶颈导致卡顿,这个问题比较直观,但是CPU使用率低了也有可能导致卡顿.现在我把宕

fastclick.js源码解读分析

阅读优秀的js插件和库源码,可以加深我们对web开发的理解和提高js能力,本人能力有限,只能粗略读懂一些小型插件,这里带来对fastclick源码的解读,望各位大神不吝指教~! fastclick诞生背景与使用 在解读源码前,还是简单介绍下fastclick: 诞生背景 我们都知道,在移动端页面开发上,会出现一个问题,click事件会有300ms的延迟,这让用户感觉很不爽,感觉像是网页卡顿了一样,实际上,这是浏览器为了更好的判断用户的双击行为,移动浏览器都支持双击缩放或双击滚动的操作,比如一个链

1024 - 河南省多校连萌(三)(写了的题)

问题 B: Kick Ass Biu 时间限制: 1 Sec 内存限制: 128 MB 提交: 113 解决: 13 题目描述 在玩Kick Ass的时候,可以发现子弹的发射与飞船的移动非常有趣. 假设屏幕是个n×mn×m(竖直为n,水平为m)的矩形,以矩形左下角为原点,水平方向为x轴,向右为正方向,竖直方向为y轴,像上为正方向,建立平面直角坐标系.你的飞船在(x1,y1)点,射击目标在(x2,y2),你向目标发出了一发子弹,然而由于网页卡顿,这枚子弹并不会触碰到目标.所以,子弹将以每秒v单位的

网络性能优化常用方法

提升网页性能 http://www.w3cplus.com/performance/10-ways-minimize-reflows-improve-performance.html 网页卡顿的调试方法 都可以啊,timeline 比较直接,一般先看这个.profile,可以详细的看具体的调用信息. 页面只要不低于30帧 就都是流畅一般到26都看不出来 flash 是多少帧?gif一般8-12帧吧 大部分都用24帧…… 帧率要求高的一般都是3d 转动视角 对帧率要求很高 Excetional P

关于场景服务的一些想法

最近由于遇到一些问题,老大们决定把场景显示相关的代码拆分出来用一个独立的线程去做(大概是实现一个独立的场景服务吧),感觉这样挺好的,毕竟这部分功能本来就较为独立. 我对这部分内容还挺感兴趣的,思考了一下,心里有一个感觉是比较好的解决方法,遂提笔记录下来:) 先简单说说背景:地图场景是按格子划分的,每个格子有若干属性(key-value对),这些属性随着场景事件的触发而改变.由于相同的格子在不同的玩家看到可能会有不同的显示,因此需要为每个玩家独立计算,并不能简单的把格子数据直接同步给client.

电梯模拟 设计

今天为大家带来一个超级好玩的电梯模拟系统 ·题目概要 模拟某校九层教学楼的电梯系统.该楼有一个自动电梯,能在每层停留,其中第一层是大楼的进出层,即是电梯的"本垒层",电梯"空闲"时,将来到该层候命. 电梯一共有七个状态,即正在开门(Opening).已开门(Opened).正在关门(Closing).已关门(Closed).等待(Waiting).移动(Moving).减速(Decelerate). 乘客可随机地进出于任何层.对每个人来说,他有一个能容忍的最长等待时