DEV Community

Peter Freedman
Peter Freedman

Posted on

I built a website diagnostics tool that includes over 18 audits.

I got tired of running Lighthouse for performance, Screaming Frog for SEO, axe for accessibility, and manually checking security headers — then stitching it all together into something a client could read.

So I built Site Mechanic — one scan, one report covering everything.

  • Performance — Lighthouse-powered Core Web Vitals (mobile + desktop)
  • SEO — Meta tags, headings, structured data, images, links, mobile responsiveness
  • Accessibility — WCAG compliance: contrast, alt text, ARIA, keyboard nav
  • Security — HTTP headers, SSL, mixed content, vulnerability surface
  • Typography — Font loading, consistency, web font optimization

Every issue is ranked by severity with code-level fix recommendations —not just "fix your meta tags" but the actual code to do it.

## The stack

  • Backend: Node.js, Express, SQLite (Postgres in production)
  • Browser automation: Puppeteer + Playwright + Lighthouse 11
  • PDF generation: Puppeteer renders HTML templates to PDF
  • AI recommendations: Claude API generates strategic analysis per report
  • Payments: Stripe (subscriptions, day passes, single-report purchases)
  • i18n: 8 languages (EN, ES, FR, DE, PT, JA, ZH, RU)
  • No framework — vanilla JS frontend, CSS variables for theming

## Features I'm most proud of

Client-ready PDF exports — One click generates a polished PDF with score breakdowns, prioritized fixes,
screenshots, and AI-powered strategic recommendations. Hand it to a client without any cleanup.

AI Strategic Analysis — Each report includes a Claude-generated summary that interprets scores in context,
identifies quick wins, and recommends a priority order for fixes.

Competitive Analysis — Compare your site head-to-head against competitors across all five diagnostic
categories.

View a sample PDF report

This literally started as a font scanner (the repo is still called font-scanner). I needed to audit typography across client sites. Then I added "just one more analyzer"... five times. Now it's a full diagnostics platform.

Try it
sitemechanic.io — free scans available, no account required.

Would love feedback on what analyzers or report features would be most useful for your workflow.


Top comments (1)

Collapse
 
apogeewatcher profile image
Apogee Watcher

Bringing those checks together makes sense, especially for agency/client workflows. The hard part is usually not the number of audits, but prioritization: which issues block indexing, which hurt UX/conversions, and which are just cleanup. A report becomes much more useful when it groups findings by severity and by page/template, not just by category.