xinglie.github.io icon indicating copy to clipboard operation
xinglie.github.io copied to clipboard

requestAnimationFrame

Open xinglie opened this issue 1 year ago • 2 comments



let testSync = () => {
    let last;
    let raf = time => {
        if (last) {
            console.log(time - last);
        }
        last = time;
        requestAnimationFrame(raf);
    };
    requestAnimationFrame(raf);
}

testSync();



let testAsync = () => {
    let last;
    let raf = async time => {
        if (last) {
            let diff = time - last;
            if (diff <= 5) {
                console.log('diff', diff);
            }
        }
        last = time;
        await Promise.resolve();
        requestAnimationFrame(raf);
    };
    requestAnimationFrame(raf);
};

testAsync();

let testAsync2 = async () => {
    let last;
    let raf = time => {
        if (last) {
            console.log(time - last);
        }
        last = time;
    };
    requestAnimationFrame(raf);
    await Promise.resolve();
    requestAnimationFrame(raf);
};

testAsync2();

let testSync3 = () => {
    let {
        port1, port2
    } = new MessageChannel();
    let exec;
    port1.onmessage = () => {
        exec?.();
    };
    let last;
    let raf = time => {
        if (last) {
            console.log(time - last);
        }
        last = time;
        exec = () => {
            requestAnimationFrame(raf);
        };
        port2.postMessage(null);
    };
    requestAnimationFrame(raf);
}

testSync3();

xinglie avatar Oct 27 '24 04:10 xinglie

https://issues.chromium.org/issues/41292070

xinglie avatar Nov 09 '24 05:11 xinglie

https://github.com/whatwg/html/issues/2569

xinglie avatar Nov 11 '24 06:11 xinglie