Load images lazily

This commit is contained in:
arne 2022-10-07 00:47:19 +02:00
commit f9894558e2
3 changed files with 11 additions and 2 deletions

View file

@ -4,9 +4,10 @@ const pluginSyntaxHighlight = require('@11ty/eleventy-plugin-syntaxhighlight')
// extra features for markdown // extra features for markdown
const markdownIt = require('markdown-it') const markdownIt = require('markdown-it')
const anchors = require('markdown-it-anchor')
const abbrs = require('markdown-it-abbr') const abbrs = require('markdown-it-abbr')
const anchors = require('markdown-it-anchor')
const footnotes = require('markdown-it-footnote') const footnotes = require('markdown-it-footnote')
const lazyLoading = require('@junwatu/markdown-it-lazy-loading')
const { DateTime } = require('luxon') const { DateTime } = require('luxon')
const header = require('./src/_includes/filters/header') const header = require('./src/_includes/filters/header')
@ -33,9 +34,10 @@ module.exports = function (config) {
config.setLibrary("md", config.setLibrary("md",
markdownIt(mdOptions) markdownIt(mdOptions)
.use(abbrs)
.use(anchors) .use(anchors)
.use(footnotes) .use(footnotes)
.use(abbrs) .use(lazyLoading, { img: 'lazy' })
) )
// template filters // template filters

View file

@ -26,6 +26,7 @@
"dependencies": { "dependencies": {
"@11ty/eleventy-plugin-rss": "^1.1.2", "@11ty/eleventy-plugin-rss": "^1.1.2",
"@11ty/eleventy-plugin-syntaxhighlight": "^4.1.0", "@11ty/eleventy-plugin-syntaxhighlight": "^4.1.0",
"@junwatu/markdown-it-lazy-loading": "1.0.0-beta.4",
"@remy/webmention": "^1.4.5", "@remy/webmention": "^1.4.5",
"@types/markdown-it": "^12.2.3", "@types/markdown-it": "^12.2.3",
"autoprefixer": "^10.4.12", "autoprefixer": "^10.4.12",

6
pnpm-lock.yaml generated
View file

@ -4,6 +4,7 @@ specifiers:
'@11ty/eleventy': ^2.0.0-canary.16 '@11ty/eleventy': ^2.0.0-canary.16
'@11ty/eleventy-plugin-rss': ^1.1.2 '@11ty/eleventy-plugin-rss': ^1.1.2
'@11ty/eleventy-plugin-syntaxhighlight': ^4.1.0 '@11ty/eleventy-plugin-syntaxhighlight': ^4.1.0
'@junwatu/markdown-it-lazy-loading': 1.0.0-beta.4
'@remy/webmention': ^1.4.5 '@remy/webmention': ^1.4.5
'@thi.ng/hiccup': 3.6.22 '@thi.ng/hiccup': 3.6.22
'@types/markdown-it': ^12.2.3 '@types/markdown-it': ^12.2.3
@ -22,6 +23,7 @@ specifiers:
dependencies: dependencies:
'@11ty/eleventy-plugin-rss': 1.1.2 '@11ty/eleventy-plugin-rss': 1.1.2
'@11ty/eleventy-plugin-syntaxhighlight': 4.1.0 '@11ty/eleventy-plugin-syntaxhighlight': 4.1.0
'@junwatu/markdown-it-lazy-loading': 1.0.0-beta.4
'@remy/webmention': 1.4.5 '@remy/webmention': 1.4.5
'@types/markdown-it': 12.2.3 '@types/markdown-it': 12.2.3
autoprefixer: 10.4.12_postcss@8.4.17 autoprefixer: 10.4.12_postcss@8.4.17
@ -165,6 +167,10 @@ packages:
resolution: {integrity: sha512-trnsAYxU3xnS1gPHPyU961coFyLkh4gAD/0zQ5mymY4yOZ+CYvsPqUbOFSw0aDM4y0tV7tiFxL/1XfXPNC6IPg==} resolution: {integrity: sha512-trnsAYxU3xnS1gPHPyU961coFyLkh4gAD/0zQ5mymY4yOZ+CYvsPqUbOFSw0aDM4y0tV7tiFxL/1XfXPNC6IPg==}
dev: true dev: true
/@junwatu/markdown-it-lazy-loading/1.0.0-beta.4:
resolution: {integrity: sha512-hYX5tPnZf+tre9OguANYcm/WlAc/m65ana9Z26fCiLfkmwJOhVBYa1EWX9IVVHoX0RFSpRxQ0rZz7smwLRHcTQ==}
dev: false
/@nodelib/fs.scandir/2.1.5: /@nodelib/fs.scandir/2.1.5:
resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==} resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==}
engines: {node: '>= 8'} engines: {node: '>= 8'}