Creating custom components in Transaction Perspective

In addition to the standard Keynote measurement components, such as DNS Time, you can create custom components. Custom components provide special ways to measure and track aspects of your site that meet your specific needs. Custom components can be visualized in MyKeynote graphs just like the standard measurement components, and can be used to trigger alarms.

Custom components can be created using the UI in the KITE, as well as with custom scripting. This help topic explains the use of the KITE UI to create Custom Components.

The KITE UI makes it easy to create custom components based on:

  • The time difference (delta) between two page elements.
  • Response header value - a value extracted from response header can be used to create a custom component, or for a special object trending component.
  • Virtual actions - values derived from virtual actions can be used to create a custom component.

Values in custom components are reported on the page (action) level. One of the three custom components in a measurement can be “rolled up” to the transaction level.

Adding a custom component

To add a custom component:

  1. Select the Action you want the component to be added to.
  2. Right-click the component name and select Add Custom Components from the context-sensitive menu.
    Add custom component<figcaption><p>Add custom component</p>

</figcaption></figure>

  1. In the Script Properties panel, select the type of custom component, Header Value (the default) or Elements Delta. These are described below.
    Custom component type<figcaption><p>Custom component type</p>

</figcaption></figure>

  1. Select detailed options for the component.

Response header value

This type of custom component extracts and stores the specified HTTP header value for each downloaded element. If the data is numerical, it can be aggregated (as sum, geometric mean, arithmetic mean, minimum, and maximum) on a page or transaction level.

Non-numeric data derived from the response header should be directed to an object trending field instead of one of the three custom component fields. Numeric data can be stored in a custom component or an object trending field.

To set up a response header custom component, specify the header value name. You can use Regular Expression to specify the name. Information about regular expression syntax can be found here.

Example

The custom component setting below extracts the name of the server from the response headers of page objects and posts them to the object trending column.

Custom component based on response header

Custom component based on response header

The Performance Details window shows the resulting values.

Response header object trending example

Response header object trending example

Elements delta: time between two elements

This type of custom component is created by specifying two page elements. The component reports the time difference (delta) between the download of the two elements.

How the delta between two elements is defined

You can define how the time delta between the objects is determined:

  • Second Start - First Start - Time from start of first element download to start of last element download.
  • Second Start - First End - Time from end of first element download to start of last element download.
  • Second End - First End - Time from end of first element download to end of last element download.
  • Second End - First Start - Time from start of first element download to end of last element download.
Time diagram for custom components

Time diagram for custom components

Elements are selected using regular expressions. There are two ways of using RegEx to define the elements:

  • Matching RegEx Delta - One regular expression is used that can define both elements you are interested in.
  • Two Elements - Two regular expressions are defined, one for each element.
Matching reg ex

Matching reg ex

The time delta between the elements is calculated and set as a custom component.

The custom component can be based on the full URL of an element, or on the domain, path, or object identifier.

Example

In the example below, the two page elements used are stmenu.js and bg_headerNave.jpg , and the time difference between the start of two page elements is captured as Custom Component 1.

Two elements delta example

Two elements delta example

Virtual action filter stored in custom component

This feature allows an aggregated value from Virtual Action Filter to be stored as custom component. See Virtual Actions for more information.

Automatic roll-up of page components

This feature allows custom components to be rolled-up from page level to transaction/summary level as it is done for regular components. The roll-up is a sum of each page’s custom component.

There is only one custom component on transaction/summary level, so only one of the page’s custom components can be rolled-up.

Time to full screen component

Time to full screen is a special Custom Component that indicates the time for a page to appear by showing when a specified page element begins to download. This component can be added using the KITE UI, or through advanced scripting.

To measure Time to Full Screen, add a Custom Component to an existing script action by right clicking the action and selecting Add Custom Components.

Next, select the Header Value for the Custom Componet and change the Custom Component Name to Time to Full Screen.

Time to full screen

Time to full screen

In the Options for the Time to Full Screen component, add a regex specification for an object on the page. Time to Full Screen reports how long it takes for this object to start to download.

Time to full screen

Time to full screen

The Time to Full Screen is reported as a page level component on the Transaction Performance Summary when the script is run.

Time to full screen

Time to full screen