JavaScript – Developer Tools

In order to measure performance and profile the JavaScript code contained in this book, we will use Google Chrome's built-in developer tools. Specifically, Chrome includes a timeline recorder and JavaScript CPU profiler that will allow you to identify bottlenecks in your JavaScript code. To activate these tools, please click on the three dots in the upper-right corner of the browser and click on the Developer Tools entry in the More Tools submenu, as shown:

Finding the ‘Developer Tools’ entry in the ‘More Tools’ section of Chrome’s main menu

Using the profiler is as easy as clicking the Record button and refreshing the page you wish to profile. You can then analyze the results in order to identify potential problems with the code:

Chrome’s timeline recorder and JavaScript CPU profiler

In Chapter 7, JavaScript and "Danger Driven Development", and Chapter 8, Functional JavaScript, we will be using this tool more extensively in order to measure and optimize JavaScript code performance in general.