高性能javascript(记录三)】的更多相关文章

避免双重求值 有四个标准函数可以允许你传入代码的字符串,然后它才你动态执行.它们分别是:eval.Function.setTimeout.setInterval 事实上当你在javascript代码中执行另外一段javascript代码时,都会导致双重求值的性能消耗,所以在大多数情况下,没必要使得eval和Function函数,因此最好避免使用它们.至于setTimeout和setInterval,建议传入函数而不是字符串来作为第一个参数 现在Safari4和chrome的javaScript引…
title: JavaScript学习记录三 toc: true date: 2018-09-14 23:51:22 --<JavaScript高级程序设计(第2版)>学习笔记 要多查阅MDN Web 文档 面向对象的程序设计 创建对象 工厂模式 工厂模式是软件工程领域广为人知的一种设计模式,这种模式抽象了创建具体对象的过程. 用函数来封装以特定接口创建对象的细节: function createPerson(name, age, job) { var o = new Object; o.na…
第八章.编程实践 Programming Practices 经验: 避免使用 eval_r()和Function构造器避免二次评估.此外,给setTimeout()和setInterval()函数传递参数而不是字符串参数. 创建新对象和数组使用对象直接量和数组直接量.它们比非直接量形式创建和初始化更快. 避免重复进行相同工作.当需要检测浏览器时,使用延迟加载或条件预加载. 当执行数学运算时,考虑使用位操作,它直接在数字底层操作. 原生方法总是比其他方法写的东西更快,尽量使用原生方法. 第九章.…
前些天收到了HTML5中国送来的<高性能javascript>一书,便打算将其做为假期消遣,顺便也写篇文章记录下书中一些要点. 个人觉得本书很值得中低级别的前端朋友阅读,会有很多意想不到的收获. 第一章 加载和执行 基于UI单线程的逻辑,常规脚本的加载会阻塞后续页面脚本甚至DOM的加载.如下代码会报错: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8…
本文是学习<高性能javascript>(Nichols C. Zakes著)的一些总结,虽然书比较过时,里面的知识点也有很多用不上了,但是毕竟是前人一步步探索过来的,记录着javascript艰难的发展历程,如今站在巨人的肩膀上,也许我们也能发掘更好的javascript性能. 第一章:加载和执行 管理浏览器中的javascript代码是个棘手的问题,因为代码执行过程会阻塞浏览器的其他进程,比如用户界面绘制,每次遇到<script>标签,页面必须停下来等待代码下载(如外部链接文件…
最近在阅读这本Nicholas C.Zakas(javascript高级程序设计作者)写的最佳实践.性能优化类的书.记录下主要知识. 加载和执行 脚本位置 放在<head>中的javascript文件会阻塞页面渲染:一般来说浏览器中有多种线程:UI渲染线程.javascript引擎线程.浏览器事件触发线程.HTTP请求线程等.多线程之间会共享运行资源,浏览器的js会操作dom,影响渲染,所以js引擎线程和UI渲染线程是互斥的,导致执行js时会阻塞页面的渲染.最佳实践:所有的script标签应尽…
<高性能javascript> 领悟随笔之-------DOM编程篇二 序:在javaSctipt中,ECMASCRIPT规定了它的语法,BOM实现了页面与浏览器的交互,而DOM则承载着整个页面文档.DOM编程性能一直以来都是非常受开发者关注的话题,如何编写高性能的DOM是前端开发必不可少的技能. 1.重绘与重排 当浏览器加载完页面所有的元素.js.css.图片之后会自动生成两个数据结构: 1.dom树 (图片为转载) 如图所示,dom树表示了整个页面文档的结构,通过访问dom树我们可以得到某…
参考 高性能javascript javascript高级程序设计 ajax基础  ajax技术的核心是XMLHttpRequest对象(XHR),通过XHR我们就可以实现无需刷新页面就能从服务器端读取数据 var xhr = new XMLHttpRequest(); //只支持IE7以及更高的版本 xhr.onreadystatechange = function() { if(xhr.readyState == 4) { if( (xhr.status >= 200 && xh…
先回顾下前文高性能JavaScript DOM编程,主要提了两点优化,一是尽量减少DOM的访问,而把运算放在ECMAScript这一端,二是尽量缓存局部变量,比如length等等,最后介绍了两个新的API querySelector()以及querySelectorAll(),在做组合选择的时候可以大胆使用.而本文主要讲的是DOM编程可能最耗时的地方,重排和重绘. 1.什么是重排和重绘 浏览器下载完页面中的所有组件--HTML标记.JavaScript.CSS.图片之后会解析生成两个内部数据结构…
众所周知浏览器是使用单进程处理UI更新和JavaScript运行等多个任务的,而同一时间只能有一个任务被执行,如此说来,JavaScript运行了多长时间就意味着用户得等待浏览器响应需要花多久时间. 从认知上来说,解析器解析一个界面的时候都是从上至下依次解析的,这就是说界面上出现多少个<script>标签(不管是内联还是外部文件),页面下载和解析必须停止等待脚本下载完成并运行完成(注意这里包括运行),这个过程当中,页面解析和用户交互是被完全阻塞的. Javascript第一条定律:将脚本放在底…