Device Information

Screen size is not window size

Three different measurements get confused constantly, and mixing them up produces layout bugs that only appear on other people's machines. Screen resolution is the physical panel: it does not change when you resize anything. The available screen area subtracts space permanently claimed by the operating system, such as a taskbar or a macOS menu bar. The viewport is the part of the window your page can actually draw into, and it is the only one of the three that CSS media queries respond to.

If you are debugging a responsive layout, the viewport is almost always the number you want. A user on a 3840-pixel monitor may still be reading your site in a 700-pixel window, and a media query written against screen width will happily give them the desktop layout in a space that cannot hold it.

The device pixel ratio ties the two worlds together. A ratio of 2 means every CSS pixel is painted with a 2x2 block of physical pixels, which is why images that look crisp on an old monitor look soft on a modern laptop. Multiply the viewport by the pixel ratio to get the real number of pixels a raster image needs to fill the space.

The user agent string lies, and that is deliberate

The user agent is the least trustworthy field on this page. Every major browser has spent decades adding other browsers' names to its own string to get past badly written server checks, which is why a current Chrome build still announces Mozilla, AppleWebKit, KHTML, Gecko and Safari all at once. Browsers are now actively freezing and reducing the string to limit fingerprinting.

Treat it as a hint, never as a decision. If you need to know whether a feature exists, test for the feature. Checking whether an API is present takes one line, works on browsers that did not exist when you wrote the code, and does not break when a vendor rewrites its user agent.

What these values reveal about you

Individually, none of these fields identifies anyone. Combined, they are surprisingly distinctive. Screen resolution, time zone, language list, CPU core count and pixel ratio together form a fingerprint that is often unique across millions of visitors, which is exactly why trackers collect them.

That is also why several fields deliberately return blurred or missing values. Device memory is rounded down to a coarse bucket. Some browsers cap the reported core count, refuse to expose memory at all, or return a generic platform string. Do Not Track has effectively been abandoned: almost nothing honours it, and most browsers no longer send it, so an empty value here means nothing either way.

The practical takeaway for building software is to collect the minimum you actually need. If you want to decide whether to load a heavy animation, measure how fast the first frame renders rather than guessing from core counts. Real measurement beats inferred hardware specs, and it does not add to the fingerprint surface.