Signatur
Beschreibung
navigator.scheduling gibt das Scheduling-Objekt des aktuellen Dokuments zurück. Dieses Objekt hat derzeit genau eine Methode: isInputPending(). Sie meldet, ob in der Ereigniswarteschlange Eingabeereignisse wie Klicks, Tastendrücke oder Touch-Ereignisse warten, die der Browser noch nicht an die Seite ausgeliefert hat.
Das ist bei lang laufenden JavaScript-Aufgaben nützlich, zum Beispiel beim Verarbeiten großer Datenmengen, beim Rendern langer Listen oder bei aufwendigen Berechnungen. Früher musste man solche Arbeit in feste Blöcke aufteilen und nach jedem Block pauschal über setTimeout() die Kontrolle an den Browser zurückgeben. Mit isInputPending() gibt man nur dann ab, wenn tatsächlich eine Eingabe wartet. So bleibt die Seite reaktionsschnell, und die Arbeit ist insgesamt schneller erledigt.
Die Eigenschaft ist schreibgeschützt und nimmt keine Parameter. Da sie nur in Chromium-basierten Browsern verfügbar ist, sollte man sie immer über Feature Detection nutzen, etwa mit 'scheduling' in navigator. Andere Browser brauchen einen Ersatzweg, zum Beispiel festes Abgeben nach einem Zeitbudget.
Rückgabewert
Scheduling-Objekt mit der Methode isInputPending(options). Die Methode gibt true zurück, wenn Eingabeereignisse warten, sonst false. In Browsern ohne Unterstützung ist die Eigenschaft undefined.Beispiele
Unterstützung prüfen
const hatScheduling = 'scheduling' in navigator &&
typeof navigator.scheduling.isInputPending === 'function';
console.log(hatScheduling
? 'isInputPending() verfügbar'
: 'Nicht unterstützt – Ersatzweg verwenden');
Lange Aufgabe nur bei wartender Eingabe unterbrechen
const pause = () => new Promise((resolve) => setTimeout(resolve, 0));
const verarbeiteAlle = async (eintraege, verarbeite) => {
const BUDGET_MS = 50; // Zeitbudget als Ersatzweg für andere Browser
let start = performance.now();
for (const eintrag of eintraege) {
verarbeite(eintrag);
const eingabeWartet = navigator.scheduling?.isInputPending?.() ?? false;
const budgetAufgebraucht = performance.now() - start > BUDGET_MS;
if (eingabeWartet || budgetAufgebraucht) {
await pause(); // Kontrolle an den Browser zurückgeben
start = performance.now();
}
}
};
const daten = Array.from({ length: 100_000 }, (_, i) => i);
let summe = 0;
verarbeiteAlle(daten, (n) => { summe += Math.sqrt(n); })
.then(() => console.log('Fertig:', Math.round(summe)));
Kontinuierliche Ereignisse einbeziehen
// Standardmäßig werden mousemove/pointermove u. ä. ignoriert.
// Mit includeContinuous: true zählen sie ebenfalls.
const sollteAbgeben = () =>
navigator.scheduling?.isInputPending({ includeContinuous: true }) ?? false;
document.addEventListener('pointermove', () => {});
setTimeout(() => {
const ende = performance.now() + 2000;
while (performance.now() < ende) {
if (sollteAbgeben()) {
console.log('Eingabe wartet – Schleife beenden');
break;
}
}
}, 0);
// Wichtig · Fallstricke
- Kompatibilität: Die Funktion ist experimentell und nur in Chromium-Browsern ab Version 87 verfügbar. Firefox und Safari unterstützen sie nicht, deshalb immer Feature Detection und einen Ersatzweg einplanen.
- Empfohlene Alternative: Das Chrome-Team empfiehlt inzwischen eher
scheduler.yield()bzw.scheduler.postTask()(Prioritized Task Scheduling API). DennisInputPending()berücksichtigt keine anderen wichtigen Arbeiten wie Rendering oder Netzwerk-Callbacks, sondern nur Eingaben. isInputPending()gibt nur Auskunft. Es gibt die Kontrolle nicht selbst an den Browser zurück. Die Aufgabe muss man danach aktiv beenden oder pausieren, etwa mitawaitaufsetTimeoutoderscheduler.yield().- Die Methode kann auch
falseliefern, obwohl eine Eingabe wartet, zum Beispiel bei Ereignissen aus fremden Frames (Cross-Origin-iframes). Das verhindert, dass Informationen über andere Herkünfte nach außen dringen. - Die Eigenschaft ist nur im Fensterkontext verfügbar, nicht in Web Workern.