zoukankan      html  css  js  c++  java
  • 帧与性能

    人眼感觉不到卡顿的效果需要60帧,打游戏都知道为60fps。页面性能如果低于60fps,那么能明显感觉到。

    60fps,即需要在1000ms中处理60次,处理一次的时长为1000/60 约16ms。但是浏览器还需要对每帧进行处理,所以留给我们的只有10-12ms。我们所做的操作就需要尽可能的快。

    那么如何保证我们的代码能达到60fps呢,这里我们需要对每帧包含的内容有所了解,可以分为以下几个步骤:

    1.javascript

    2.style

    3.layout

    4.paint

    5.composite

    但是上面的5步不是必须的。如果更改width,height,margin-left等需要重新计算的样式时,则会经历3、4、5几个步骤;如果更改color,background等需要2、4、5步骤;如果用transform等,则只会触发步骤5。而layout又是其中比较耗时的。

    我们看到的网页是由多个图层构成的,我们可以用transform3d,opcity等方法创建一个图层,在图层上面操作,这样避免影响到更多的元素,提升了性能

  • 相关阅读:
    jeesite导入导出
    jeesite下载
    百度echart
    js获取日期
    清除svn
    父子窗口
    JS高级程序设计之高级技巧
    JS中离线应用与客户端存储
    JS最佳实践
    JSON之JS高级程序设计笔记
  • 原文地址:https://www.cnblogs.com/zhaoss/p/6407725.html
Copyright © 2011-2022 走看看