TheCloud/PronounsPage
1
0
Fork 0
mirror of https://gitlab.com/PronounsPage/PronounsPage.git synced 2025-09-08 23:14:43 -04:00
Code Issues Packages Projects Releases Wiki Activity

[perf] lazy img loading

Browse Source
This commit is contained in:
Andrea Vos 2023-01-04 23:02:43 +01:00
parent b00903a55e
commit b50708c835
2 changed files with 2 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
components/BlogEntriesList.vue
View File

@ -3,7 +3,7 @@
<div v-for="post in postsFull" class="columnist-column col-12 col-sm-6 col-md-4 mb-3">
<div class="card shadow">
<nuxt-link v-if="post.hero" :to="generateLink(post.slug)" class="">
<img :src="post.hero" class="w-100"/>
<img :src="post.hero" class="w-100" loading="lazy"/>
</nuxt-link>
<nuxt-link :to="generateLink(post.slug)" class="card-body text-center h4 p-3 mb-0">
<Spelling :text="post.title"/>

2
src/parseMarkdown.js
View File

@ -77,7 +77,7 @@ export default async function parseMarkdown(markdown) {
classNames = m[1];
attrs = attrs.replace(/alt="{(.*)}/, 'alt="');
}
return `<div class="text-center"><img ${attrs} class="${classNames}"></div>`;
return `<div class="text-center"><img ${attrs} class="${classNames}" loading="lazy"></div>`;
})
.replace(/{favicon=(.+?)}/g, '<img src="https://$1" alt="Favicon" style="width: 1em; height: 1em;"/>')
.replace(/{embed=\/\/(.+?)=(.+?)}/g, '<div style="position: relative;height: 0;padding-bottom: 56.25%;"><iframe src="https://$1" title="$2" allowfullscreen sandbox="allow-same-origin allow-scripts allow-popups" style="position: absolute;top: 0; left: 0;width: 100%;height: 100%;border:0;"></iframe></div>')