Load images async

This commit is contained in:
Jake Howard 2022-08-25 22:42:33 +01:00
parent 3f9288f5cb
commit 309955a052
Signed by: jake
GPG Key ID: 57AFB45680EDD477
7 changed files with 10 additions and 7 deletions

View File

@ -2,7 +2,7 @@
<figure>
<div class="image is-16by9">
<img src="{% image_url value.image 'width-1500' %}" alt="{{ value.caption|richtext|extract_text }}" />
<img src="{% image_url value.image 'width-1500' %}" alt="{{ value.caption|richtext|extract_text }}" loading="lazy" decoding="async" />
</div>
<figcaption>
{{ value.caption|richtext }}

View File

@ -5,7 +5,7 @@
<figure class="media-left column is-3 image-column">
{% if page.list_image_url %}
<a href="{% pageurl page %}" class="image">
<img src="{{ page.list_image_url }}">
<img src="{{ page.list_image_url }}" loading="lazy" decoding="async" />
</a>
{% endif %}
</figure>

View File

@ -12,7 +12,7 @@
{% block main_content %}
{% if page.hero_image_url %}
<img class="hero" src="{{ page.hero_image_url }}">
<img class="hero" src="{{ page.hero_image_url }}" decoding="async" />
{% endif %}
<section class="hero">

View File

@ -2,7 +2,7 @@
<figure>
<div class="image">
<img src="https://mermaid.ink/svg/{{ value.pako }}" referrerpolicy="no-referrer" alt="{{ value.caption|richtext|extract_text }}" />
<img src="https://mermaid.ink/svg/{{ value.pako }}" referrerpolicy="no-referrer" alt="{{ value.caption|richtext|extract_text }}" loading="lazy" decoding="async" />
</div>
<figcaption>
{{ value.caption|richtext }}

View File

@ -18,7 +18,7 @@
<tr>
<td>
<a class="item-choice" href="{{ row.choose_url }}">
<img src="{{ row.item.get_thumbnail_url }}" width="165"/>
<img src="{{ row.item.get_thumbnail_url }}" width="165" referrerpolicy="no-referrer" decoding="async" />
</a>
</td>
<td class="title">

View File

@ -72,7 +72,7 @@ class UnsplashPhotoAdmin(ModelAdmin):
def thumbnail(self, instance: UnsplashPhoto) -> str:
return format_html(
"<img src='{}' width=165 class='admin-thumb'/>",
"<img src='{}' width=165 class='admin-thumb' loading='lazy' decoding='async' />",
instance.get_thumbnail_url(),
)

View File

@ -13,4 +13,7 @@ class UnsplashPhotoChooser(AdminChooser):
choose_modal_url_name = "unsplash_photo_chooser:choose"
def get_title(self, instance: UnsplashPhoto) -> str:
return format_html("<img src='{}' width=165>", instance.get_thumbnail_url())
return format_html(
"<img src='{}' width=165 loading='lazy' decoding='async'>",
instance.get_thumbnail_url(),
)