Case study
LoudMetric
A privacy-first, self-hosted web analytics platform built with TypeScript and Postgres. It tracks actual section-level reading engagement and Core Web Vitals without using cookies, persistent identifiers, or heavy client-side charting libraries.
What it is
LoudMetric is a self-hosted, cookie-free analytics tool designed for operators who want deep insights without compromising visitor privacy. Unlike mainstream analytics platforms that require a choice between accurate tracking and user privacy, LoudMetric rejects persistent tracking entirely. It uses a daily rotating salt to hash IP addresses and user agents, meaning a visitor's journey cannot be linked across different days. Despite this constraint, it still captures high-value metrics that most cookieless tools miss: real Core Web Vitals (LCP, CLS, INP) via PerformanceObserver, and section-level engagement tracking to show exactly which parts of a page were read and for how long.
How it is built
The codebase is built on TypeScript, Node.js, and PostgreSQL. The tracking script is a single, dependency-free JavaScript file that runs in the browser. On the backend, data is ingested through a Next.js API route and stored in a PostgreSQL database partitioned monthly to keep queries fast and retention management simple (dropping old partitions instead of running heavy DELETE queries). Instead of pulling in heavy charting libraries like Recharts, which would add hundreds of kilobytes to the frontend bundle, the dashboard uses hand-built SVG elements to render charts and funnels, keeping the entire dashboard bundle under 100kB.
Key architectural decisions
To optimize performance and security, the ingest endpoint reads incoming payloads as 'text/plain'. This prevents browsers from issuing CORS preflight OPTIONS requests, reducing network overhead and rejecting unauthorized cross-origin POST requests early. Additionally, the platform includes a built-in anomaly detection mechanism that compares daily traffic against the same weekday over the previous eight weeks using median and median absolute deviation, avoiding the need for complex machine learning models or external API calls.
What I learned
- Building custom SVG charts from scratch is highly effective for keeping frontend bundles lightweight while retaining full control over the visual presentation.
- Using text/plain for analytics ingest endpoints successfully avoids browser CORS preflight requests, significantly lowering server load during high-traffic events.
- Postgres table partitioning by month makes data retention policies straightforward to enforce via partition dropping rather than slow, resource-intensive row deletions.
What it doesn't do yet
Listed deliberately — a project's limits are as useful to a reviewer as its features.
- Cross-day visitor journeys are impossible to track by design, as the hashing salt rotates daily.
- Bot filtering relies on user-agent signatures and exclusion lists rather than JavaScript challenges, meaning some sophisticated bots may bypass the filter.
- Requires manual setup or a monthly cron job to run the partition maintenance script to ensure new monthly tables are created.