方案1:针对支持html5 webworker的现代浏览器方案:。
代码1.你的大量计算,放到一个js文件中。如下:
//job.js
onmessage =function (evt){
//do massive job.在这里你进行大量耗时的计算过程。
postMessage( data );//将计算结果的数据发送会主线程
}
你的页面代码:
方案2:对于不支持WebWorker线程的浏览器。
可以考虑分批处理。即是说创造一个间隔定时器setInterval。
每隔一小段时间,处理大量数据中的一部分。
这样就可以避免大量计算导致浏览器卡死。
大致代码如下(这里是简单的例子。具体情况具体分析。):
假设我们要计算1000万个数据的和。
var jobData = [];//假设是一个数组。里面有1000万个数据。
function sliceJob(){
var num = (jobData.length / 100) + 1;//把任务数据划分为100份。
var portion = 100000;//每份有10万个数字。
var addition = 0;//这里用来保存最后的结果。一开始是0;
var intv = setInterval(function(){
if(num--){
//然后每一份结果。
additoin += every;
} else {
计算最后一份,然后输出结果。
alert('最终结果是:', addition);
window.clearInterval(intv);
}
}, 50);
}
此外。jQuery的deferred对象无法实现你的要求。
因为deferred对象的目的是为了串行处理异步过程。
但是异步过程在执行的过程中,如果耗时过长,仍然会阻塞浏览器线程,导致浏览器不可操作(卡死)。
唯一的一个例外是$.ajax。$.ajax方法也会返回一个Deferred对象。但是由于该异步过程是用的XMLHttpRequest。而xhr默认是异步执行的,相当于另起一个线程,因此不会阻塞浏览器县城。
按我个人的理解
使用deffered对象是一种回调函数的解决方案,在执行js代码的时候,页面实际上还是被卡住的
我觉得最靠谱的解决方案还是使用ajax请求另外一个地址,把这些操作交给后台脚本执行并返回结果,只有这样,页面才不会被阻塞(就好像动态加载分页一样,会在html上显示一个loading,但你依然可以进行其他操作,页面也不会卡住)
你如果一定要用js的话,可以参考一下nodeJS,这样js就可以在服务器端运行。。。
使用 ajax技术 异步处理 enecy=true