Self-hosted Web Media Player
A FastAPI + React media server I built because nothing off-the-shelf streamed my video collection the way I wanted. Hover previews, scrub-bar previews, on-demand HLS - all lazy, all cached, all snappy.
Why
A big video collection on a disk attached to my home server. I wanted to watch it from any device without copying files or fighting Plex. Off-the-shelf options didn't match how I had things laid out, so I wrote my own. The interesting work was making it feel like YouTube on a home box that pre-transcodes nothing.
What makes it not boring
Hover Previews
Generates a single WebM per video: 20 clips sampled across the duration, concatenated. Uses WebM instead of heavy GIFs.
Scrub-bar Previews
Tiled JPEG plus WebVTT cue map, preloaded on VTT request so browser cache is warm before first hover.
On-demand HLS
Playlists and TS segments synthesised at request time via FFmpeg, saving home server disk storage.
Lazy Caching
Thumbnails, previews, and sprite sheets generated lazily in background threads, keeping page load instant.
Key Metrics
- preview format
- WebM (VP8)
- scrub bar
- VTT sprite sheets
- streaming
- on-demand HLS