javascript引擎长时间独占线程造成卡顿的解决方案


Posted in Javascript onDecember 03, 2014

Javascript 引擎的单线程特性使得在处理一个较大的循环遍历时会长时间独占线程,导致其它事件(例如用户操作)无法及时响应,严重时造成卡顿甚至是假死现象。为解决上述问题,一种可行机制是将大的循环拆分成若干小的循环片段分片执行,使得Javascript 引擎有时机在各段之间插入执行其它事情,从而有效改善性能体验

Ansync.js

function Ansync (totalCount, segmentCount, workCallback, returnCallback)

{

    var num_of_item_for_each_segment = segmentCount;

    var num_of_segment = Math.ceil(totalCount / num_of_item_for_each_segment);

    var count_of_segment = 0;

    var timer;

    var start, end;

    this.process = function(scope, timeout)

    {

        if (scope != undefined)

        {

            workCallback = workCallback.bind(scope);

            returnCallback = returnCallback ? returnCallback.bind(scope) : undefined;

        }

        if (count_of_segment == num_of_segment)

        {

            clearTimeout(timer);

            if (returnCallback != undefined)

                returnCallback();

        }

        else

        {

            start = count_of_segment * num_of_item_for_each_segment;

            end = Math.min(totalCount, (count_of_segment + 1) * num_of_item_for_each_segment);

            if (num_of_segment == 1)//needn't create timer

            {

                workCallback(start, end);

                count_of_segment = 1;

                this.process();

            }

            else

            {

                timer = setTimeout(function ansyncTimeout(){

                    if (workCallback(start, end)) //finish process if function returns true

                    {

                        count_of_segment = num_of_segment;

                    }

                    else

                    {

                        count_of_segment++;

                    }

                    this.scope.process();

                }.bind({scope: this}),timeout == undefined ? Ansync.TimeOut : timeout);

            }

        }

    }

}

Ansync.TimeOut = 5;

方法很简单,但是很实用,有相同项目需求的小伙伴参考下吧

Javascript 相关文章推荐
jquery 插件 任意位置浮动固定层
Dec 25 Javascript
JavaScript高级程序设计阅读笔记(五) ECMAScript中的运算符(一)
Feb 27 Javascript
js修改table中Td的值(定义td的双击事件)
Jan 10 Javascript
瀑布流布局代码一例
Apr 11 Javascript
CascadeView级联组件实现思路详解(分离思想和单链表)
Apr 12 Javascript
Javascript基于jQuery UI实现选中区域拖拽效果
Nov 25 Javascript
BootStrap表单宽度设置方法
Mar 10 Javascript
webpack+vuex+axios 跨域请求数据的示例代码
Mar 06 Javascript
小程序跨页面交互的作用与方法详解
Jan 07 Javascript
javascript设计模式 ? 单例模式原理与应用实例分析
Apr 09 Javascript
nuxt+axios实现打包后动态修改请求地址的方法
Apr 22 Javascript
vue 清空input标签 中file的值操作
Jul 21 Javascript
javascript中clone对象详解
Dec 03 #Javascript
javascript使用正则表达式检测IP地址
Dec 03 #Javascript
Javascript快速排序算法详解
Dec 03 #Javascript
Javascript冒泡排序算法详解
Dec 03 #Javascript
Javascript堆排序算法详解
Dec 03 #Javascript
node.js下when.js 的异步编程实践
Dec 03 #Javascript
jquery操作 iframe的方法
Dec 03 #Javascript
You might like
咖啡的植物学知识
2021/03/03 咖啡文化
php中用数组的方法设置cookies
2011/04/21 PHP
php学习笔记之 函数声明
2011/06/09 PHP
php中使用$_REQUEST需要注意的一个问题
2013/05/02 PHP
PHP把JPEG图片转换成Progressive JPEG的方法
2014/06/30 PHP
thinkphp实现图片上传功能
2016/01/13 PHP
PHP中的多种加密技术及代码示例解析
2016/10/20 PHP
PHP实现RTX发送消息提醒的实例代码
2017/01/03 PHP
jQuery下通过$.browser来判断浏览器.
2011/04/05 Javascript
JavaScript进阶练习及简单实例分析
2016/06/03 Javascript
浅谈jquery选择器 :first与:first-child的区别
2016/11/20 Javascript
JQuery Dialog对话框 不能通过Esc关闭的原因分析及解决办法
2017/01/18 Javascript
es6学习笔记之Async函数基本教程
2017/05/11 Javascript
vue.js 初体验之Chrome 插件开发实录
2017/05/13 Javascript
vue 的keep-alive缓存功能的实现
2018/03/22 Javascript
vue-cli3 DllPlugin 提取公用库的方法
2019/04/24 Javascript
使用vue for时为什么要key【推荐】
2019/07/11 Javascript
使用element-ui的el-menu导航选中后刷新页面保持当前选中状态
2019/07/19 Javascript
[40:27]完美世界DOTA2联赛PWL S3 PXG vs GXR 第一场 12.19
2020/12/24 DOTA
python 切片和range()用法说明
2013/03/24 Python
Python利用多进程将大量数据放入有限内存的教程
2015/04/01 Python
python创建和删除目录的方法
2015/04/29 Python
python的多重继承的理解
2017/08/06 Python
Python探索之自定义实现线程池
2017/10/27 Python
Python多进程库multiprocessing中进程池Pool类的使用详解
2017/11/24 Python
python ddt实现数据驱动
2018/03/14 Python
python之消除前缀重命名的方法
2018/10/21 Python
python把1变成01的步骤总结
2019/02/27 Python
python实现整数的二进制循环移位
2019/03/08 Python
python and or用法详解
2019/06/26 Python
html5摇一摇代码优化包括DeviceMotionEvent等等
2014/09/01 HTML / CSS
巴西世界杯32强口号
2014/06/05 职场文书
父亲节活动策划方案
2014/08/24 职场文书
党的群众路线教育实践活动个人整改措施
2014/10/27 职场文书
小学班主任经验交流材料
2014/12/16 职场文书
家长评语怎么写
2014/12/30 职场文书