Add Lighthouse testing infrastructure for performance and quality audits

.github/workflows/lighthouse.yml

@@ -0,0 +1,52 @@
+name: Lighthouse
+
+on:
+  # Run after deployment to main branch
+  workflow_run:
+    workflows: ["Build, test, deploy to GitHub Pages"]
+    types:
+      - completed
+    branches:
+      - main
+  # Allow manual trigger
+  workflow_dispatch:
+
+permissions:
+  contents: read
+  actions: read
+
+jobs:
+  lighthouse:
+    name: Lighthouse audit
+    runs-on: ubuntu-latest
+    # Only run if the triggering workflow succeeded (or on manual trigger)
+    if: ${{ github.event.workflow_run.conclusion == 'success' || github.event_name == 'workflow_dispatch' }}
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Wait for GitHub Pages deployment
+        # Give GitHub Pages some time to deploy the new content
+        if: github.event_name == 'workflow_run'
+        run: sleep 60
+
+      - name: Run Lighthouse CI
+        uses: treosh/lighthouse-ci-action@fcd65974f7c4c2bf0ee9d09b84d2489183c29726 # v12.6.1
+        with:
+          configPath: './.lighthouserc.json'
+          urls: |
+            https://${{ github.repository_owner }}.github.io/${{ github.event.repository.name }}/
+            https://${{ github.repository_owner }}.github.io/${{ github.event.repository.name }}/experiment-template/page-to-test.html
+          uploadArtifacts: true
+          temporaryPublicStorage: true
+
+      - name: Upload Lighthouse Reports
+        uses: actions/upload-artifact@v4
+        if: always()
+        with:
+          name: lighthouse-reports
+          path: |
+            .lighthouseci/
+            lhci_reports/
+          retention-days: 30

.gitignore

@@ -8,6 +8,9 @@
 /test/fixtures/actual-results.json
 /test/fixtures-multithread
 
+# Lighthouse reports
+.lighthouseci/
+
 # For DS Store
 **/.DS_Store
 

.lighthouserc.json

@@ -0,0 +1,21 @@
+{
+  "ci": {
+    "collect": {
+      "numberOfRuns": 3,
+      "settings": {
+        "chromeFlags": "--no-sandbox --disable-dev-shm-usage"
+      }
+    },
+    "assert": {
+      "assertions": {
+        "categories:performance": ["warn", {"minScore": 0.8}],
+        "categories:accessibility": ["error", {"minScore": 0.9}],
+        "categories:best-practices": ["warn", {"minScore": 0.8}],
+        "categories:seo": ["warn", {"minScore": 0.8}]
+      }
+    },
+    "upload": {
+      "target": "temporary-public-storage"
+    }
+  }
+}

README.md

@@ -80,6 +80,24 @@ yarn test-structured-data
 
 This validates that any `application/ld+json` scripts in `build/**/*.html` files have correct schema.org formats and valid JSON syntax.
 
+#### Lighthouse Testing
+
+Run Lighthouse performance, accessibility, best practices, and SEO audits locally:
+
+```sh
+yarn test-lighthouse
+```
+
+This requires the site to be running locally. First start the development server:
+
+```sh
+bundle exec jekyll serve
+```
+
+Then in another terminal, run the lighthouse tests. This will generate HTML reports in the `.lighthouseci/` directory.
+
+Note: Lighthouse testing is also automatically run via GitHub Actions after each deployment to the main branch, with reports uploaded as workflow artifacts.
+
 ## Notes for VS Code
 
 Open this folder in VS Code, allow the "Reopen in Container" and install recommended extensions.

package.json

@@ -1,6 +1,7 @@
 {
   "license": "UNLICENSED",
   "devDependencies": {
+    "@lhci/cli": "^0.15.1",
     "@shopify/prettier-plugin-liquid": "^1.9.3",
     "better-sqlite3": "^12.2.0",
     "cheerio": "^1.1.2",
@@ -16,6 +17,7 @@
   "scripts": {
     "test": "yarn node test/fixtures-html-validate-should-fail.mjs && yarn node test/fixtures-structured-data-should-fail.mjs && yarn node test/build-html-validate.mjs && yarn node test/dirty-words-checker.mjs && yarn node test/dirty-file-paths-checker.mjs && yarn node test/build-structured-data-validate.mjs",
     "test-structured-data": "yarn node test/build-structured-data-validate.mjs",
+    "test-lighthouse": "yarn lhci autorun --config=.lighthouserc.json",
     "lint": "yarn prettier-check && yarn markdownlint-check",
     "lint-fix": "yarn prettier-fix && yarn markdownlint-fix",
     "generate-sitemap": "node scripts/generate-sitemap.mjs",