I would like to measure my application, which is very performance sensitive.

To do so I would like to know if there is an option in the Chrome dev tools or in something else to get a view like it's provided in the Network Tab, but with my own, JS triggered events in it (like the red / blue line).

Is there a way to do so?

I would like to measure my application, which is very performance sensitive.

To do so I would like to know if there is an option in the Chrome dev tools or in something else to get a view like it's provided in the Network Tab, but with my own, JS triggered events in it (like the red / blue line).

Is there a way to do so?

• javascript
• performance
• google-chrome
• google-chrome-devtools

Share Improve this question Follow asked Aug 7, 2013 at 18:54 Daniel SchmidtDaniel Schmidt 11.9k55 gold badges4242 silver badges7373 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 13

The obvious solution is to use Console. It gives you much more tools than simple console.log:

• Formatting (console.log("%cThis will be formatted with large, blue text", "color: blue; font-size: x-large");)

• Measuring time (console.time("Array initialize"); longRunningOperation(); console.timeEnd("Array initialize");)

_{(source: google.)}

• Grouping (console.group("Authenticating user '%s'", user); authentication(); console.groupEnd();)

_{(source: google.)}

• Marking events on the timeline (console.timeStamp("Adding result");)

_{(source: google.)}

This should be more than enough to create readable log of custom events. See the official docs for more tips on using the Console.