Always yield to native macro tasks when a virtual task completes

Author: sebmarkbage

packages/scheduler/src/SchedulerFeatureFlags.js

@@ -14,3 +14,5 @@ export const frameYieldMs = 5;
 export const userBlockingPriorityTimeout = 250;
 export const normalPriorityTimeout = 5000;
 export const lowPriorityTimeout = 10000;
+
+export const enableAlwaysYieldScheduler = __EXPERIMENTAL__;

packages/scheduler/src/__tests__/Scheduler-test.js

@@ -199,7 +199,9 @@ describe('SchedulerBrowser', () => {
     runtime.assertLog([
       'Message Event',
       'Task',
-      'Yield at 0ms',
+      gate(flags => flags.enableAlwaysYieldScheduler)
+        ? gate(flags => (flags.www ? 'Yield at 10ms' : 'Yield at 5ms'))
+        : 'Yield at 0ms',
       'Post Message',
     ]);
 
@@ -216,7 +218,13 @@ describe('SchedulerBrowser', () => {
     });
     runtime.assertLog(['Post Message']);
     runtime.fireMessageEvent();
-    runtime.assertLog(['Message Event', 'A', 'B']);
+    if (gate(flags => flags.enableAlwaysYieldScheduler)) {
+      runtime.assertLog(['Message Event', 'A', 'Post Message']);
+      runtime.fireMessageEvent();
+      runtime.assertLog(['Message Event', 'B']);
+    } else {
+      runtime.assertLog(['Message Event', 'A', 'B']);
+    }
   });
 
   it('multiple tasks with a yield in between', () => {
@@ -263,6 +271,10 @@ describe('SchedulerBrowser', () => {
     runtime.assertLog(['Message Event', 'Oops!', 'Post Message']);
 
     runtime.fireMessageEvent();
+    if (gate(flags => flags.enableAlwaysYieldScheduler)) {
+      runtime.assertLog(['Message Event', 'Post Message']);
+      runtime.fireMessageEvent();
+    }
     runtime.assertLog(['Message Event', 'Yay']);
   });
 

packages/scheduler/src/__tests__/SchedulerSetImmediate-test.js

@@ -188,7 +188,13 @@ describe('SchedulerDOMSetImmediate', () => {
     });
     runtime.assertLog(['Set Immediate']);
     runtime.fireSetImmediate();
-    runtime.assertLog(['setImmediate Callback', 'A', 'B']);
+    if (gate(flags => flags.enableAlwaysYieldScheduler)) {
+      runtime.assertLog(['setImmediate Callback', 'A', 'Set Immediate']);
+      runtime.fireSetImmediate();
+      runtime.assertLog(['setImmediate Callback', 'B']);
+    } else {
+      runtime.assertLog(['setImmediate Callback', 'A', 'B']);
+    }
   });
 
   it('multiple tasks at different priority', () => {
@@ -200,7 +206,13 @@ describe('SchedulerDOMSetImmediate', () => {
     });
     runtime.assertLog(['Set Immediate']);
     runtime.fireSetImmediate();
-    runtime.assertLog(['setImmediate Callback', 'B', 'A']);
+    if (gate(flags => flags.enableAlwaysYieldScheduler)) {
+      runtime.assertLog(['setImmediate Callback', 'B', 'Set Immediate']);
+      runtime.fireSetImmediate();
+      runtime.assertLog(['setImmediate Callback', 'A']);
+    } else {
+      runtime.assertLog(['setImmediate Callback', 'B', 'A']);
+    }
   });
 
   it('multiple tasks with a yield in between', () => {
@@ -246,7 +258,13 @@ describe('SchedulerDOMSetImmediate', () => {
     runtime.assertLog(['setImmediate Callback', 'Oops!', 'Set Immediate']);
 
     runtime.fireSetImmediate();
-    runtime.assertLog(['setImmediate Callback', 'Yay']);
+    if (gate(flags => flags.enableAlwaysYieldScheduler)) {
+      runtime.assertLog(['setImmediate Callback', 'Set Immediate']);
+      runtime.fireSetImmediate();
+      runtime.assertLog(['setImmediate Callback', 'Yay']);
+    } else {
+      runtime.assertLog(['setImmediate Callback', 'Yay']);
+    }
   });
 
   it('schedule new task after queue has emptied', () => {

packages/scheduler/src/forks/Scheduler.js

@@ -18,6 +18,7 @@ import {
   userBlockingPriorityTimeout,
   lowPriorityTimeout,
   normalPriorityTimeout,
+  enableAlwaysYieldScheduler,
 } from '../SchedulerFeatureFlags';
 
 import {push, pop, peek} from '../SchedulerMinHeap';
@@ -195,9 +196,11 @@ function workLoop(initialTime: number) {
     currentTask !== null &&
     !(enableSchedulerDebugging && isSchedulerPaused)
   ) {
-    if (currentTask.expirationTime > currentTime && shouldYieldToHost()) {
-      // This currentTask hasn't expired, and we've reached the deadline.
-      break;
+    if (!enableAlwaysYieldScheduler) {
+      if (currentTask.expirationTime > currentTime && shouldYieldToHost()) {
+        // This currentTask hasn't expired, and we've reached the deadline.
+        break;
+      }
     }
     // $FlowFixMe[incompatible-use] found when upgrading Flow
     const callback = currentTask.callback;
@@ -241,6 +244,12 @@ function workLoop(initialTime: number) {
       pop(taskQueue);
     }
     currentTask = peek(taskQueue);
+    if (enableAlwaysYieldScheduler) {
+      if (currentTask === null || currentTask.expirationTime > currentTime) {
+        // This currentTask hasn't expired we yield to the browser task.
+        break;
+      }
+    }
   }
   // Return whether there's additional work
   if (currentTask !== null) {
@@ -458,7 +467,7 @@ let frameInterval = frameYieldMs;
 let startTime = -1;
 
 function shouldYieldToHost(): boolean {
-  if (needsPaint) {
+  if (!enableAlwaysYieldScheduler && needsPaint) {
     // Yield now.
     return true;
   }

packages/scheduler/src/forks/SchedulerFeatureFlags.www.js

@@ -19,3 +19,5 @@ export const {
 export const frameYieldMs = 10;
 export const enableSchedulerDebugging = true;
 export const enableProfiling = __DEV__;
+
+export const enableAlwaysYieldScheduler = false;