zoukankan      html  css  js  c++  java
  • 千峰老师前端性能优化之节流

    大前锋名匠公开赛中的千峰root老师讲解了前端的性能优化之节流与防抖,这里是节流的方法。

    节流:即在一定时间内减少事件执行的次数。

    root老师是通过闭包的方式解决的节流问题。

    code如下:

    <div class="box"></div>
    

     

    //通过函数闭包实现节流
    function throttle(callback,wait){
        //设置上吃执行时间
        let prev = 0;
       //返回函数
       return function(){
            //获取当前时间戳
            let now = Date.now();
            //获取参数
            let args = arguments;
            //上一个时间与当前时间做判断
            if(now - prev > wait){//如果当前时间戳减去上一次执行的时间戳大于设置的时间数,就执行
                //设置this指向
                 callback.apply(this,args);
                //更新执行时间
                prev = now;
           }
        }                    
    }   
    
    //获取元素
    let box=document.querySelector(".box");
    
     //次数
    
    let cont=0;
    
    //设置事件
    box.onmousemove=throttle(function(){
       cont++;
        console.log("事件执行了"+cont+"次");
    
    },1000)
    

      

      

  • 相关阅读:
    python's is&==区别
    python's decorator&wrapper
    objects & values & types
    linux sort命令
    partial function
    proc文件系统
    readlink 获取当前进程对应proc/self/exe
    Workgroup&Domain(Realm)
    python传值&值引用
    Unpacking Argument Lists
  • 原文地址:https://www.cnblogs.com/xiaojianwei/p/10986064.html
Copyright © 2011-2022 走看看