diff --git a/playground/index.html b/playground/index.html
index 5112f78..6537985 100644
--- a/playground/index.html
+++ b/playground/index.html
@@ -26,7 +26,7 @@
color: black;
position: relative;
display: inline-block;
- margin-top: 100px;
+ margin-top: 40px;
font-size: 24px;
left: 0;
animation: moveText 0.5s linear infinite;
@@ -50,6 +50,7 @@
+
diff --git a/playground/playground.ts b/playground/playground.ts
index 551b1ac..1d5221b 100644
--- a/playground/playground.ts
+++ b/playground/playground.ts
@@ -43,6 +43,9 @@ document.querySelector('#post-task-background')!.addEventListener('click', () =>
document.querySelector('#post-task-vs-yield-or-continue')!.addEventListener('click', () => {
postTaskVsYieldOrContinue()
})
+document.querySelector('#queue-task')!.addEventListener('click', () => {
+ runQueueTask()
+})
async function run(strategy: SchedulingStrategy, time: number = 1000) {
const start = Date.now()
@@ -60,7 +63,7 @@ async function run(strategy: SchedulingStrategy, time: number = 1000) {
}
async function runPostTask(priority: 'user-blocking' | 'user-visible' | 'background') {
- const totalTime = 1000
+ const totalTime = 5000
const singleTaskTime = 2
const iterations = Math.round(totalTime / singleTaskTime)
for (let i = 0; i < iterations; i++) {
@@ -77,6 +80,14 @@ async function runPostTask(priority: 'user-blocking' | 'user-visible' | 'backgro
}
}
+async function runQueueTask(time: number = 1000) {
+ const start = Date.now()
+ while (Date.now() - start < time) {
+ await new Promise((resolve) => queueTask(resolve))
+ simulateWork()
+ }
+}
+
function simulateWork(): void {
// a 5x5 matrix
const matrixA = [
@@ -119,15 +130,6 @@ function matrixMultiplication(matrix1: number[][], matrix2: number[][]) {
return result
}
-function postTask(): Promise {
- const { promise, resolve } = withResolvers()
- // @ts-ignore
- scheduler.postTask(() => {
- resolve()
- })
- return promise
-}
-
async function postTaskVsYieldOrContinue() {
{
const start = performance.now()
@@ -157,3 +159,15 @@ async function postTaskVsYieldOrContinue() {
console.log(count.toString(), '→ yieldOrContinue()')
}
}
+
+async function postTask(priority?: 'user-blocking' | 'user-visible' | 'background'): Promise {
+ const { promise, resolve } = withResolvers()
+ // @ts-ignore
+ scheduler.postTask(
+ () => {
+ resolve()
+ },
+ { priority },
+ )
+ return promise
+}