Scribd
Upload
18 views16 pages

JS Multi Threadrd

JavaScript is primarily a single-threaded language but can achieve multi-threaded behavior through asynchronous functions and Web Workers. Asynchronous JavaScript allows background tasks to run while the main thread continues processing, utilizing the Event Loop for execution order. Web Workers enable heavy computations in a separate thread, preventing UI freezes and improving performance by offloading tasks from the main thread.

Uploaded by

arjunroy7990
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
18 views16 pages

JS Multi Threadrd

JavaScript is primarily a single-threaded language but can achieve multi-threaded behavior through asynchronous functions and Web Workers. Asynchronous JavaScript allows background tasks to run while the main thread continues processing, utilizing the Event Loop for execution order. Web Workers enable heavy computations in a separate thread, preventing UI freezes and improving performance by offloading tasks from the main thread.

Uploaded by

arjunroy7990
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

Is javascript

a multi-threaded

language?
Single-threaded
JavaScript is traditionally a
single-threaded language, but
thanks to asynchronous
functions and Web Workers, it
can simulate multi-threaded
behavior.

A B C
What is asynchronous
JavaScript?

Asynchronous JavaScript allows


tasks like network requests or
timers to run in the
background, letting the main
thread continue other work. It
uses the Event Loop to
schedule execution when the
main thread is free.
The Event loop
The Event Loop ensures that
our asynchronous code runs
in the correct order.

Microtask
Macrotask

Queue Queue

Event loop
fetch

DOM
Execution Order
 Synchronous Cod
 Microtasks (Promise callbacks
 Macrotasks (setTimeout)
Limitations of
Asynchronous JavaScript

Dependency on the Event Loop:

JavaScript runs on a single


thread, so heavy computations
can block the main thread and
delay asynchronous tasks.

Asynchronous operations rely


on the Event Loop, which might
cause delays under heavy load.


Web Workers solve the main


thread blocking issue.

Web Workers run JavaScript in


a separate thread, allowing
heavy tasks without blocking
the main thread, keeping the
UI responsive.
How does it work?
 Creation:

A Web Worker is created using


the Worker constructor and a
separate JavaScript file for
the worker script.
How does it work?
#" Communication:

The main thread and the Web


Worker communicate through the
postMessage method to send
messages and the onmessage
event to receive them.
Communication
Main Thread

Worker
How does it work?
 Execution:

The worker runs independently


of the main thread, executing
tasks like computations or
data processing. It doesn't
access DOM directly but can
use APIs like XMLHttpRequest
or fetch.
Execution
Main Thread

Worker
How does it work?
 Termination:

Workers can be terminated


explicitly using
[Link]() from the
main thread. Workers also stop
automatically when their
script completes.
Termination
Main Thread

Worker
How can Web Workers help?

[Link] UI Freezes: Run heavy tasks in


the background, keeping the interface
responsive.

Improve Performance: Offload computations


to a separate thread.

Real-Time Data: Handle live updates or


streaming efficiently.

Asynchronous Tasks: Process large data or


complex operations without blocking.

Repeated Tasks: Manage recurring tasks


without overloading the main thread.
Have you ever used Web

Workers in your projects?

If yes, what problems did you


solve with them?



Share your experience in the


comments!

Let’s discuss! Engage with


others and learn more about
using Web Workers effectively.

You might also like