Performance Measurement Using jQuery.sap.measure

You can use jQuery.sap.measure to measure the performance of your JavaScript code.

For each measurement, the result is a time and a duration. The time are the milliseconds (ms) from starting the measurement till its end. The duration is the effective milliseconds, pause phases are not counted here.

You can measure the categories that are used by the SAPUI5 core classes as listed in the following table:

Category	Description
`javascript` (default)	Default measurement category if no category is provided
`require`	Identifies the duration of `jQuery.sap.require` for lazy loading of JavaScipt classes including the loading and parsing times for a class
`xmlhttprequest`	Identifies the duration of an `jQuery.ajax` call
`render`	Used for all rendering-related measurements that trigger core rendering of controls within the `RenderManager` class With the `render` category there comes an additional set of categories to distinguish between different phases of rendering
`control`	Identifies the duration for HTML rendering provided with the `ControlRender.render` method
`after`	Identifies the duration for calls on the control's `onAfterRendering` method
`preserve`	Identifies the duration needed to find out whether rendering can be preserved

Procedure

1. Activate performance measurement

By default, jQuery.sap.measure is disabled to avoid unnecessary code execution during runtime. Therefore, you first have to activate the measurement using one of the following options:

Use URL Parameter sap-ui-measure=true to measure an initial request.
Activate measurement in the browser's console by calling jQuery.sap.measure.setActive(true)

Create a measurement in your code with:

jQuery.sap.measure.setActive(true);
jQuery.sap.measure.start("myId","Measurement of myId");
jQuery.sap.log.info("foo");
jQuery.sap.measure.end("myId");

You can use methods as listed in the following table:

Action	Method
Start measurement	`jQuery.sap.measure.start(sId,sInfo,[categories])`
End measurement	`jQuery.sap.measure.end(sId)`
Pause	`jQuery.sap.measure.pause(sId)`
Resume	`jQuery.sap.measure.resume(sId)`

To activate measurement for certain categories only, you have the following options:

Provide a URL Parameter with categories sap-ui-measure=category1,category2
Add the category as parameter to the call of the jQuery.sap.measure.setActive as in the following example:
```
// Measure only "require" category
jQuery.sap.measure.setActive(true,"require")
```
To assign a measurement to a specific category, just add the category to the start function.
```
jQuery.sap.measure.start("myId","Measurement of myId", ["foo"]);
```
Note
If you also use the start or average method, make sure that the same categories are passed on, otherwise no measurement is started.

2. Retrieve the results

You can retrieve the results via API with one of the following commands:

Command	Returns
`jQuery.sap.measure.getAllMeasurements()`	Array of all measures (running and completed)
`jQuery.sap.measure.getAllMeasurements(true)`	Array of completed measures
`jQuery.sap.measure.getAllMeasurements(false)`	Array of running (not completed) measures
`jQuery.sap.measure.getMeasurement(string)`	One specific measurement by ID
`jQuery.sap.measure.filterMeasurements(func)`	Array of all measures based on the result of the filter function (running and completed)
`jQuery.sap.measure.filterMeasurements(func, true)`	Array of completed measures based on the result of the filter function
`jQuery.sap.measure.filterMeasurements(func, false)`	Array of running measures based on the result of the filter function

In Google Chrome, for example, you can also display the results in a table in the console by using:

console.table(jQuery.sap.measure.getAllMeasurements(true)) //table with completed measurements

3. Interpret the results

Each entry in the resulting array provides an object of the following structure:

id: string

The unique ID of the measurement as provided in the start or average method
info: string

Additional information as provided in the start or average method
duration: float

Duration or average duration in ms
count: int

Number of calls counted of an average
average: boolean

Indicates whether the result is an average
categories: string[]

Categories as provided in the start or average method

4. Clear results

To clear all measurements call the jQuery.sap.measure.clear method.

Specific Use Cases

Averages

For repeatedly occurring operations, you can calculate an average duration with the jQuery.sap.measure.average method.

jQuery.sap.measure.setActive(true);
for (var i=0;i<1000;i++) {
    jQuery.sap.measure.average("myId","Average of myId");
    jQuery.sap.log.info("Foo " + i);
    jQuery.sap.measure.end("myId");
}

Based on the ID, all measurement calls are counted and the average duration is calculated and provided in the result, together with the complete duration and the number of calls:

jQuery.sap.log.info("1000 calls: " +jQuery.sap.measure.getMeasurement("myId").count === 1000); //true
jQuery.sap.log.info("Average time: " + jQuery.sap.measure.getMeasurement("myId").duration);

Measurement of Object Methods

You can register an average measurement without changing the original source code. For this, you use the following APIs:

jQuery.sap.measure.registerMethod
jQuery.sap.measure.unregisterMethod
jQuery.sap.measure.unregisterAllMethods

To measure the average time a method of an instance, you can use the following example code:

jQuery.sap.require("sap.m.Button");
var oButton = new sap.m.Button();
jQuery.sap.measure.registerMethod("oButton.setText", oButton, "setText", ["instance"]); //register to oButton instance on method setText
jQuery.sap.measure.setActive(true,["instance"]); //measure only category "instance"
for (var i=0;i<1000;i++) {
    oButton.setText("MyButton" + i);
}
 
jQuery.sap.measure.unregisterMethod(oButton, "setText");
// or jQuery.sap.measure.unregisterAllMethods();

jQuery.sap.measure.getAllMeasurements();

To measure the average time a method of a class, you can use the following example code:

jQuery.sap.require("sap.m.Button");
jQuery.sap.measure.registerMethod("oButton.setText", sap.m.Button.prototype, "setText",["class"]); //register to sap.m.Button class on method setText
jQuery.sap.measure.setActive(true,["class"]); //measure only category "class"
for (var i=0;i<1000;i++) {
    var oButton = new sap.m.Button();
    oButton.setText("MyButton" + i);
}
 
jQuery.sap.measure.unregisterMethod(oButton, "setText");
//or jQuery.sap.measure.unregisterAllMethods();
 
jQuery.sap.measure.getAllMeasurements();

Filtering

You can also use the categories listed above as filters for the result list or to define measurements for one or more specific categories with the filterMeasurements method.

To filter the categories that are measured, you use, for example:

// Filter for category1
jQuery.sap.measure.filterMeasurements(function(oMeasurement) {
    return oMeasurement.categories.indexOf("category1") > -1;
});

To filter the results, you can use a code like this:

// Filter for duration > 500ms
jQuery.sap.measure.filterMeasurements(function(oMeasurement) {
    return oMeasurement.duration > 500;
});