What is the scheduler API and how does it improve INP?

Answer

The Scheduler API (scheduler.postTask()) provides fine-grained control over task execution priority on the main thread. Unlike setTimeout(fn, 0) (always low priority), the Scheduler API allows prioritizing tasks: user-blocking: highest priority — for work critical to user interactions. user-visible: medium — for visual updates the user will see. background: lowest — for non-urgent work. Usage: scheduler.postTask(() => heavyWork(), { priority: "background" }). scheduler.yield(): yield control back to the browser, then resume — crucial for INP: async function handleClick() { updateUI(); await scheduler.yield(); await processBigDataset(); }. By yielding after the initial UI update, the browser can paint the response to the click before the slow computation runs — improving INP. TaskController: cancel or reprioritize tasks dynamically. Impact on INP: breaking long tasks into yielded chunks prevents the 50ms+ blocking that causes poor INP. React 18's concurrent rendering uses a similar internal scheduler. scheduler.yield() is now the recommended way to chunk long tasks in event handlers.