From 67105db5a99248fd4c91485a49b337f6a0330569 Mon Sep 17 00:00:00 2001
From: Gabriel Augendre <gabriel@augendre.info>
Date: Tue, 25 Aug 2020 23:06:12 +0200
Subject: [PATCH] Lazy load images

---
 articles/markdown.py | 35 +++++++++++++++++++++++++++++++++++
 articles/models.py   |  8 +++++++-
 2 files changed, 42 insertions(+), 1 deletion(-)
 create mode 100644 articles/markdown.py

diff --git a/articles/markdown.py b/articles/markdown.py
new file mode 100644
index 0000000..ced57d6
--- /dev/null
+++ b/articles/markdown.py
@@ -0,0 +1,35 @@
+from markdown import Markdown
+from markdown.extensions import Extension
+from markdown.inlinepatterns import (
+    IMAGE_LINK_RE,
+    IMAGE_REFERENCE_RE,
+    ImageInlineProcessor,
+    ImageReferenceInlineProcessor,
+)
+
+
+class LazyImageInlineProcessor(ImageInlineProcessor):
+    def handleMatch(self, m, data):
+        el, match_start, index = super().handleMatch(m, data)
+        el.set("loading", "lazy")
+        return el, match_start, index
+
+
+class LazyImageReferenceInlineProcessor(ImageReferenceInlineProcessor):
+    def makeTag(self, href, title, text):
+        el = super().makeTag(href, title, text)
+        el.set("loading", "lazy")
+        return el
+
+
+class LazyLoadingImageExtension(Extension):
+    def extendMarkdown(self, md: Markdown):
+        md.inlinePatterns.register(
+            LazyImageInlineProcessor(IMAGE_LINK_RE, md), "image_link", 150
+        )
+        md.inlinePatterns.register(
+            LazyImageReferenceInlineProcessor(IMAGE_REFERENCE_RE, md),
+            "image_reference",
+            140,
+        )
+        md.registerExtension(self)
diff --git a/articles/models.py b/articles/models.py
index 7bb903c..956321b 100644
--- a/articles/models.py
+++ b/articles/models.py
@@ -11,6 +11,8 @@ from django.urls import reverse
 from django.utils import timezone
 from markdown.extensions.codehilite import CodeHiliteExtension
 
+from articles.markdown import LazyLoadingImageExtension
+
 
 class User(AbstractUser):
     pass
@@ -79,7 +81,11 @@ class Article(AdminUrlMixin, models.Model):
 
     def get_formatted_content(self):
         md = markdown.Markdown(
-            extensions=["extra", CodeHiliteExtension(linenums=False)]
+            extensions=[
+                "extra",
+                CodeHiliteExtension(linenums=False),
+                LazyLoadingImageExtension(),
+            ]
         )
         content = self.content
         content = re.sub(r"(\s)#(\w+)", r"\1\#\2", content)