A frozen page against a worker
Press the two buttons on the page and watch the ticker. The log uses the ticker's count, which is exact: a synchronous loop lets no timer fire. The parse time is not logged.
Your script, layout and painting share one thread, and a long loop freezes all three. A Web Worker runs code on another thread, and OffscreenCanvas lets that thread draw. You learn when this helps, how it fails and when it is not worth it.
Change the code and press Run (Ctrl+Enter). Predict what will happen first, then break it on purpose and read what changes. Your edits are saved and match the lesson page.
Ready for more? This phase has 4 hands-on exercises with automatic checks.
Practice questions
Write the code in the editor, run it, then open the model answer to compare.
Write canUseWorkerCanvas(canvas) that returns true only when OffscreenCanvas and transferControlToOffscreen both exist.
Make the first example's worker answer with the busiest station instead of the mean minutes. What goes in its message?
Explain it without notes
Why did the ticker move 0 times while the main thread parsed?
What can a worker not do, and how does it get data from the page?
Preview
Console
Nothing logged yet.Expected console output
main thread: 400,000 rows, mean 26.50 minutes
ticker moved while the main thread parsed: 0
worker: 400,000 rows, mean 26.50 minutes
ticker moved while the worker parsed: yes