js 性能优化 - web worker
当在 HTML 页面中执行脚本时,页面的状态是不可响应的,直到脚本已完成。
web worker 是运行在后台的 JavaScript,独立于其他脚本,不会影响页面的性能。
您可以继续做任何愿意做的事情:点击、选取内容等等,而此时 web worker 在后台运行。
细节:
所有主流浏览器均支持 web worker,除了 Internet Explorer。 (包括 edge )
由于 web worker 位于外部文件中,它们无法访问下例 JavaScript 对象:
- window 对象
- document 对象
- parent 对象
过程:
w=new Worker("demo_workers.js"); - postMessage() (event.data) - w.terminate();
<!DOCTYPE html>
<html>
<body> <p>Count numbers: <output id="result"></output></p>
<button onclick="startWorker()">Start Worker</button>
<button onclick="stopWorker()">Stop Worker</button>
<br /><br /> <script>
var w; function startWorker()
{
if(typeof(Worker)!=="undefined")
{
if(typeof(w)=="undefined")
{
w=new Worker("demo_workers.js");
}
w.onmessage = function (event) {
document.getElementById("result").innerHTML=event.data;
};
}
else
{
document.getElementById("result").innerHTML="Sorry, your browser
does not support Web Workers...";
}
} function stopWorker()
{
w.terminate();
}
</script> </body>
</html>
js 性能优化 - web worker的更多相关文章
- js性能优化-事件委托
js性能优化-事件委托 考虑一个列表,在li的数量非常少的时候,为每一个li添加事件侦听当然不会存在太多性能方面的问题,但是当列表非常的长,长到上百上千甚至上万的时候(当然只是一个解释,实际工作中很少 ...
- js 性能优化利器:prepack
1. js 性能优化 js 本身是没有像 python 一样的预编译功能,更没有像 java 一样的编译功能,所以,这里所说的 js 代码预编译 只是通过工具实现的类似功能而已. 这就要提到 prep ...
- js 性能优化 篇一
JS性能优化 摘自:http://www.china125.com/design/js/3631.htm 首先,由于JS是一种解释型语言,执行速度要比编译型语言慢得多.(注:,Chrome是第一款内 ...
- js性能优化文章集锦
总结的js性能优化方面的小知识http://www.it165.net/pro/html/201503/35336.html 如何优化你的JS代码http://www.php100.com/html/ ...
- Web篇之JS性能优化
首先,性能优化分好几个方面,本章我们从js方面来优化. 1:垃圾收集 日常中的某些情况下垃圾收集器无法回收无用变量,导致的一个结果就是——内存使用率不断增高,以下为对应的情况以及处理方法. ①对象相互 ...
- JS性能优化笔记搜索整理
通过网上查找资料了解关于性能优化方面的内容,现简单整理,仅供大家在优化的过程中参考使用,如有什么问题请及时提出,再做出相应的补充修改. 一. 让代码简洁:一些简略的表达方式也会产生很好的优化 eg:x ...
- 性能优化——Web前端性能优化
核心知识点: 1.排查网站性能瓶颈的手法:分析各个环节的日志,找出异常部分 2.Web前端:网站业务逻辑之前的部分(浏览器.图片服务.CDN) 3.优化手段 1)浏览器优化 (1)减少http请求 a ...
- js性能优化--学习笔记
<高性能网站建设进阶指南>: 1.使用局部变量,避免深入作用域查找,局部变量是读写速度最快的:把函数中使用次数超过一次的对象属性和数组存储为局部变量是一个好方法:比如for循环中的.len ...
- JS线程模型&Web Worker
js线程模型 客户端javascript是单线程,浏览器无法同时运行两个事件处理程序 设计为单线程的理论是,客户端的javascript函数必须不能运行太长时间,否则会导致web浏览器无法对用户输入做 ...
随机推荐
- HTML5 localStorage setItem getItem removeItem
HTML5 WEB存储中提供了两种客户端的数据存储方法:localStorage 还有sessionStorage localStorage: localStorage 方法存储的数据没有时间限制.第 ...
- 191022Django模板
一.变量和句点符深度查找 字符串变量引用 def show_time(request): now_time = datetime.datetime.now() return render(reques ...
- 保存json数据到本地和读取本地json数据
private void saveJson(JsonBean bean) { File file = new File(getFilesDir(), "json.txt"); Bu ...
- eigenvalues problem
由于在看paper中经常会看到generalized eigenvalues.eigenvalues problem等字眼,今晚终于开始认真地重新看了一下线性代数中这部分内容.下面是在学习过程中找出来 ...
- Linux配置全局jdk以及Tomcat服务器简单测试
Linux配置全局jdk 1.确保相应文件夹下有apache-tomcat和jdk的压缩文件 注意:jdk文件必须为适应Linux版本的文件 (如果已经有了相应文件,可以跳过以下第2-3个步骤) 2. ...
- pip提示ModuleNotFoundError: No module named 'pkg_resources'
卸载setuptools后,pip下载python包一直提示ModuleNotFoundError: No module named 'pkg_resources',如下图: 在网上找了很多贴了都无法 ...
- Revo Uninstaller Pro - 真正彻底卸载软件不留垃圾的强大神器!(清理安装残留文件/注册表)
大家都知道 Windows 在卸载软件时总是不够彻底,系统C盘总会留下大量难以辨别和清理的垃圾文件和临时文件,时间长了注册表也会变得非常臃肿,不仅浪费硬盘空间,而且也会明显拖慢系统响应和启动速度. R ...
- mysql——多表——子查询——示例
子查询: 子查询是将一个查询语句嵌套在另外一个查询语句中,内层查询语句的查询结果,可以作为外来层查询语句提供查询条件. 因此在特定条件下,一个查询语句的条件,需要另外一个查询语句来获取. 前期准备表: ...
- SpringBoot自动化配置之二:自动配置(AutoConfigure)原理、EnableAutoConfiguration、condition
自动配置绝对算得上是Spring Boot的最大亮点,完美的展示了CoC约定优于配置: Spring Boot能自动配置Spring各种子项目(Spring MVC, Spring Security, ...
- 面试官:new一个对象有哪两个过程?
Java在new一个对象的时候,会先查看对象所属的类有没有被加载到内存,如果没有的话,就会先通过类的全限定名来加载.加载并初始化类完成后,再进行对象的创建工作. 我们先假设是第一次使用该类,这样的话n ...