• 使用requestAnimationFrame代替setInterval,解决浏览器内存溢出


    1:为什么要写这样的方法,页面需求是需要实时的请求接口,控制组件的位置。当大量组件使用了计时器,会造成网页内存溢出。

    const RAF = {
    intervalTimer: null,
    timeoutTimer: null,
    setTimeout (cb, interval) { // 实现setTimeout功能
    let now = Date.now
    let stime = now()
    let etime = stime
    let loop = () => {
    this.timeoutTimer = requestAnimationFrame(loop)
    etime = now()
    if (etime - stime >= interval) {
    cb()
    cancelAnimationFrame(this.timeoutTimer)
    }
    }
    this.timeoutTimer = requestAnimationFrame(loop)
    return this.timeoutTimer
    },
    clearTimeout () {
    cancelAnimationFrame(this.timeoutTimer)
    },
    setInterval (cb, interval) { // 实现setInterval功能
    let now = Date.now
    let stime = now()
    let etime = stime
    let loop = () => {
    this.intervalTimer = requestAnimationFrame(loop)
    etime = now()
    if (etime - stime >= interval) {
    stime = now()
    etime = stime
    cb()
    }
    }
    this.intervalTimer = requestAnimationFrame(loop)
    return this.intervalTimer
    },
    clearInterval () {
    cancelAnimationFrame(this.intervalTimer)
    }
    }
     
    let count = 0
    function a() {
    console.log(count)
    count++
    }
    RAF.setInterval(a, 1000)
  • 相关阅读:
    2019 SDN大作业
    个人作业——软件工程实践总结作业
    1.机器学习,从入门到放弃入门
    python25之进制转换
    python学习24之异常
    python学习23之标准库
    python学习22之函数式编程
    python学习21之高级特性
    python学习20之面向对象编程高级
    python学习19类5之多态与鸭子模型
  • 原文地址:https://www.cnblogs.com/binglove/p/11797275.html
Copyright © 2020-2023  润新知