Web Workers — Add Productivity to Your Web Applications
summary
Using Web Workers to move heavy tasks (JSON parsing, image filters, map processing) off the main thread prevents frame drops caused by tasks that take ~80 ms versus the 16 ms budget for 60 FPS. The talk compares worker types (DedicatedWorker vs SharedWorker singleton across tabs), communication methods (structured clone vs transferables) and notes structured-clone can be faster for large payloads and that SharedArrayBuffer was disabled on Jan 5. A demo shows an image-filter app that freezes on the main thread but runs smoothly when the filter runs in a worker, and it recommends a ping-pong warmup for the first messages.
AI-written summary · about
chapters (14)
- 0:00Introduction
- 0:24What are Web Workers
- 1:08JavaScript single-thread limits
- 2:13Slow UI and interface
- 3:41Old solutions vs Web Workers
- 4:27How Web Workers work
- 5:30When not to use Web Workers
- 6:32Data transfer to Web Workers
- 7:55Web Workers libraries
- 9:01React with Web Workers
- 10:06Logic separation with Web Workers
- 11:30Web Workers demo
- 12:58Performance testing tools
- 13:18Summary
related talks
24mWeb Workers - Little Minions At Work for Optimizing Performance
23mMultithreading in Javascript
25mDemystifying Web Workers and Service Workers
24mWeaving Webs of Workers
53mLet the main thread breathe!
13mHow to Use Web Workers for Fun and Profit
28mKeep the Main Thread Free With Web Workers
30mBuild Snappier Apps with React and Web Workers