How to calculate back-end and front-end times

A key component of the user’s page load experience includes how fast the server can dynamically generate or fetch the base document after a new page request. In mPulse, that timer value is called back-end time.

If the median value for back-end time is high, then you definitely know that you have a problem that impacts the customer experience. However, if the back-end time is good, there could still be other issues on the page, including server-side performance issues that are happening at other parts in the page load. The portion of the page load time that follows the back-end time is what mPulse calls front-end time. That timer includes all the remaining time to load the page, including fetching both static and dynamic assets on the page, delays processing Javascript or CSS, time to initialize plug-ins like Flash, and other browser-side delays until the onLoad event has fired.

Calculating back-end time

The value assigned to back-end time for a given beacon (page view) depends on whether the browser being used supports the W3C Navigation Timing standard. For browsers that support Navigation Timing, the value reported for back-end time is the time from navigationStart to responseStart. For legacy browsers that do not support the navigation timing standard, the value is the time from the onBeforeUnload event or the onClick event (whichever is later) to the OnUnload to OnPageHide event (whichever fires). If the page view is the first page in a session, and there are no onBeforeUnload or onUnload events to base a timing from, mPulse calculates an estimated value based on a statistical sample of all back-end times observed so far and the time it takes boomerang to load on the page. For more information on the browsers that support navigation timing, see the Navigation Timing API.

Calculating Front-End Time

Front-end time for a beacon is the time from the calculated back-end time to the end of the page load (when the onLoad event fires on the page.)

Have you ever looked at your front-end, back-end, and total page load time medians, and wondered why they do not add up?

The explanation is basic statistics. Medians cannot be compared across different data sets. In this case, the Total, FE, and BE timers are separate data sets, and the median for each is the middle point in each set independent of the other sets.

Example 1
  • Total = 1.17s
  • Back-End (BE) = 625ms
  • Front-End (FE) = 1.74s.

As a result, the FE + BE > Total.

Example 2

Assume a case with 5 beacons with the following times:

BE FE Total
1 300ms 900ms 1200ms
2 250ms *1000ms 1250ms
3 *275ms 800ms 1075ms
4 150ms 1050ms *1200ms
5 350ms 1100ms 1450ms
Median 275ms 1000ms 1000ms (BE + FE = 1275ms)
85pctl 300ms 1050ms 1250ms (BE + FE = 1350ms)
You have the following result:
  • For each beacon, the sum of BE and FE always add up to total.
  • For each timer, the middle element (median) across all beacons ends up being on a different beacon for each one of them.
  • For each timer, the 85th percentile (pctl) across all beacons ends up being on a different beacon for each one of them.