Console. profile () function in JavaScript _ javascript tips-js tutorial

This article mainly introduces the console in JavaScript. the profile () function is described in detail. This article describes the console. browser support for profile () functions, console. use of profile (), use of Profile button in Firebug, etc. If you need to know the execution time of a code segment, you can use console. time (). However, when analyzing JavaScript programs with complicated logic and trying to find the performance bottleneck, console. time () is not applicable-the execution of JavaScript programs with complicated logic analysis means that a large number of consoles are inserted. time () Statement, which is undoubtedly unacceptable. The correct method for optimizing JavaScript programs with complex logic is to use console. profile ().

Browser support

Firefox, Google Chrome, and Safari with the Firebug plug-in installed support the console. profile () statement. The latest version of IE and Opera also provide the Profile function. The use of console. profile () on several browsers is similar. This article only introduces the use of console. profile () in Firebug. It is worth noting that if you use the Firebug console to directly write JavaScript experiment code, the console. profile () is invalid.

Use of console. profile ()

Console. profile () is easy to use: insert console. profile () Where you need to start profile, and insert console. profileEnd () where you want to end profile. The following code is used as an example:

The Code is as follows:

Function doTask (){
DoSubTaskA (1000 );
DoSubTaskA (100000 );
DoSubTaskB (10000 );
DoSubTaskC (1000,10000 );
}
Function doSubTaskA (count ){
For (var I = 0; I }

Function doSubTaskB (count ){
For (var I = 0; I }

Function doSubTaskC (countX, countY ){
For (var I = 0; I For (var j = 0; j }
}

Console. profile ();
DoTask ();
Console. profileEnd ();

Run the console before running the doTask () function. after the profile () and doTask () functions are run, execute console. profileEnd () to collect detailed information about the running process of the doTask () function. On the Firebug console, you can see:

The results show that the total profile time is 101.901 ms, involving 5 function calls. The default title of the result is "Profile", which can be customized by passing parameters to the console. profile () function. For example, you can use console. profile ("Test Profile") to change the profile title to "Test Profile" in the result, which is particularly useful when multiple profile processes are executed simultaneously. The column meanings in the specific profile result are as follows:

1. Function. Function name.
2. CILS. Number of calls. For example, in the preceding example, the doSubTaskA () function is executed twice.
3. Percent. Percentage of the time consumed by this function call in the total time.
4. Own Time. Aside from the time consumed by calling other functions, the time consumed by the function itself. For example, in the above example, doTask () is undoubtedly executed for a long time, but because it takes only a long time to call other functions, it consumes less time, only 0.097 ms.
5. Time. Unlike Own Time, the total Time consumed for computing functions is not considered due to calling factors of other functions. In the preceding example, the doTask () function executes 101.901 ms. For Time and Own Time, we can also draw a conclusion: if Time is greater than the value of Own Time, this function involves calling other functions.
6. Avg. Calculate the average total Time consumption of a function. The formula is Avg = Time/CILS. In the preceding example, the doSubTaskA () function is executed twice, and the total time consumed is 1.054 ms, so the average total time consumed is 0.527 ms.
7. Min. Minimum Time consumed for calling the function. For example, in the preceding example, the doSubTaskA () function is executed twice, and the minimum time consumption is 0.016 ms.
8. Max. The maximum time used to call the function. For example, in the preceding example, the doSubTaskA () function is executed twice, and the maximum time consumption is 1.038 ms.
9. File. The JS file where the function is located.

Use of the Profile button in Firebug

In addition to inserting the console. profile () statement into JavaScript code, Firebug also provides the Profile button to dynamically profile JavaScript code on the page in real time. The button is located:

You can press this button when profile is required. If any JavaScript code is triggered by the subsequent page operations, Firebug will record this. When the profile process ends, you only need to press this button again. The final result is consistent with that obtained by inserting the console. profile () statement.