async-await generally or any method which returns an instance of Promise class
You might be very familiar with
Promise.allSettled but you probably do not use
Promise.race much so today I will be focus on one good use case where you can use
What is Promise race?
Promise race is a special type of method that takes an array of methods as an input and returns a promise that resolved an output of one method that returns at first only.
Promise.all it does not return an array of output but returns a single value which returns whatever works first
If I ran this program the result would be:
[ 'one', 'two', 'three' ]
And if I switch from
Promise.race then the output would be:
This is because
three has the least time to run. If you compare them with other promises. In the general brief, Promise.race would take the output of first promise that is resolved based on it’s time of execusion
there are no build-in method for a timeout so we would create a workaround for it using
How to timeout a method after some time?
Let’s take a good example for
Promise.race . To construct this, let’s say we want to create a method that should be self timeout out after some duration. To tackle this use case we can make use of
Promise.race . Let’s see how
Let’s look at this method,
here we have a regular method named
promiseThatWillTakeMoreTime and it has an execution time of 1000ms and against it, one more method that will take a timeout value and return the rejected value of Request timed out after the time has reached named
That will work flowless! For timeout more than 1000, the result will be
output - this is a heavy function which return promise
and for less than 1000 timeout the result would be an error as
Error: Request timed out
Great! but can we create a good-looking approach for this? Yes, we can
Create a prototype method for the promise
we will keep the
rejectSleep the method as it is but will add a new prototype in Promise to make use of it across all the scope something like
Great job! now we have a new promise method that will return the same output as above and can make any function with a custom timeout
You can also create a method that will return the Promise.race instance but I would prefer it be on prototype level
There are many ways you can create your method and prototype that will serve you the same output. You can choose whatever is best fit for you
I hope this article will help you to tackle some more good use-case revolving around this and get that done. Thanks for reading.
Build component-driven. It’s better, faster, and more scalable.
Forget about monolithic apps, start building component-driven software. Build better software from independent components and compose them into infinite features and apps.
Building a React Component Library — The Right Way
Create an ultra-modular React component library: scalable, maintainable, and with a blazing-fast setup.
7 Tools for Faster Frontend Development in 2022
Tools you should know to build modern Frontend applications faster, and have more fun.