语文建设编辑部官方网站,网站怎么做响应式布局,网站建设教程怎么建,rar在线解压缩网站《高性能网站建设进阶指南》#xff1a; 1.使用局部变量#xff0c;避免深入作用域查找#xff0c;局部变量是读写速度最快的#xff1b;把函数中使用次数超过一次的对象属性和数组存储为局部变量是一个好方法#xff1b;比如for循环中的.length通常可以保存为局部变量。 …《高性能网站建设进阶指南》 1.使用局部变量避免深入作用域查找局部变量是读写速度最快的把函数中使用次数超过一次的对象属性和数组存储为局部变量是一个好方法比如for循环中的.length通常可以保存为局部变量。 2多个if时if顺序按概率降序排列 3当仅判断一两个条件时if通常比switch更快当有两个以上条件且条件比较简单不是范围判定时switch通常更快因为多数情况下switch语句中执行单个条件的时间比if短 4循环中把循环变量递减到0而不是递增到长度把条件改成了与0比较速度更快如for(var iarr.length;i--){}; 5,避免for in;for in是用来遍历对象的可枚举属性需要遍历整个原型链来查找可枚举属性若 Array.prototype.myffunction(){};//数据属性默认都是可枚举的var a[a,b];for(var p in a){console.log(p,a[p]);} 输出将是 0,a1,bmyf,function (){} 对于object同样如此所以一般需要用hasOwnProperty来确保只变例对象实例自身的属性。 若已知对象的属性则采用普通的for循环性能优于for in如var arr[p1,p2,p3];for(){process(obj[arr[i]]);} 6,性能优化拆分js减少初次render的下载量注意会出现用户点击时事件绑定还没完成的情况。js延迟下载 7css选择符匹配顺序是从右到左的避免通配符用classname代替标签名利用属性继承。。。。。。 《高性能javascript》 V8 引擎由以下几个核心部分组成 基本编译器base compiler在你的代码运行之前它会分析你的 JavaScript 代码并生成本地机器码而不是执行字节码或简单地解释它。这种机器码起初是没有被高度优化的。V8 将对象解析为对象模型object model。对象是在 JavaScript 中是以关联数组的方式呈现的但是在 V8 引擎中它们是通过隐藏类hidden classes的方式来表示的。这是一种可以优化查找的内部类型机制。一个运行时分析器runtime profiler它监视正在运行的系统并标识 “hot” 函数也就是那些最后会花费大量运行时间的代码。一个优化编译器optimizing compiler它重新编译和优化那些被运行时分析器标识为 “hot” 的代码并进行 “内联” 等优化例如在函数被调用的地方用函数主体去取代。V8支持逆优化deoptimization这意味着如果优化编译器发现在某些假定的情况下把一些已经优化的代码进行了过度的优化它会舍弃优化后的代码。垃圾回收器理解它的运作原理和理解如何优化你的JavaScript代码同等重要。垃圾回收是内存管理的一种机制垃圾回收器的概念是它将试图回收那些不再被使用的对象所占据的内存在像 JavaScript 这种支持垃圾回收的语言中如果程序中仍然存在指向一个对象的引用那么该对象将不会被回收。 在大多数情况下我们没有必要去手动得解除对象的引用de-referencing。只需要简单滴将变量放在需要它们的位置在理想的情况下尽可能使用局部变量也就是说在它们被使用的函数中声明它们而不是在更外层的作用域垃圾就能正确地被回收。 在 JavaScript 中强制进行垃圾回收是不可能的而且你也不应该尝试这样做因为垃圾回收是由运行时控制并且它通常知道垃圾回收的最佳时机。在可能的情况下尽量避免使用 delete 尽管如此你肯定会发在许多流行的 JavaScript 库中使用了 delete - 这有它语言目的。这里的主旨是避免在运行时修改 “hot” 对象的结构JavaScript 引擎可以检测到这些 “hot” 的对象并尝试对其进行优化。如果在对象的生命期中没有遇到重大的结构改变引擎的检测和优化过程会来得更加容易而使用 delete 则会触发对象结构上的这种改变。 不少人对 null 的使用上也存在误解。将一个对象引用设置为 null并不是意味着“清空”该对象只是将它的引用指向 null。使用 o.x null 比使用 delete 会更好些但这甚至可能也是不必要的。 如果此引用是当前对象的最后引用那么该对象就满足了垃圾回收的资格。如果此引用不是当前对象的最后引用则该对象是可访问的而不会被垃圾回收。 另外需要注意的是全局变量在页面的生命周期中是不会被垃圾回收器清理的。只要页面保持打开状态全局对象就会常驻在内存当中。只有当刷新页面、导航到其他页面、关闭标签页或退出浏览器时全局变量才会被清理。函数作用域的变量超出作用域范围时它就会被清理。当函数完全结束并且再没有任何引用指向其中的变量函数中的变量会被清理。 经验法则 为了使垃圾回收器尽早回收尽可能多的对象请不要保留hold on不再需要的对象。(qi:比如在函数里return一个不需要的变量因为这会导致变量不会被回收)这里有几点需要谨记 就像之前所说的那样比手动删除变量引用更好的方式是在恰当的作用域中使用变量例如尽量在函数作用域中声明变量而尽可能不要声明不会被回收的全局变量这将意味着更干净更省心的代码。确保解绑那些不再需要的事件监听器尤其是那些即将被移除的 DOM 对象所绑定的事件。如果你正在使用数据缓存确保手动清理缓存或者使用衰老机制避免缓存中储存大量不会被重用的数据。数组字面量非常有用它可以暗示数组的大小和类型。它通常用在体积不大的数组中。 // V8 知道你需要一个长度为 4 并且储存数字的数组var a [1, 2, 3, 4];// 不要这样做a []; // V8 将对数组一无所知for(var i 1; i 4; i) { a.push(i);} qi:闭包也会导致变量不会被回收,事件委托$(table).on(click, td, ...)优于$(table td).on(click, ...) 当浏览器重新渲染文档中的元素时需要重新计算它们的位置和几何形状时我们称之为回流。回流会阻塞用户在浏览器中的操作因此理解提升回流时间是非常有帮助的。使用document.createDocumentFragment()创建了一虚拟的节点对象节点对象包含所有属性和方法,保存多个小节点后在append;在所有节点类型中只有文档片段DocumentFragment在文档中没有对应的标记。DOM规定文档片段documentfragment是一种”轻量级“的文档可以包含和控制节点但不会像完整的文档那样占用额外资源。即当请求把一个 DocumentFragment 节点插入文档树时插入的不是 DocumentFragment 自身而是它的所有子孙节点。这使得 DocumentFragment 成了有用的占位符暂时存放那些一次插入文档的节点。它还有利于实现文档的剪切、复制和粘贴操作尤其是与 Range 接口一起使用时更是如此. qi: css性能尽量repaint而不是reflow. 显式设置图片的宽高: 当浏览器加载页面的HTML代码时有时候需要在图片下载完成前就对页面布局进行定位。如果HTML里的图片没有指定尺寸宽和高或者代码描述的尺寸与实际图片的尺寸不符时浏览器则要在图片下载完成后再“回溯”该图片并重新显示这会消耗额外时间。所以最好为页面里的每一张图片都指定尺寸不管是在页面HTML里的img标签还是在CSS里。 浏览器解析页面顺序参考http://www.alloyteam.com/2015/05/wang-ye-xing-neng-zhi-html-css-javascript/ qi浏览器得到某个页面后按顺序开始解析遇到css file和image发相应的请求同时继续往下到结束就构建好了无样式的dom treecss file下载后解析得到CSSOM,结合dom tree开始渲染得到render tree至此在chrome developer tool里就是domComplete完成的时间蓝色竖线等image下载好插入render tree至此在chrome developer tool里就是domLoader完成的时间红色竖线.因为js有可能改变dom tree结构所以如果遇到js file会暂时停止其他渲染行为等js解析完成后再渲染。 使用async标识的javascript浏览器将异步执行javascript不会阻塞正常的dom渲染。转载于:https://www.cnblogs.com/yigeqi/p/4598771.html
