zoukankan      html  css  js  c++  java
  • js里面可以提升性能的有哪些方法

    1.懒加载

      常见的就是图片的懒加载效果,每次浏览网页的时候,不是一次性将网页中的图片都加载过来,而是将可见范围内的图片加载过来,等到用户浏览下面网页的时候,再开始加载没有加载出来的图片

    2. 事件委托

      事件委托就是给当前要绑定事件的父元素绑定要绑定的事件,通过事件源来判定当前点击的是哪个元素。这样做是为了减少事件的绑定次数,提高性能,而且还可以实现对未来元素的绑定。

    3.函数的节流与放流

            函数的防抖就是通过定时器,来稀释事件触发的频率,只有停止对当前事件的触发,才会执行当前事件要执行的函数。

      函数的节流就是尽可能的较少事件触发的频率,通过延时器和开关门来实现。

    4. 惰性函数

      惰性函数是减少函数的逻辑判断次数,只有在第一次执行的时候,才会进行判断,之后都不进行判断,而是直接进入函数,执行即可。

    5.文档碎片

      在页面中创建多个元素,每次进行创建于添加,多次进行dom操作,消耗网页性能,可以在每次创建完元素之后,放入文档碎片,最后一次性放入页面中。

    6.回流与重绘

      当渲染树中的一部分或者全部因为元素的尺寸、布局、隐藏等改变而需要重新构建的时候,这时候就会发生回流。

          每个页面都至少发生一次回流,也就是页面第一次加载的时候。

          在回流的时候,浏览器会使渲染树中受到影响的元素部分失效,并重新绘制这个部分的渲染树,完成回流以后,浏览器会重新绘制受到影响的部分元素到屏幕中,这个过程就是重绘

    7. 循环遍历arr dom节点集合,先把.length缓存在一个变量中,为了减少页面中计算的次数

    8.在进行鼠标按下,移动抬起实现拖拽的时候,拖拽三剑客在使用dom二级事件触发的时候,清除鼠标移动事件的时候,也会使用到变量的缓存。

  • 相关阅读:
    POJ3213(矩阵乘法)
    jquery:ajax不接收返回值回
    Swift UI学习UITableView and protocol use
    也可以看看GCD(杭州电2504)(gcd)
    数据结构—队列
    HDU 4946 Area of Mushroom 凸包
    UVa 353
    照片教你eclipse通过使用gradle 打包Android
    普林斯顿大学公开课 算法1-8:并检查集合 高速查找
    Codeforces Round #246 (Div. 2)
  • 原文地址:https://www.cnblogs.com/lxz123/p/11748740.html
Copyright © 2011-2022 走看看