const area = await new Promise((resolve) => {
    window.requestAnimationFrame(() => {
        const { offsetWidth, offsetHeight } = someElement;
        resolve(offsetWidth * offsetHeight);
    });
});

const area = await asyncRaf(() => {
    const { offsetWidth, offsetHeight } = someElement;
    return offsetWidth * offsetHeight;
});

// All callbacks will be execute inside `requestAnimationFrame()`
 
asyncRaf(() => {
    // get some properties that causes page reflow
    const { offsetWidth, offsetHeight } = someElement;
    // return a value to be resolved.
    return offsetWidth * offsetHeight;
});
 
// OR resolve it yourself
asyncRaf((resolve) => {
    // get some properties that causes page reflow
    const { offsetWidth, offsetHeight } = someElement;
    // resolve the value.
    resolve(offsetWidth * offsetHeight);
});
 
// OR use async callback
asyncRaf(async () => {
    // get some properties that causes page reflow
    const { offsetWidth, offsetHeight } = someElement;
    const area = await calculateElementArea(offsetWidth, offsetHeight);
    return area;
});