Share via

How to profile JavaScript code in Windows Store apps on a local machine

  • Article

The Visual Studio profiling tools for JavaScript let you measure, evaluate, and target performance-related issues in your code. The profiler collects timing information at the entrance and exit of each function in your app. Profiling report views display graphical and tabular representations of detailed, context-rich information about the performance of your app and help you navigate through the execution paths of your code and the execution cost of your functions to find the best opportunities for optimization. You can profile the entire execution run of your app, or you can suspend and resume profiling to collect data only for specific scenarios.

This topic describes how to profile JavaScript code in Windows apps on a local machine by using the Visual Studio IDE.

In this topic

Here’s what you can learn:

Quick start: the easy way to profile

Configure the project debug properties settings

Profile the app

  • Collect performance data for C#/VB/C++ components

  • Collect performance data for the entire profiling run

  • Collect performance data for specific scenarios

Quick start: the easy way to profile

In many cases, you can collect profiling data for an app in four steps.

However, the Visual Studio profiler does use the debug settings of the project to configure deployment of the app on the local machine. If you have changed any of the standard debug settings of your project, you should first make sure that the settings are compatible with profiling. See Configure the project debug properties settings in this topic for more information.

Four-step profiling

  1. Select the local machine as your deployment target. Choose Local Machine from the drop-down list next to the Start Debugging button on the Visual Studio Standard toolbar.

    Run on Local Machine

  2. Start the profiler. Choose Start Performance Analysis (Keyboard: ALT + F2 to start your app and start profiling immediately.

  3. Exercise the app. Run those parts of the application that you want to profile. Repeat key scenarios to get more accurate results.

  4. Stop profiling. In the profiling document window, choose Stop profiling (Keyboard: CTRL + ALT + F2). The profiler analyzes the data and displays the Summary view of the profiling data.

When you stop the profiling run, the profiler analyzes the data and displays the Summary view of the profiling data in a document window of the IDE. See Analyzing JavaScript performance data in Windows Store apps.

Configure the project debug properties settings

  1. On the Debug menu, choose Project Properties.

  2. Choose Debugging in the Configuration Properties node.

    Debug properties

  3. Use the following table to configure the settings to appropriate values:

    Option

    Value

    Debugger to launch

    Set to Local Machine.

    Launch Application

    Set to Yes

    Allow Local Network Loopback

    This setting has no affect on profiling.

    Debugger Type

    • Set to Script only to profile JavaScript.

    • Set to any other value to profile C#/VB/C++ components of the JavaScript app.

Profile the app

You can collect profiling data for the entire run, or you can collect data only for specific scenarios. You can also collect profiling data for C#/VB/C++ components of the JavaScript app.

Stop Profiling

Hh696637.collapse_all(en-us,VS.110).gifCollect performance data for C#/VB/C++ components

To collect performance data for C#/VB/C++ components of a JavaScript app, choose any item except Script Only in the Debugger Type list on the Debugging property page of the JavaScript project. See Configure the project debug properties settings in this topic.

You can then collect performance data for the entire profiling run or you can collect profiling data for specific scenarios as described below.

To analyze C#/VB/C++ performance data, see Analyzing performance data for Visual C++, Visual C#, and Visual Basic code in Windows Store apps

Note

JavaScript performance data is not collected when you choose this option.

Hh696637.collapse_all(en-us,VS.110).gifCollect performance data for the entire profiling run

Note

This procedure is basically the same as Quick start: the easy way to profile.

To profile your app from the start to the end, do this:

  1. Start the profiler. Choose Start Performance Analysis (Keyboard: ALT + F2) to start your app and start profiling immediately.

  2. Exercise the app. Run those parts of the application that you want to profile. Repeat key scenarios to get more accurate results.

  3. Stop profiling. In the profiling document window, choose Stop profiling (Keyboard: CTRL + ALT + F2). The profiler analyzes the data and displays the Summary view of the profiling data.

Hh696637.collapse_all(en-us,VS.110).gifCollect performance data for specific scenarios

To profile a specific scenario in your app, do this:

  1. Start the profiler. Choose Start Performance Analysis Paused (Keyboard: CTRL + ALT + F2) to start your app with profiling suspended.

  2. Resume and suspend profiling. Just before you begin the scenario that you are interested in, choose Resume profiling in the profiling document window. Exercise the scenario, and then choose Pause profiling to suspend data collection. You can suspend and resume profiling as often as you choose.

  3. Repeat key scenarios to get more accurate results.

  4. Stop profiling. In the profiling document window, choose Stop profiling (Keyboard: CTRL + ALT + F2).

When you stop the profiling run, the profiler analyzes the data and displays the Summary view of the profiling data in a document window of the IDE. See Analyzing JavaScript performance data in Windows Store apps.

See Also

Concepts

Analyzing the performance of Windows Store apps

Analyzing JavaScript performance data in Windows Store apps