IE debugging page 7: Analyze Code Performance Using Probe tools (Windows)

The F12 developer tool provides a built-in script probe that you can use to analyze JavaScript running in Windows Internet Explorer 9CodePerformance. This topic describes the functions of the tool and how to use it to check the script performance.

Analysis script

To start the operation, open the page for analysis in Internet Explorer 9. In Internet Explorer 9, pressF12To open the F12 tool, and then click the probe tab.

The probe allows you to start and stop analysis, and provides views or reports on the number of functions and functions run and the time each function runs.

The grid is empty when you click the probe tab for the first time. Click the start analysis button and then run the code you want to analyze in the browser. If you want to start from the first page loading, click "refresh" to run the code on the page. When you need to stop collecting data and view the results, click Stop analysis ". To analyze only a specific part of the code, click Start analysis and only run the corresponding part of the code in the browser (for example, click a function called from a button ), click Stop analysis ".

View Analysis Report

When you click Stop analysis, the report is automatically generated from the probe tool. Each probe session is an independent report, so you can run an analysis of any number of times (for example, for multiple parts of the script), modify the value, and re-analyze the same part. By default, only the latest probe reports are displayed, but you can click the "current report" drop-down list to view other reports.

You can view the report in the function view or call Tree View. The "function" View displays all functions in the order they are run. The "call tree" view shows the hierarchy of functions, so that you can view the relationship between parent and subitem more easily.

Analysis Data Type

The probe can return up to 12 columns of data from the analysis. In the report, you can right-click the top of the column and then add or delete the column. The following table shows available data.

Column Title	displayed content
function	name of the function being analyzed.
count	the total number of calls to this function.
inclusion time (MS)	the duration of running in this function. This includes the time spent in subfunctions or external functions called from this function.
Percentage of time included	Percentage of running time in this function. This includes the time spent in subfunctions or external functions called from this function.
exclusion time (MS)	the duration of running in this function. Excluding the time spent in the subfunction or external function called by this function.
exclusion time percentage	Percentage of running time in this function. Excluding the time spent in the subfunction or external function called by this function.
Average time (millisecond)	Average time spent in this function, its subfunctions, and external functions.
maximum time (millisecond)	maximum time spent in this function, its subfunctions, and external functions.
minimum time (MS)	minimum time spent in this function, its subfunctions, and external functions.
function type	function type: Dom, user, and built-in.
URL	define the URL of the source file of this function.
row number	the row number starting with this function in Source Code .

Containing Time and exclusion time will show some signs of problems in the code. The include time provides the overall time for this function, any function called by it or its subfunctions. The exclusion time only shows the actual time spent in a specific function. It is possible that a function contains a very high time, but the exclusion time is very small. For example:

 
FunctionBar (){//Do some work for a 250 milliseconds}FunctionFoo (){//Do some work for 200 milliseconds and then call bar ()Bar ();}FunctionMain (){//Do some work for 50 milliseconds then call Foo ()Foo ();}
 

In this example, first call the "Main ()" function (working time is 50 milliseconds), then call "Foo ()" (200 milliseconds), and then call "bar () "(250 ms of work before completion ). The following chart shows the values that may contain time and exclusion time.

Function	Time included	Exclusion time
Main ()	500 ms	50 ms
Foo ()	450 ms	200 ms
Bar ()	250 ms	250 ms

The duration of each function is the time it takes to run the function and the time it takes to run the function (sub-function) after it. The exclusion time is only the time it takes to run the current function. The last function bar () in the function chain displays the same include time and exclusion time.

Search for reports and sort reports

You can use the "Search" box in the upper-right corner of the F12 tool to search for specific functions in the report. In the search box, type all or part of the name, and then click search or pressEnter. All instances with the search keyword are highlighted, and the report will scroll to the first match. By pressingEnterOrShift + enter, Or click "Next" or "last" to navigate between matching items.

When you search in the "call tree" view, all the parent functions above the matched functions are expanded.

Click the title of any visible column to sort by the data. Click the title again to switch between ascending and descending order. You can also right-click the data area on the probe tab, click Sort mode, and select the desired column.

In the "call tree" report view, only top-level function values are sorted. The subfunction retains its hierarchical order.

Copy and save reports

Select a row and pressCTRL + c, Or right-click and click Copy to copy all or part of the probe report. To select all rows, pressCTRL +, And then pressCTRL + c.

To export to a comma-separated (.csv) file, click the export icon (next to the start analysis button .) The export function saves all rows (including titles), while copying and pasting only contains the selected rows, not the title.