Giters

GoogleChromeLabs / feature-policy-demos

Feature Policy Kitchen Sink Demos

Home Page:https://feature-policy-demos.appspot.com/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Clarify unsized-media comments

danielcompton opened this issue · comments

commented

I was looking at the page for unsized-media and found it a little bit confusing.

Click the disallow/allow buttons above to see how the page loads with the policy on and off. When the policy is on, you won't see layout thrashing as large images load. Media without explicit sizes (either as HTML attributes ore defined in CSS) causes layout and text reflows as the page loads.

Could this be written more precisely as this?:

Click the disallow/allow buttons above to see how the page loads with the policy on and off. When the policy is on, you won't see layout thrashing as large images load. When the policy is off, media without explicit sizes (either as HTML attributes or defined in CSS) causes layout and text reflows as the page loads.

<!--
When both dimension are specified, unsized-media has no effect. The image will
be sized to the specified dimensions and no re-layout will occur.
-->
<img src="https://picsum.photos/1200/700/?random" width="100%" height="300">

Should the height on this picture be set to 700 instead of 300? It shows up as being distorted.

When no dimensions are specified (either via style attr, width/height attr, or class):
1. unsized-media on: image/video will have an intrinsic size. Causes re-layout.
2. unsized-media off: image/video will have a default size of 300x150. No re-layout.

When one dimension is specified (via a class, width="200", style="width:200px").
1. unsized-media off: image/video will be one of the specified dimension
   and the intrinsic ratio. Causes a re-layout.
2. unsized-media on: image/video will be one of the default dimensions (300x150)
   and the specified dimension. No re-layout.

When both dimension are specified, unsized-media has no effect. The image will
be sized to the specified dimensions and no re-layout will occur.

In the docs these two lists seem to contradict each other, I think the second list should have the off/on switched?

One of the goals of this page (I think?) is to show the distorting effect of this feature policy if you don't set width/height correctly. It could be good to explicitly call that out in the page, otherwise people may come away from looking at this page with the impression "unsized-media, that's the one that skews all my images".