Performance 工具 和 api 的优缺点

609 阅读2分钟

Performance 工具 优点:

  • 可视化图形界面
  • 每毫秒做的事情
  • 文件的执行加载的顺序
  • 每毫秒界面展示的效果
  • 每个方法执行的顺序和时间(由下至上)
  • 倒置的事件火焰图(由下至上)
  • 数据总结


Performance 工具

缺点:
  • 无法查看某一个区间之内的运行时间
  • 无法查看 js 堆的大小使用情况及限制
  • 无法查看页面是刷新还是加载,重定向次数
  • 无法查看什么时间开始做的性能测试
  • 可以在资源缓存已满的时候进行回调处理
  • 设置浏览器应在其性能条目缓冲区中保存的最大性能条目对象数

Performance api 优点:

  • 完全弥补了 Performance 工具 的缺点,还可以让我们通过数据的方式去知道具体的时间

Performance api 缺点:

  • 无法像 Performance 工具 那样图形化的去查看数据信息

大致的介绍了一下工具和api的优缺点,其实很明显的可以看出来,它们是相辅相成的,其实在一般的工具当中,我们会使用其中的某一个去进行性能的优化,但是对于一个想要进行真正的,彻底性的性能优化,还是需要两者之间的配合,去进行更高效、更系统、更全面的优化。
上下箭头,就是用来上传和下载每一次性能检测报告的;no recordings 就是每一次的检测报告,可以根据每一次的检测报告,去进行性能优化的对比;Screenshots 是用来查看在每个时间段界面的变化;Memory 存储调用栈的大小,在不同时间段的不同大小;
Disable Javascript samples 禁用 javascript 调用栈,在后面讲解 Main 部分进行详解;Enable advanced paint instrumentation (slow) 记录渲染事件的细节;Network 用来修改检测在不同的网络环境下,界面的渲染;CPU 用来查看电脑的性能问题;