HTML5 HTML5 Web Workers 2 — Questions and Answers
Question 1: What is a Shared Worker in HTML5, and how does it differ from a Dedicated Worker?
- A Shared Worker can be accessed by multiple scripts from different windows or tabs of the same origin (Correct answer)
- A Shared Worker runs on the server rather than the client
- A Shared Worker has access to the DOM, unlike a Dedicated Worker
- A Shared Worker automatically syncs data between browser tabs using localStorage
Correct answer: A Shared Worker can be accessed by multiple scripts from different windows or tabs of the same origin
Unlike a Dedicated Worker that is tied to one script, a Shared Worker can be shared across multiple browsing contexts (tabs, iframes) from the same origin.
Question 2: Which event fires on the main thread when a Web Worker encounters an uncaught error?
- onerror (Correct answer)
- onfail
- onexception
- oncatch
Correct answer: onerror
The 'onerror' event handler on the worker instance is triggered when the worker script throws an unhandled exception.
Question 3: What function is used to import external scripts inside a Web Worker?
- importScripts('script.js') (Correct answer)
- require('script.js')
- import 'script.js'
- load('script.js')
Correct answer: importScripts('script.js')
importScripts() is a synchronous function available in worker scope that loads and executes one or more external JavaScript files.
Question 4: What is the key advantage of using Transferable Objects with postMessage() in Web Workers?
- The data is transferred by reference (zero-copy), making it much faster for large data like ArrayBuffers (Correct answer)
- Transferable Objects allow workers to directly access the DOM
- They enable workers to communicate with external servers without CORS restrictions
- They compress data automatically before transferring to reduce memory usage
Correct answer: The data is transferred by reference (zero-copy), making it much faster for large data like ArrayBuffers
Transferable Objects like ArrayBuffers are moved (not copied) between threads, so the transfer cost is O(1) regardless of data size.
Question 5: Which Web Worker type is specifically designed to act as a network proxy and enable offline capabilities?
- Service Worker (Correct answer)
- Shared Worker
- Dedicated Worker
- Background Worker
Correct answer: Service Worker
Service Workers act as a proxy between the browser and network, enabling features like offline caching, push notifications, and background sync.
Question 6: How do you safely close a Web Worker from within the worker script itself?
- self.close() (Correct answer)
- self.terminate()
- self.exit()
- self.stop()
Correct answer: self.close()
Inside a worker, self.close() gracefully shuts down the worker, discarding any queued tasks in the event loop.
Question 7: What does the 'message' event's 'data' property contain when received in a Web Worker?
- The value passed to postMessage() by the sender, structured-cloned (Correct answer)
- A reference to the main thread's window object
- The origin URL of the page that created the worker
- A stream object for reading large payloads
Correct answer: The value passed to postMessage() by the sender, structured-cloned
The data property on the MessageEvent contains a structured clone of the value passed to postMessage(), supporting complex objects like arrays and objects.
What is a Shared Worker in HTML5, and how does it differ from a Dedicated Worker?