Change Viewport-Width from CSS pixels to physical pixels

[yoavweiss]

As pointed out by @foolip on the blink-dev thread, it makes sense to also define Viewport-Width with physical pixel units.

That would help to avoid confusion around pixel units of the different CH headers, as well as benefit Viewport-Width based resource cacheability, in the same way moving to physical pixels benefits Width.

[igrigorik]

I was thinking about this when I was updating Width and opted to keep it as CSS px...

Viewport-Width communicates the size of the layout viewport, which is in CSS px and has nothing to do with pixel density of the device - e.g. a 320px layout viewport on 1x device is same 320px on a 2x device.

So, for example, if you want to customize the CSS stylesheet based on advertised Viewport-Width value, then to reduce cache fragmentation you want the CSS px value, not the physical value -- with physical px value you'd end up with multiple variants of the same stylesheet for each DPR (320, 640, ...); it's the opposite problem of previous Width definition.

Does that seem reasonable / am I overlooking anything here? /cc @foolip

[yoavweiss]

I guess the main question is "what would be the primary use case for Viewport-Width?" If the answer is CSS, JS (and perhaps later HTML, if we add CH on navigational requests), then yes, CSS px would be a better option. If the answer is images (where sizes/width is missing for various reasons), then physical px would be better.

Without data and/or crystal ball, I could be convinced either way. Since images already have Width, maybe it's better to prefer other resource types when making this decision. @foolip?

[igrigorik]

Using Viewport-Width for images that don't have a sizes / width is plausible but is highly likely to run into edge cases -- e.g. you can use the value as a ceiling on resource width but that would still yield a lot of unnecessary pixels; there are cases where enforcing the ceiling would not be appropriate either.

As such, I don't consider images to be the primary use case for Viewport-Width. To get the best results for images, you should specify sizes/width on your images, which will result in delivery of Width.

[foolip]

The link to the blink-dev thread is https://groups.google.com/a/chromium.org/d/msg/blink-dev/0OhfDfnkhH0/h0tZwJZiAAAJ

[foolip]

Yeah, it does sound like different units for Width and Viewport-Width would lead to fewer cache misses.