3 ms·
I think it depends on many factors actually. While there are other methods that can be used to defer / delay loading of images (and videos and others) - and the
by stevenicr 2y ago
I think it depends on many factors actually. While there are other methods that can be used to defer / delay loading of images (and videos and others) - and there are methods to 'preload fonts' and tricks like font-swap css..
I do believe that deferring the loading of large or many images and other assets can increase the speed to which the browser shows things on the screen, and 'time to interactive'; how long before you can scroll or click.
So depending on how a page is built, not doing anything to defer the loading of many images / other assets (that are not to be displayed 'above the fold' ) can increase or decrease the time it takes to render the text on the initial screen.
"Lazy loading images and video reduces initial page load time, initial page weight, and system resource usage, all of which have positive impacts on performance." - [1]
You may not notice this often if you have a fast internet connection, someone with a limited bandwidth, limited phone memory and the like may experience the issues more.
I believe this is aggravated with layout shifts do to fonts loading late / changing and image height / width not being known until after loading..
I spend a not-so-insignificant amount of time using google's pagespeed testing
(https://pagespeed.web.dev/analysis/https-www-netmeister-org-blog-cidr-allocations-html/x9yg7dnf54?form_factor=mobile https://pagespeed.web.dev/analysis/https-www-netmeister-org-... )
and other tools to find issues that can be enhanced to fix page load speed, and time to interact, etc.. in order to fix these issues for site pages that others may not notice using a fast connection or benefiting from cached imagery.
"Lazy loading is a strategy to identify resources as non-blocking (non-critical) and load these only when needed. It's a way to shorten the length of the critical rendering path, which translates into reduced page load times." - [2]
[1] https://web.dev/articles/lazy-loading https://web.dev/articles/lazy-loading
[2] https://developer.mozilla.org/en-US/docs/Web/Performance/Lazy_loading https://developer.mozilla.org/en-US/docs/Web/Performance/Laz...