search

conversionxl / aybolit

Lightweight web components library built with LitElement.
https://conversionxl.github.io/aybolit/
MIT License
7 stars 8 forks source link

feat(cxl-ui): cxl-base-card add lazyload for avatar image #392

Open pawelkmpt opened 5 months ago

github-actions[bot] commented 5 months ago

size-limit report 📦

Path Size
packages/cxl-ui/pkg/dist-web/cxl-ui.js 71.96 KB (+0.05% 🔺)
packages/cxl-ui/pkg/dist-web/cxl-ui-jwplayer.js 11.89 KB (0%)
packages/cxl-ui/pkg/dist-web/cxl-ui-playbooks.js 28.93 KB (0%)
packages/cxl-ui/pkg/dist-web/vendor.js 140.5 KB (0%)
packages/cxl-ui/pkg/dist-web/cxl-ui-jwplayer.js, packages/cxl-ui/pkg/dist-web/cxl-ui-playbooks.js, packages/cxl-ui/pkg/dist-web/cxl-ui.js, packages/cxl-ui/pkg/dist-web/manifest.js, packages/cxl-ui/pkg/dist-web/unresolved.js, packages/cxl-ui/pkg/dist-web/vendor.js 254.44 KB (+0.02% 🔺)
lkraav commented 5 months ago

Why would it ever be optional, though?

pawelkmpt commented 5 months ago

Why would it ever be optional, though?

In situation when card is above the fold:

You should avoid setting loading=lazy for any images that are in the first visible viewport. This is particularly relevant for LCP images. See the article The performance effects of too much lazy-loading for more information.

https://web.dev/articles/browser-level-image-lazy-loading#avoid_lazy_loading_images_that_are_in_the_first_visible_viewport

lkraav commented 5 months ago

In situation when card is above the fold:

That's what I'm saying: are cards ever above the fold? Dashboard?

pawelkmpt commented 5 months ago

In situation when card is above the fold:

That's what I'm saying: are cards ever above the fold? Dashboard?

yes, dashboard, category pages etc.