Image optimization, lazy loading, and static asset performance improvements

blt/settings.py

@@ -101,16 +101,18 @@
     "dj_rest_auth.registration",
     "storages",
     "channels",
+    "silk",
 )
-
 if DEBUG:
-    INSTALLED_APPS += ("livereload",)
+    INSTALLED_APPS += ("debug_toolbar", "livereload")
+
 
 SOCIAL_AUTH_GITHUB_KEY = os.environ.get("GITHUB_CLIENT_ID", "blank")
 SOCIAL_AUTH_GITHUB_SECRET = os.environ.get("GITHUB_CLIENT_SECRET", "blank")
 
 
 MIDDLEWARE = [
+    "silk.middleware.SilkyMiddleware",
     "django.contrib.sessions.middleware.SessionMiddleware",
     "blt.middleware.domain.DomainMiddleware",
     "django.middleware.locale.LocaleMiddleware",
@@ -128,8 +130,10 @@
     "blt.middleware.user_visit_tracking.VisitTrackingMiddleware",
 ]
 
+
 if DEBUG:
-    MIDDLEWARE += ("livereload.middleware.LiveReloadScript",)
+    MIDDLEWARE += ("livereload.middleware.LiveReloadScript", "debug_toolbar.middleware.DebugToolbarMiddleware")
+    INTERNAL_IPS = ["127.0.0.1"]
 
 BLUESKY_USERNAME = env("BLUESKY_USERNAME", default="default_username")
 BLUESKY_PASSWORD = env("BLUESKY_PASSWORD", default="default_password")
@@ -156,46 +160,56 @@
         "SHOW_TOOLBAR_CALLBACK": lambda request: True,
     }
 
-    INSTALLED_APPS += ("debug_toolbar",)
-
-    MIDDLEWARE += ("debug_toolbar.middleware.DebugToolbarMiddleware",)
-
 ROOT_URLCONF = "blt.urls"
 
-TEMPLATES = [
-    {
-        "BACKEND": "django.template.backends.django.DjangoTemplates",
-        "DIRS": [os.path.join(BASE_DIR, "website", "templates")],
-        "APP_DIRS": False,
-        "OPTIONS": {
-            "debug": DEBUG,
-            "context_processors": [
-                "django.template.context_processors.debug",
-                "django.template.context_processors.request",
-                "django.template.context_processors.media",
-                "django.contrib.auth.context_processors.auth",
-                "django.contrib.messages.context_processors.messages",
-                "django.template.context_processors.i18n",
-            ],
-            "loaders": (
-                [
-                    "django.template.loaders.filesystem.Loader",
-                    "django.template.loaders.app_directories.Loader",
-                ]
-                if DEBUG
-                else [
+if DEBUG:
+    TEMPLATES = [
+        {
+            "BACKEND": "django.template.backends.django.DjangoTemplates",
+            "DIRS": [os.path.join(BASE_DIR, "website", "templates")],
+            "APP_DIRS": True,
+            "OPTIONS": {
+                "debug": True,
+                "context_processors": [
+                    "django.template.context_processors.debug",
+                    "django.template.context_processors.request",
+                    "django.template.context_processors.media",
+                    "django.contrib.auth.context_processors.auth",
+                    "django.contrib.messages.context_processors.messages",
+                    "django.template.context_processors.i18n",
+                ],
+            },
+        }
+    ]
+else:
+    TEMPLATES = [
+        {
+            "BACKEND": "django.template.backends.django.DjangoTemplates",
+            "DIRS": [os.path.join(BASE_DIR, "website", "templates")],
+            "APP_DIRS": False,
+            "OPTIONS": {
+                "debug": False,
+                "loaders": [
                     (
                         "django.template.loaders.cached.Loader",
                         [
                             "django.template.loaders.filesystem.Loader",
                             "django.template.loaders.app_directories.Loader",
                         ],
-                    ),
-                ]
-            ),
-        },
-    },
-]
+                    )
+                ],
+                "context_processors": [
+                    "django.template.context_processors.debug",
+                    "django.template.context_processors.request",
+                    "django.template.context_processors.media",
+                    "django.contrib.auth.context_processors.auth",
+                    "django.contrib.messages.context_processors.messages",
+                    "django.template.context_processors.i18n",
+                ],
+            },
+        }
+    ]
+
 
 AUTHENTICATION_BACKENDS = (
     "django.contrib.auth.backends.ModelBackend",
@@ -363,6 +377,7 @@
     ALLOWED_HOSTS = ["*"]
 
 STATIC_ROOT = os.path.join(PROJECT_ROOT, "staticfiles")
+STATICFILES_STORAGE = "whitenoise.storage.CompressedManifestStaticFilesStorage"
 STATIC_URL = "/static/"
 
 STATICFILES_DIRS = (os.path.join(BASE_DIR, "website", "static"),)

blt/urls.py

@@ -1261,3 +1261,9 @@
     ] + urlpatterns
 
     urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
+
+if settings.DEBUG:
+    urlpatterns += [
+        path("silk/", include("silk.urls", namespace="silk")),
+        path("__debug__/", include("debug_toolbar.urls")),
+    ]

pyproject.toml

@@ -70,6 +70,8 @@ tweepy = "^4.15.0"
 better-profanity = "^0.7.0"
 django-bleach = "^3.1.0"
 pyjwt = {extras = ["crypto"], version = "^2.0.0"}
+django-silk = "^5.0.1"
+django-debug-toolbar = "^4.3.0"
 
 
 [tool.poetry.group.dev.dependencies]

scripts/convert_images_to_webp.py

@@ -0,0 +1,59 @@
+# scripts/convert_images_to_webp.py
+
+import shutil
+from pathlib import Path
+
+from PIL import Image
+
+# Directories to process
+SOURCE_DIRS = [
+    "website/static/images",
+    "website/static/img",
+    "website/static/img/browser-logos",
+]
+
+BACKUP_DIR = "website/static/_image_backups"
+
+
+def ensure_backup_dir():
+    Path(BACKUP_DIR).mkdir(parents=True, exist_ok=True)
+
+
+def convert_png(png_path: Path):
+    try:
+        webp_path = png_path.with_suffix(".webp")
+
+        # Skip if already converted
+        if webp_path.exists():
+            return
+
+        # Backup original
+        rel = png_path.relative_to("website/static")
+        backup_path = Path(BACKUP_DIR) / rel
+        backup_path.parent.mkdir(parents=True, exist_ok=True)
+        shutil.copy2(png_path, backup_path)
+
+        # Convert to WebP
+        img = Image.open(png_path).convert("RGBA")
+        img.save(webp_path, "webp", quality=85, method=6)
+
+        # Optimize original PNG (overwrite)
+        img.save(png_path, optimize=True)
+
+    except Exception:
+        # Silent failure by design (CI-safe)
+        pass
+
+
+def main():
+    ensure_backup_dir()
+    for d in SOURCE_DIRS:
+        p = Path(d)
+        if not p.exists():
+            continue
+        for png in p.rglob("*.png"):
+            convert_png(png)
+
+
+if __name__ == "__main__":
+    main()