From b405895d15e4ad33f3cf03c19fab7184b7d6dc48 Mon Sep 17 00:00:00 2001 From: Prasad Seth Date: Wed, 21 Nov 2018 01:05:24 +0530 Subject: [PATCH 1/2] added example 6 Performance tool --- index.html | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/index.html b/index.html index e3e3f92..0784400 100644 --- a/index.html +++ b/index.html @@ -176,6 +176,19 @@

Example 5 - Responsive Design Mode

+ +
+
+

Example 6 - Performance Tool

+
+
+

+ In the example 6 we will learn about the Performance tool. This tool gives you insight into your site's general responsiveness, JavaScript and layout performance. With the Performance tool you create a recording, or profile, of your site over a period of time. The tool then shows you an overview of the things the browser was doing to render your site over the profile, and a graph of the frame rate over the profile. +

+
+
+
+
From ce931c6d628efbe04de5a09c716d658ee7e1539c Mon Sep 17 00:00:00 2001 From: Prasad Seth Date: Wed, 21 Nov 2018 01:07:59 +0530 Subject: [PATCH 2/2] created a new example 6 performance tool --- examples/example6_performance.html | 34 ++++++++++++++++++++++++++++++ 1 file changed, 34 insertions(+) create mode 100644 examples/example6_performance.html diff --git a/examples/example6_performance.html b/examples/example6_performance.html new file mode 100644 index 0000000..a6ee9dc --- /dev/null +++ b/examples/example6_performance.html @@ -0,0 +1,34 @@ + + + + + + + + Example 6 - Performance Tool + + + + +

Example 6 - Performance Tool

+

+ The Performance tool gives you insight into your site's general responsiveness, JavaScript and layout performance. With the Performance tool you create a recording, or profile, of your site over a period of time. The tool then shows you an overview of the things the browser was doing to render your site over the profile, and a graph of the frame rate over the profile. +

+

+ There are a few different ways to open the Performanace tool: +

+
    +
  • press Shift + F5
    • +
  • select "Performance" from the Web Developer submenu in the Firefox Menu (or Tools menu if you display the menu bar or are on OS X)
    • +
  • select "Performance" from Tools button, in the Toolbar, if you have one
    • +
+ +

+ You can learn more about the Network Monitor in this MDN article. +

+ +