Feature Policy: lazyload

[ehsan-karamad]

Proposing a new feature policy for lazy-loading which will overwrite the default or specified behavior of lazyload attribute for <iframe> and <img>. The proposed name for the feature is lazyload.

The lazyload attribute (for an <iframe> or <img>) takes on three values of auto (decision of lazy-loading is deferred to the user agent), on (the contents will be loaded lazily), off (the contents will not be loaded lazily).

The proposed lazyload feature is a parameterized feature which takes one of the three values of:

• auto: the default behavior of lazyload attribute is not altered (user agent decides) .

• off: the default behavior of lazyload is set to off. For example, if the site www.example.com sets its header policy to Feature Policy: lazyload 'self'(off), then

  <iframe src="https://www.example.com/a" lazyload="on"></iframe>

  will still load the contents lazily due to the defined attributes, but

  <iframe src="https://www.example.com/b"></iframe>

  will not load the contents lazily since the feature is set to off by default.

• force: ignores the value of lazyload attribute and enforces it to on for all <iframe> and <img> . For example, if a site sets its header policy to Feature Policy: lazyload *(force) then all <iframe>'s and <img>'s from all domains will be loaded lazily. For example in

  <iframe src="http://www.example.com/" lazyload="off"></iframe>

  the provided attributed is ignored and the contents will be loaded lazily due to policy enforcement. Also, since the lazyload attribute setting is in violation of the lazyload feature, such a usage may trigger a violation error.

The feature can also be set through container policies, for instance:

<iframe allow="lazyload *(force)" src="https://www.example.com" lazyload="off"></iframe>

which will enforce lazy loading for all domains. This would include https://www.example.com.

[Malvoz]

Just to clarify, I believe you missed the single quotes for the self and none values. And I would assume we set (auto|off|force) flags outside the single quotes? e.g. Feature Policy: lazyload 'self'(force) and the all (*) directive like so: Feature Policy: lazyload *(force).

[ehsan-karamad]

Thanks you are right. I fixed the missing single quotes for self.

[alvarotrigo]

Any way to detect whether the browser supports this feature or not? So we can use other lazy load libraries in case it doesn't ?

[triblondon]

Doesn't this feature have a really confusing name? I'm reading https://github.com/w3c/webappsec-feature-policy/blob/master/policies/lazyload.md, where it says:

Feature Policy: lazyload 'self' https://example.com would not allow synchronous loading for any