Add loading="lazy" to some images, except categories in viewport

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel 2022-11-04 16:11:36 +01:00
parent a51b36fb75
commit 5078f890ce
No known key found for this signature in database
GPG key ID: A061B9DDE0CA0773
3 changed files with 5 additions and 1 deletions

View file

@ -29,7 +29,7 @@
width="384" width="384"
height="384" height="384"
alt="" alt=""
loading="lazy" :loading="imageLazy ? 'lazy' : undefined"
/> />
</picture> </picture>
<p <p
@ -71,9 +71,11 @@ withDefaults(
defineProps<{ defineProps<{
category: CategoryStatsModel; category: CategoryStatsModel;
withDetails?: boolean; withDetails?: boolean;
imageLazy?: boolean;
}>(), }>(),
{ {
withDetails: false, withDetails: false,
imageLazy: true,
} }
); );

View file

@ -7,6 +7,7 @@
:key="category.key" :key="category.key"
:category="category" :category="category"
:with-details="false" :with-details="false"
:imageLazy="false"
/> />
<router-link <router-link
:to="{ name: RouteName.CATEGORIES }" :to="{ name: RouteName.CATEGORIES }"

View file

@ -17,6 +17,7 @@
:class="imageOpacity" :class="imageOpacity"
alt="" alt=""
src="" src=""
loading="lazy"
/> />
</div> </div>
</div> </div>