16 / 20Graphics & canvas
Upload Pipeline
Drag-and-drop images, compress them in a Web Worker, and upload in resumable chunks.
- Web Workers
- OffscreenCanvas
- File APIs
- Chunked uploads
- Progress UX
stirling.lab/upload-pipeline Live demo
Loading demo…
What to notice
- Drag-drop, paste and picker input with instant previews
- Off-main-thread resizing and compression with before/after size savings
- Chunked uploads to a simulated server with pause, resume and retry per file
- Concurrency-limited queue with an accurate overall progress bar
How it's built
- Compression uses createImageBitmap + OffscreenCanvas inside a Worker, falling back to the main thread.
- The queue is a promise pool; each chunk upload honors an AbortSignal.
Hand-built in React 19 + TypeScript, with no UI or chart libraries.