← BACK TO WORK

SERBA TESTER APP

A browser-based diagnostic console for keyboard, monitor, speaker, system info, and internet speed.

CATEGORY
Web2 /Diagnostics /Tooling
ROLE Independent Developer
STATUS
COMPLETED
YEAR 2026
ViteJavaScriptNode.js Serverless FunctionsWeb Audio APICanvas

DEMO VIDEO

S DEMO VIDEO IN PREPARATION
00:50

OVERVIEW


Serba Tester App is a diagnostic console that runs entirely in the browser, bundling hardware checks and a realtime internet speed test behind a hash-based router. The frontend is Vite with vanilla JavaScript; the measurement endpoints are Node serverless functions. Its "playful geometric" design system keeps the content grid calm while the surrounding decoration stays loud, with a light paper theme by default and a matching dark theme.

PROBLEM


Checking whether a keyboard, screen, speaker, or connection actually works normally means installing a separate utility for each one, and most browser speed tests only report a single number after the run finishes.

SOLUTION


One browser console covering five diagnostic modules, with deep-linkable routes per module and a speed test that streams its measurements so the gauge, chart, and numbers move throughout the run rather than at the end.

CORE FEATURES


  • Keyboard test: full 104-key layout, realtime feedback, coverage meter, last key-code readout, and a Bongo Cat that reacts to keypresses
  • Monitor test: 12 patterns for dead pixels, backlight bleed, banding, and gradients, with a fullscreen mode
  • Audio test: Web Audio oscillator with frequency and waveform control, realtime visualizer, and left/right channel indicators
  • System info: browser, display, GPU renderer, Web API support, and performance metrics, exportable as JSON
  • Internet speed test: median ping with jitter, parallel download via streamed response bodies, parallel upload counting server-confirmed bytes
  • Selectable test target (Cloudflare or the app server) with keyboard shortcuts and light/dark themes

TECHNICAL CHALLENGES


  • Sampling every 100ms behind a one-second sliding window so a momentary spike no longer skews the reported peak
  • Counting only server-confirmed bytes on upload, because upload progress events just mean the data reached the OS socket buffer
  • Defaulting to an external target on localhost, since measuring against the local API would report loopback speed instead of the actual connection

ROLE & CONTRIBUTION


Frontend architecture and hash router

All five diagnostic modules

Streaming speed-test measurement pipeline

Serverless measurement endpoints

Design system and accessibility pass

TECHNOLOGY STACK


ViteJavaScriptNode.js Serverless FunctionsWeb Audio APICanvas