Implement lazy-load for iframe
Categories
(Core :: DOM: Core & HTML, enhancement, P2)
Tracking
()
Performance Impact | none |
People
(Reporter: hiro, Unassigned, NeedInfo)
References
Details
(4 keywords, Whiteboard: [layout:backlog])
Updated•3 years ago
|
Comment 1•3 years ago
|
||
Do we need a tracking bug for this when there's no specification yet?
Comment 2•3 years ago
|
||
Is there even a new specification issue regarding iframes (and other elements loading remote resources)? It looks like the outcome of https://github.com/whatwg/html/issues/2806 was only lazy loading for <img>
elements, in the end.
(In reply to Anne (:annevk) from comment #1)
Do we need a tracking bug for this when there's no specification yet?
I assume, lazy loading for iframes will eventually also be specified. So either this bug should be kept open or closed for now and be reopened once specified in order to implement it.
Sebastian
Updated•3 years ago
|
Comment 3•3 years ago
|
||
Now that we triage by severity, setting this bug's priority to P2 to represent near-term backlog status. See https://wiki.mozilla.org/Platform/Layout#Backlog_Tracking_in_Bugzilla
Updated•3 years ago
|
Comment 4•3 years ago
|
||
FYI https://github.com/whatwg/html/pull/5579 has now landed.
Updated•2 years ago
|
Updated•2 years ago
|
Comment 5•6 months ago
|
||
Shipping in Safari TP 151:
https://webkit.org/blog/13093/release-notes-for-safari-technology-preview-151/
Enabled lazy iframe loading by default (252848@main)
So probably [parity-safari]
as well.
Updated•6 months ago
|
Updated•4 months ago
|
Updated•4 months ago
|
Comment 6•3 months ago
|
||
The Performance Impact Calculator has determined this bug's performance impact to be none. If you'd like to request re-triage, you can reset the Performance Impact flag to "?" or needinfo the triage sheriff.
Comment 7•1 month ago
|
||
I do not agree with the previous comment.
Iframes are used on majority of websites and may have a significant performance impact depending on what is loaded in the iframe.
It is a very real problem if those iframes contain videos or animations in carousel or slider elements.
See new calculation below.
The Performance Impact Calculator has determined this bug's performance impact to be high. If you'd like to request re-triage, you can reset the Performance Impact flag to "?" or needinfo the triage sheriff.
Platforms: [x] Windows
×3 [x] macOS
×3 [x] Linux
×1 [x] Android
×1.5
Impact on browser: Causes noticeable startup delay
+5
Page load impact: Some
+5
Websites affected: Major
×5
[x] Able to reproduce locally
×2
[x] Bug affects multiple sites
×2
[x] Multiple reporters
×1.5
Comment 8•1 month ago
|
||
I would ask if the priority or severity can be increased, in respect to my previous comment.
Comment 9•1 month ago
|
||
How much startup delay does it cause?
What is the specific amount of page load impact the lack of this feature is causing?
What websites are using this feature?
How are you reproducing this locally?
Thanks.
Comment 10•1 month ago
|
||
https://almanac.httparchive.org/en/2022/css is an example page that loads a LOT of embedded Google Sheets charts in iframes with loading=lazy so that, browsers that support this, will only load the content needed near the viewport.
On Chrome this loads 1.7 MB of resources for the above the fold content (6.3 MB uncompressed). As you scroll down it loads more as needed. This is similar in Safari Technology Preview.
On Firefox this loads 32.06 MB of resources for the above the fold content (110.82 MB uncompressed) as it loads the whole thing (though this is with the default Disable Cache option ticked, it's a lot less than that with that unticked as there's a lot of duplication in these as a lot of the same JS is reused in each graph).
As well as downloading all that extra stuff, the browser has to process it, which could cause other performance issues.
I also got a complaint about this from a Firefox user: https://github.com/HTTPArchive/almanac.httparchive.org/issues/1822
Description
•