| Component name | dynamic_range |
|---|---|
| In the visitorId | yes |
| structuredId group | prefs (display and accessibility preferences) |
| Hashing | plain value; a digest only when longer than 128 characters or not printable ASCII |
| Excluded under | no browser class |
| Inner timeout | 1000 ms |
| Added in | signalsVersion 1 |
Some screens can show much brighter highlights and deeper shadows than others; this is called high dynamic range, or HDR. Browsers let pages ask whether the current screen supports it. WhiskerJS records the answer, high or standard.
What it reads
The CSS dynamic-range media feature through window.matchMedia().
How the technique works
| Order | Query | Value reported |
|---|---|---|
| 1 | (dynamic-range: high) |
high |
| 2 | (dynamic-range: standard) |
standard |
The first match is reported. An HDR display matches both, so high is asked first. If neither matches, the component is unavailable with no_match.
Why it helps
It separates HDR-capable setups (many recent phones and laptops, some monitors with HDR turned on) from the rest. Two values make it a weak signal alone, but it is cheap and rarely changes.
On your server, read it together with the other four preference components. They share the prefs part of the structuredId, so a result where only that part moved usually means a display or accessibility setting changed, not a different device. See Comparing two results.
Stability
Stable for a given display and setting. It changes with the monitor the window is on and, on systems where HDR is an operating system switch, with that switch.
On laptops that can drive an external HDR monitor, the value can differ between the built-in screen and the external one. If you see dynamic_range flip together with color_gamut while everything else holds, a monitor change is the likely cause.
Browser support and what blocks it
Current Chromium browsers (Chrome, Edge), Safari and iOS browsers answer it; browser versions that do not know the feature report no_match. Check Firefox results on your own traffic. No browser class excludes it.
Privacy
A display capability, not a personal preference. Shared by everyone with the same kind of screen and setting.
How WhiskerJS handles noise and failures
| Status | ruleId | When |
|---|---|---|
ok |
high or standard |
|
unavailable |
no_api |
no matchMedia |
unavailable |
no_match |
neither query matched |
blocked |
threw, security_error |
matchMedia throws |
excluded |
caller_excluded |
you excluded it |
timed_out |
timeout, aborted |
budget or abort |
Example value
All three headless test browsers in the container (Chromium, Firefox, WebKit) reported standard.
Questions and answers
Does high mean HDR is switched on?
It means the browser reports that the current display can show high dynamic range. On some systems that depends on an HDR setting in the operating system, so switching it changes the value.
Why only two values?
The dynamic-range media feature only defines high and standard. WhiskerJS asks high first, then standard.