DEV Community

Cover image for Using Promise.race usefully
Gajanan Patil
Gajanan Patil

Posted on

Using Promise.race usefully

When doing long running tasks like :-

  1. DB query which may take long time
  2. Reading big files
  3. API which may take long time to complete
  4. Waiting for some event

You may want to stop if the task is taking more time than usual to get completed. In that case Promise.race can be useful.

Puppeteer project uses Promise.race to handle page/network lifecycle events with timeouts during automation.

Here's an example :-

/**
 * A utility function which throws error after timeout
 * @param timeout - timeout in seconds
 * @returns - promise which gets rejected after timeout
 */
function timer(timeout) {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            reject(new Error('❌ failed with timeout'))
        }, timeout * 1000)
    })
}

/**
 * Mock db query which take 5 seconds to complete
 * @returns - query promise
 */
function bigQuery() {
    return new Promise((resolve, reject) => {
        setTimeout(resolve, 5 * 1000)
    })
}

// race both bigQuery and timer tasks
// `Promise.race` can take multiple promises if you want to race them all
Promise.race([
    bigQuery(),
    timer(1)
]).then(() => console.log('✅ Query successful within time limit'))
    .catch(console.error)

// ==> will log '❌ failed with timeout'


// also try running above code by changing timer's timeout value to 6, you will get successful log
Enter fullscreen mode Exit fullscreen mode

Promise returned by Promise.race resolve/rejects with whichever promise in array resolves/rejects first. For more info checkout MDN docs.

You can play with the above code here :-

/** A utility function which throws error after timeout @param timeout - timeout in seconds @returns - promise which gets rejected after timeout */ function timer(timeout) { return new Promise((resolve, reject) => { setTimeout(() => { reject(new Error('❌ failed with timeout')) }, timeout * 1000) }) } /** Mock db query which take 5 seconds to complete @returns - query promise */ function bigQuery() { return new Promise((resolve, reject) => { setTimeout(resolve, 5 * 1000) }) } // race both bigQuery and timer tasks // Promise.race can take multiple promises if you want to race them all Promise.race([ bigQuery(), timer(1) ]).then(() => console.log('✅ Query successful within time limit')) .catch(console.error) // ==> will log '❌ failed with timeout' // also try running above code by changing timer's timeout value to 6, you will get successful log

💡 Let me know in comments other cool ideas using Promise.race

See my projects on Github.

Latest comments (1)

Collapse
 
gajananpp profile image
Gajanan Patil • Edited

Thanks !!!, this looks better. The utility function to race any promise with timeout is useful 👍