Server-Timing Header

Table of Content

• Syntax
• Directives
• Examples
• Browser Compatibility
• How to modify Server-Timing header

The Server-Timing header is an HTTP response header that provides a tool for servers to communicate performance metrics about the request-response cycle to the client. These metrics include durations of various server-timing events, and descriptions for those events. This transparency allows developers to use front-end tools to read server timing values for debugging, optimizing, and monitoring server performance.

Syntax

The syntax for Server-Timing header values is as follows:

Server-Timing: metric;desc="description";dur=123Copy

• metric is a keyword chosen by the developer and can be used to identify the specific timing.
• desc is a descriptor that provides a human-readable description of the metric.
• dur is the duration of the timing event in milliseconds.

Directives

The Server-Timing header consists of three directives:

• metric: The name of the performance metric used to differentiate measured events.
• desc: A description of the measured event for easier identification.
• dur: The duration of the event in milliseconds.

Examples

Consider the following example of the Server-Timing header.

Server-Timing: cacheFetch;desc="Cache Read";dur=23,
  appServer;desc="Application Server";dur=53,
  databases;desc="Database calls";dur=123Copy

This header is telling us that fetching from cache took 23ms, application server took 53ms, and database calls took 123ms.

Browser Compatibility

How to modify Server-Timing header

ModHeader is a Chrome Extension that can modify HTTP request and response headers. You can use it to add, modify, or remove Server-Timing headers for testing and debugging purposes.

1. Install ModHeader from the Chrome Web Store.
2. Click on the ModHeader icon on the toolbar.
3. In the Response headers section, enter 'Server-Timing' in the header name field.
4. Then, in the header value field, you can set values following the syntax mentioned above. You might add 'dbQuery;desc="Database Query";dur=40'.

Through this process, you could mimic various server timings and observe how your application behaves, allowing for fine-grained performance optimization and analysis.