Start · Sprachen · JavaScript · Referenz · PressureObserver.disconnect()

PressureObserver.disconnect()

Methode

Beendet die Beobachtung aller Druckquellen eines <code>PressureObserver</code>. Danach wird der Callback nicht mehr mit neuen <code>PressureRecord</code>-Einträgen aufgerufen.

seit JavaScript Chromium 125+ (Compute Pressure API, experimentell Kategorie: webapi

Signatur

PressureObserver.prototype.disconnect()

Beschreibung

Die Methode disconnect() gehört zur Compute Pressure API. Sie meldet einen PressureObserver bei allen Quellen ab, die vorher mit observe() registriert wurden, zum Beispiel "cpu". Danach ruft der Browser den Callback des Observers nicht mehr auf.

Verwende disconnect(), wenn du keine Druckdaten mehr brauchst: beim Verlassen einer Ansicht, beim Beenden eines Videoanrufs oder beim Abbau einer Komponente, etwa in useEffect-Cleanups oder im disconnectedCallback von Web Components. So sparst du Ressourcen und verhinderst, dass Callbacks auf Objekte zugreifen, die es nicht mehr gibt.

Willst du nur eine bestimmte Quelle abmelden, nimm stattdessen unobserve(source). disconnect() leert außerdem die interne Warteschlange des Observers. Wenn du noch ausstehende Einträge brauchst, hole sie vorher mit takeRecords() ab.

Rückgabewert

Typ
void
Beschreibung
Kein Rückgabewert (undefined).

Beispiele

CPU-Druck beobachten und nach 10 Sekunden beenden

if ('PressureObserver' in globalThis) {
  const observer = new PressureObserver((records) => {
    const last = records.at(-1);
    console.log(`CPU-Zustand: ${last.state}`);
  });

  await observer.observe('cpu', { sampleInterval: 1000 });

  setTimeout(() => {
    observer.disconnect();
    console.log('Beobachtung beendet');
  }, 10_000);
} else {
  console.log('Compute Pressure API nicht verfügbar');
}
CPU-Zustand: nominal CPU-Zustand: fair Beobachtung beendet

Ausstehende Einträge vor dem Trennen sichern

const observer = new PressureObserver((records) => {
  records.forEach((r) => console.log(r.source, r.state));
});
await observer.observe('cpu');

// Später: noch nicht zugestellte Einträge abholen, dann trennen
const pending = observer.takeRecords();
observer.disconnect();
console.log(`Nicht zugestellte Einträge: ${pending.length}`);
Nicht zugestellte Einträge: 0

Aufräumen in einer Web Component

class CpuBadge extends HTMLElement {
  #observer = null;

  async connectedCallback() {
    if (!('PressureObserver' in globalThis)) return;
    this.#observer = new PressureObserver((records) => {
      this.textContent = `CPU: ${records.at(-1).state}`;
    });
    try {
      await this.#observer.observe('cpu');
    } catch (err) {
      this.textContent = 'CPU-Daten nicht verfügbar';
    }
  }

  disconnectedCallback() {
    // Alle Quellen abmelden, sobald das Element aus dem DOM entfernt wird
    this.#observer?.disconnect();
    this.#observer = null;
  }
}

customElements.define('cpu-badge', CpuBadge);

// Wichtig · Fallstricke

  • Browser-Kompatibilität: Die Compute Pressure API gibt es derzeit nur in Chromium-Browsern wie Chrome und Edge (ab Version 125). Firefox und Safari unterstützen sie nicht. Prüfe deshalb vorher, ob 'PressureObserver' in globalThis gilt.
  • Die API funktioniert nur in einem sicheren Kontext (HTTPS). Außerdem kann eine Permissions Policy (compute-pressure) sie blockieren, zum Beispiel in iframes.
  • disconnect() leert die Warteschlange. Einträge, die noch nicht zugestellt wurden, gehen verloren, wenn du sie nicht vorher mit takeRecords() abholst.
  • Du kannst disconnect() mehrfach aufrufen, ohne dass ein Fehler entsteht. Ein erneuter Aufruf von observe() startet die Beobachtung wieder.
  • Um nur eine einzelne Quelle abzumelden, verwende unobserve(source).