Leverage scheduler.yield in splitTask when available (WordPress#66001)

* Leverage scheduler.yield in splitTask when available

* Eliminate extra Promise when using scheduler.yield()

Co-authored-by: swissspidy <[email protected]>

* Avoid needlessly re-checking whether scheduler.yield() is defined

* Remove needless function wrapper

* Ensure that scheduler is context object to yield function

* Remove needless async

* Reduce verbosity of scheduler.yield() existence check

* Fix return type for scheduler.yield()

Co-authored-by: Brendan Kenny <[email protected]>

* Define scheduler and scheduler.yield as optional

Co-authored-by: Brendan Kenny <[email protected]>

---------


Unlinked contributors: brendankenny, LeszekSwirski.
Co-authored-by: felixarntz <[email protected]>

packages/interactivity/src/utils.ts

@@ -22,6 +22,14 @@ interface Flusher {
 	readonly dispose: () => void;
 }
 
+declare global {
+	interface Window {
+		scheduler?: {
+			readonly yield?: () => Promise< void >;
+		};
+	}
+}
+
 /**
  * Executes a callback function after the next frame is rendered.
  *
@@ -48,12 +56,14 @@ const afterNextFrame = ( callback: () => void ) => {
  *
  * @return Promise
  */
-export const splitTask = () => {
-	return new Promise( ( resolve ) => {
-		// TODO: Use scheduler.yield() when available.
-		setTimeout( resolve, 0 );
-	} );
-};
+export const splitTask =
+	typeof window.scheduler?.yield === 'function'
+		? window.scheduler.yield.bind( window.scheduler )
+		: () => {
+				return new Promise( ( resolve ) => {
+					setTimeout( resolve, 0 );
+				} );
+		  };
 
 /**
  * Creates a Flusher object that can be used to flush computed values and notify listeners.