zaclys/searxng
1
0
Fork 1
mirror of https://github.com/searxng/searxng synced 2024-01-01 19:24:07 +01:00
Code Issues Projects Releases Packages Wiki Activity

[fix] lazy loading of <img> tags

Browse source 
Images should include dimension attributes.  Without `width` and `height`
specified, image dimensions are 0×0 pixels at first.  ...  In this case the
browser determines that all of them are visible to the user and decides to load
everything [1].

In CSS the `width` is set to a value and the `height` is unsed to scale the image
proportional in both dimensions.

[1] https://web.dev/browser-level-image-lazy-loading/#images-should-include-dimension-attributes
[2] https://caniuse.com/loading-lazy-attr

Signed-off-by: Markus Heiser <markus.heiser@darmarit.de>
This commit is contained in:
Markus Heiser 2021-12-01 18:05:25 +01:00
parent da1f970eb5
commit c416464949
3 changed files with 5 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

1
searx/static/themes/simple/src/less/style.less
View file

@ -267,6 +267,7 @@ article[data-vim-selected].category-social {
float: left;
padding: 0.6rem 1rem 0 0;
width: 20rem;
height: unset; // remove heigth value that was needed for lazy loading
}
&.image {