From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- files/zh-cn/tools/performance/index.html | 91 ++++++++++++++++++++++++++++++++ 1 file changed, 91 insertions(+) create mode 100644 files/zh-cn/tools/performance/index.html (limited to 'files/zh-cn/tools/performance/index.html') diff --git a/files/zh-cn/tools/performance/index.html b/files/zh-cn/tools/performance/index.html new file mode 100644 index 0000000000..9c51584f00 --- /dev/null +++ b/files/zh-cn/tools/performance/index.html @@ -0,0 +1,91 @@ +--- +title: 性能 +slug: Tools/Performance +translation_of: Tools/Performance +--- +
{{ToolsSidebar}}

性能工具让你深入了解你的网站的一般响应性,JavaScript和布局性能。利用性能工具你可以创建你的网站在一段时间内的一个记录,或资料。然后此工具在资料里将浏览器渲染你的网站时所做的事情,和帧率图展示给你。

+ +

你有三个子工具来详细检查资料:

+ + + +

{{EmbedYouTube("WBmttwfA_k8")}}

+ +
+

开始使用

+ +
+
+
+
界面之旅
+
+

要了解使用性能工具的方法,这是一个快速的界面指导。

+
+
+
+ +
+
+
如何工作
+
基本任务:打开工具,创建,保存,载入,并配置记录。
+
+
+
+ +
+

性能工具的组件

+ +
+
+
+
帧频(刷新率)
+
了解你网站的整体响应能力。
+
调用树
+
找到你网站上JavaScript的瓶颈。
+
+
+ +
+
+
瀑布流
+
了解当用户与站点进行交互时浏览器的工作。
+
火焰图
+
看看在记录的过程中,哪些JavaScript函数执行。
+
 
+
+
+
+ +
+

场景

+ +
+
+
+
驱动CSS属性
+
采用瀑布流了解浏览器如何更新一个页面,以及如何驱动不同的CSS属性来影响性能。
+
 
+
+
+ +
+
+
密集JavaScript
+
使用帧频和瀑布流工具来突出长期运行Javascript引起的性能问题,以及在这种状况下如何使用工作的代码可以造成有效帮助。
+
+
+
+ +

 

+ +
+
+
 
+
+
+ +

 

-- cgit v1.2.3-54-g00ecf