原文链接：https://developers.google.com...
相干文章：https://github.com/hewq/blog/...
Disable JavaScript Samples
- 默认状况下，Main 局部会具体记录 JavaScript 的调用堆栈，应用 Disable JavaScript Samples 能够暗藏这些调用。像一些自定义的函数调用会被暗藏。下图为暗藏前和暗藏后的比拟
查看主线程
- Main 局部记录了主线程的流动点击其中一个事件，在 Summary 面板中查看更具体的信息
DevTools 用火焰图示意主线程的流动。x 轴示意随工夫的记录，y 轴示意调用的事件。下层的事件调用（触发）了上层的事件（anonymous代表匿名函数）
Call Tree
- 应用 Call Tree 来查看哪个根事件破费的工夫最多。Call Tree 只显示选中局部的记录。
- Self Time 示意间接破费在该事件上的工夫，Total Time 示意破费在该事件及其所有后辈（子孙）事件的总工夫。
- 默认状况下，分组菜单设置为无分组，应用分组菜单能够依据各种规范对流动表进行排序。
- 点击 Show Heaviest Stack
会显示所选事件中哪些子事件执行工夫最长。
Bottom-Up
- 应用 Bottom-Up 能够查看哪些流动在总体上占用了最多的工夫。Bottom-Up 只显示选中局部的记录。
在上图的火焰图中能够看出简直所有的工夫都花在三个对wait的调用上，所以 Bottom-Up 中，最顶部的是wait；wait调用上面的黄色局部其实是数以千计的 GC（垃圾回收） 调用，所以下一个开销最大的是Minor GC。
- Self Time 示意间接破费在该事件上的工夫，Total Time 示意破费在该事件及其所有后辈（子孙）事件的总工夫。
Event Log
- 应用 Event Log 能够按工夫程序查看事件的执行
- Start Time 示意绝对于记录的开始工夫，例如图中的
1573.0ms示意该事件在记录开始后的 1573 毫秒后被执行。 - Self Time 示意间接破费在该事件上的工夫，Total Time 示意破费在该事件及其所有后辈（子孙）事件的总工夫。
Interactions
- 应用 Interactions 来剖析记录过程中产生的用户交互。底部的红线示意期待主线程所破费的工夫。
Memory
- 启用 Memory 能够查看记录过程中的内存应用状况。
Enable advanced paint instrumentation
- 启用 Enable advanced paint instrumentation，在 Main 中点击 Paint，Paint Profiler 面板会显示无关绘制事件的高级信息
原文链接：https://developers.google.com/web/tools/chrome-devtools/evaluate-performance/reference?hl=zh-cn
相干文章：https://github.com/hewq/blog/blob/master/devtools/performance_start.md
Disable JavaScript Samples
- 默认状况下，Main 局部会具体记录 JavaScript 的调用堆栈，应用 Disable JavaScript Samples 能够暗藏这些调用。像一些自定义的函数调用会被暗藏。下图为暗藏前和暗藏后的比拟
查看主线程
- Main 局部记录了主线程的流动点击其中一个事件，在 Summary 面板中查看更具体的信息
DevTools 用火焰图示意主线程的流动。x 轴示意随工夫的记录，y 轴示意调用的事件。下层的事件调用（触发）了上层的事件（anonymous代表匿名函数）
Call Tree
- 应用 Call Tree 来查看哪个根事件破费的工夫最多。Call Tree 只显示选中局部的记录。
- Self Time 示意间接破费在该事件上的工夫，Total Time 示意破费在该事件及其所有后辈（子孙）事件的总工夫。
- 默认状况下，分组菜单设置为无分组，应用分组菜单能够依据各种规范对流动表进行排序。
- 点击 Show Heaviest Stack
会显示所选事件中哪些子事件执行工夫最长。
Bottom-Up
- 应用 Bottom-Up 能够查看哪些流动在总体上占用了最多的工夫。Bottom-Up 只显示选中局部的记录。
在上图的火焰图中能够看出简直所有的工夫都花在三个对wait的调用上，所以 Bottom-Up 中，最顶部的是wait；wait调用上面的黄色局部其实是数以千计的 GC（垃圾回收） 调用，所以下一个开销最大的是Minor GC。 - Self Time 示意间接破费在该事件上的工夫，Total Time 示意破费在该事件及其所有后辈（子孙）事件的总工夫。
Event Log
- 应用 Event Log 能够按工夫程序查看事件的执行
- Start Time 示意绝对于记录的开始工夫，例如图中的
1573.0ms示意该事件在记录开始后的 1573 毫秒后被执行。 - Self Time 示意间接破费在该事件上的工夫，Total Time 示意破费在该事件及其所有后辈（子孙）事件的总工夫。
Interactions
- 应用 Interactions 来剖析记录过程中产生的用户交互。底部的红线示意期待主线程所破费的工夫。
Memory
- 启用 Memory 能够查看记录过程中的内存应用状况。
Enable advanced paint instrumentation
- 启用 Enable advanced paint instrumentation，在 Main 中点击 Paint，Paint Profiler 面板会显示无关绘制事件的高级信息
帮忙文档
快捷键
目录
题目
文本款式
列表
链接
代码片
表格
注脚
正文
自定义列表
LaTeX 数学公式
插入甘特图
插入UML图
插入Mermaid流程图
插入Flowchart流程图
插入类图
快捷键
Markdown
图标
快捷键
撤销
Ctrl /⌘+Z
重做
Ctrl /⌘+Y
加粗
Ctrl /⌘+B
斜体
Ctrl /⌘+I
题目
Ctrl /⌘+Shift +H
有序列表
Ctrl /⌘+Shift +O
无序列表
Ctrl /⌘+Shift +U
待办列表
Ctrl /⌘+Shift +C
插入代码
Ctrl /⌘+Shift +K
插入链接
Ctrl /⌘+Shift +L
插入图片
Ctrl /⌘+Shift +G
查找
Ctrl /⌘+F
替换
Ctrl /⌘+G
Disable JavaScript Samples
查看主线程
Call Tree
Bottom-Up
Event Log
Interactions
Memory
Enable advanced paint instrumentation
Markdown 已选中 3126 字数 51 行数 以后行 51, 当前列 0
HTML 1188 字数 27 段落