lazy spacer
Saturday: - import image1 from imgix address ??
To test: - https://github.com/mfranzke/loading-attribute-polyfill Reference (Flashing): - https://stackoverflow.com/questions/72491824/why-lazy-loading-on-img-is-broken-on-mobile-browser-ios - https://web.dev/articles/browser-level-image-lazy-loading#avoid_lazy_loading_images_that_are_in_the_first_visible_viewport + "You should avoid setting loading=lazy for any images that are in the first visible viewport. It is recommended to only add loading=lazy to images which are positioned below the fold, if possible." - https://discussions.apple.com/thread/254766633?sortBy=best Reference (Lazy): - Next not respecting Lazy: https://github.com/vercel/next.js/issues/46019 + Although `https://github.com/ascorbic/unpic-img/issues/444`: This is already tried and NOT the issue. - ⚠ https://unpic.pics/img/learn/#priority-and-lazy-loading + Be VERY CAREFULL when posting in Github about this issue. + By my recent findinds, about the "flash" of above the fold content, is addressed right here. + Ugh. + RTFM. - Question to ask???: Why is this not better or automatic when `loading` is set to `lazy` for above the fold images?
## Usual (control) - Has the flashing issue and doesn't seem to lazy load. ### Lazy: - 2x versions of the images seem to load from `Memory Cache` and `Disk Cache` - But then another version loads, from `Disk Cache` on scroll
## Image_lazyfix ### Lazy: - ✅Works as expected ### Flash: -
## `img` tag (Control) ### Lazy - Works as expected ### Flashing: - loading="lazy" = Has flashing (because the whole area seems to be collapsed before the load) + Order doesn't matter. Before or after `src=` is the same. - loading="eager" or nothing = NO flashing. Perfect loading. - Even with `height="500"` there's a flash and the area collapses. - Added `style="min-height: 800px;"` keeps the area from collapsing, but the flash is still there.
