repos/website
1
Fork 0
Code Issues 1 Pull requests 23 Activity

Load images async

Browse source
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
Show stats Download patch file Download diff file Expand all files Collapse all files

2
website/common/templates/common/blocks/image-caption.html
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 }}

2
website/common/templates/common/listing-item.html
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>

2
website/common/templates/wagtail_base.html
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">

2
website/contrib/mermaid_block/templates/contrib/blocks/mermaid.html
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 }}

2
website/contrib/unsplash/templates/unsplash/results.html
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">

2
website/contrib/unsplash/wagtail_hooks.py
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(),
)

5
website/contrib/unsplash/widgets.py
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(),
)