Concurrency in React 18

Concurrency in React 18

Concurrency means that tasks can overlap.

To understand concurrency, let’s consider?this example....

Let's use phone calls as an analogy.

No concurrency means that I can only have one phone conversation at a time.

If I talk to My Father, and My Mother calls me, then I have to finish the call with My Father before I can talk with My Mother.

No alt text provided for this image
No Concurrency, I can only talk with one person at same time

Concurrency means that I can have more than one conversation at a time.

For example, I can put My Father on hold, talk to My Mother for a bit, and then switch back to talking to My Father.

No alt text provided for this image
Concurrency

This doesn’t mean that we are talking to two people at the same time. It just means that we can have two or more concurrent calls at the same time and decide which call is more important.

>>> In React18:

You can think of "urgent"?setState?updates as similar to urgent phone calls (e.g. your friend needs your help)..... while transitions are like relaxed conversations that can be put on hold or even interrupted if they're no longer relevant.

For add concurrency feature in React 18 new Hook introduced called as useTransition.

>> useTransition hook can be used to tell react about which state is less important to run or with lower priority.

In next article, I will give how to use useTransition hook in react18 to boost our application performance and makes it even faster.?

要查看或添加评论,请登录

Nirav Makwana的更多文章

  • New Updates in React 18

    New Updates in React 18

    Upgrade React 17 to React 18. React 18 was released in March 2022.

    1 条评论

社区洞察

其他会员也浏览了