Developer Tool · npm Registry · Compare Surface · 2026 · Solo — pure TypeScript diffPackage architecture, semver classification, dep delta sorting, Compare surface design, TDD (35 tests), Vercel production deployment

Pkg Delta

A browser-local npm package version comparator: pure TypeScript diffPackage engine, live npm registry fetch, semver bump classification (MAJOR/MINOR/PATCH/DOWNGRADE), sorted delta grids for deps/devDeps/peerDeps/scripts, and key manifest field diff — no diff library, no server.

The problem

Developers deciding whether to upgrade a dependency need to know: what dependencies changed? Did the license change? Were new peer requirements added? Today that means manually opening two npm registry tabs and comparing. Pkg Delta does it in one click: type a package name and two version numbers, get a complete structured diff from the public registry API.

Architecture

Key decisions

01

Pure TypeScript diff engine — no diff library

parseSemver, classifyBump, diffDeps, and diffPackage are implemented from scratch in ~150 lines of TypeScript with zero runtime diff dependencies. This makes the engine fully unit-testable, eliminates supply-chain attack surface, and guarantees all computation stays in the browser.

02

Semver bump classification with DOWNGRADE detection

classifyBump returns MAJOR, MINOR, PATCH, SAME, DOWNGRADE, or UNKNOWN. DOWNGRADE is explicit — when the 'to' version is lower than 'from' on any axis, the row is colored rose and labeled DOWNGRADE rather than silently misclassified as a patch. UNKNOWN handles workspace:, file:, and git URL specifiers gracefully.

03

Compare surface: sorted by bump severity, not alphabetically

diffDeps sorts output MAJOR > MINOR > PATCH > added > removed > DOWNGRADE > UNKNOWN, then alphabetically within each group. This means the highest-risk changes (MAJOR bumps) appear at the top of every delta table, matching the developer's mental model of 'what do I need to review first?'

04

TDD — 35 tests written before implementation

All engine functions (parseSemver, classifyBump, diffDeps, diffPackage) were specified as tests first. The suite covers semver parsing edge cases (range prefixes, pre-release suffixes, git URLs), bump classification including DOWNGRADE, dep delta sorting, and the full diffPackage contract. Each test was confirmed failing before the corresponding function was written.

Metrics

35 TDD tests
All pass
0 lint errors
ESLint clean
0 build errors
Next.js production build
0/10
Slop audit score