Contains three demos that demonstrate how to get started, expose and use Web Worker API.
Clone the repository and run npm i
.
Build the assets and set up a local HTTP server to demonstrate their use case using npm run dev
.
You can find it in the first demo example.
It demonstrates how to create a web worker and send basic messages from the main thread and back.
You can find it in the second demo example.
This is a bit more complex. The HTML for this demo contains a GIF and a basic form for calculating a fibonnaci number of your choice.
Depending on which button you press, the calculation will happen either on main thread or in a worker.
The point is to demonstrate how a long Javascript task blocks the critical rendering path of the browser.
Note: If you are using Chrome, this might not be clear. The GIF is rendered and painted in another thread as an optimisation. For best results, try Firefox or Safari.
You can find it in the third demo example.
This is a simple demo that demonstrates the use of Typescript with the Web Workers API. Additionally, it uses a useful abstraction for managing the inter-thread communication in the use of Comlink.