What does HackerNews think of lazysizes?

High performance and SEO friendly lazy loader for images (responsive and normal), iframes and more, that detects any visibility changes triggered through user interaction, CSS or JavaScript without configuration.

Language: JavaScript

#110 in JavaScript
I recently did some optimizations on my personal website to make the images load “lazily.” In other words it only loads stuff once it hits the viewport. I think that’s what you’re looking for. I tried two techniques:

1. There is an HTML attribute to do just this and it seems to work for iframes too: https://developer.mozilla.org/en-US/docs/Web/Performance/Laz...

2. There is a simple library called “lazy sizes” (https://github.com/aFarkas/lazysizes)

I tried to avoid the lib and use the native HTML… but for whatever reason the lib worked more reliably/effectively in manual tests as well as in my benchmarking via PageSpeed / Lighthouse. YMMV!

Ironic indeed, but then the blog itself doesn't use React, the slowdown most likely comes from some utility library[1]. The advice in the article may not be discredited, but this shows that learning basic profiling should come before obsessing over framework-specific optimizations.

[1]: https://github.com/aFarkas/lazysizes

All links in above txt:

1. The repo for the boilerplate is: https://github.com/MozaikAgency/wp-theme-bootstrap

2. The helper mentioned: https://github.com/MozaikAgency/wp-theme-bootstrap/blob/mast...

3. Code demoing how the helper would be used: https://github.com/MozaikAgency/wp-theme-bootstrap/blob/ccdf...

4. Resp images polyfill - PictureFill: https://github.com/scottjehl/picturefill

5. lazy-loading content js lib - lazySizes: https://github.com/aFarkas/lazysizes

6. object-fit polyfill - Object-fit: https://github.com/anselmh/object-fit

7. Vote for object-fit to be included in IE: https://wpdev.uservoice.com/forums/257854-microsoft-edge-dev...