Ratgeber: Eine geschlossene Ansicht soll keine alten Sichtbarkeitsbeobachter behalten

Eine Galerie wird mehrfach geöffnet

Ein kleines Portal öffnet seine Bildergalerie innerhalb einer wechselnden Seitenansicht. Beim ersten Besuch funktioniert alles. Nach mehreren Wechseln werden jedoch dieselben UI-Aktionen unerwartet mehrfach angestoßen. Bei der Fehlersuche lohnt sich die Frage, ob die alte Beobachtung beendet wurde. MDN dokumentiert disconnect für IntersectionObserver als Methode, die die Beobachtung sämtlicher zugeordneter Ziele dieses Beobachters stoppt. Dieser Ratgeber behandelt den Lebenszyklus einer vorhandenen Schnittstelle und behauptet keine neue technische Veröffentlichung.

Der Ansicht einen Anfang und ein Ende geben

Zeichne den Ablauf deines Übungsprojekts auf: Galerie öffnen, Elemente beobachten, Galerie schließen. Schreibe zu jedem Schritt, welche Ressourcen angelegt werden und wann sie wieder abgegeben werden sollen. Für einen Beobachter, der ausschließlich dieser Galerie gehört, ist das Ende der Ansicht ein naheliegender Aufräumzeitpunkt. Ein Beobachter, den mehrere Bereiche gemeinsam nutzen, erfordert dagegen eine passend abgestimmte Verwaltung. Ein pauschaler Stopp könnte dort noch benötigte Beobachtungen beenden.

Halte im Bauauftrag fest, wem der Beobachter gehört. Diese kleine Verantwortungsfrage ist leichter zu prüfen als ein allgemeiner Satz wie „Speicherlecks vermeiden“. Sie erklärt außerdem, an welcher Stelle der Aufräumcode erwartet wird.

Bereits gestartete Arbeit getrennt betrachten

Stell dir vor, ein Sichtbarkeitshinweis hat bereits einen Bildabruf angestoßen. Das Ende der Beobachtung beantwortet noch nicht, wie deine Anwendung mit einer später eintreffenden Antwort umgeht. Plane deshalb zusätzlich, ob die geschlossene Ansicht Ergebnisse noch verwenden darf. Unser Beispiel verwirft Ergebnisse, die zu einem inzwischen verlassenen Galeriebesuch gehören. Diese Entscheidung ist eigene Anwendungslogik; sie sollte nicht als Wirkung von disconnect ausgegeben werden.

Den Wechsel wiederholen

Öffne und schließe den lokalen Prototyp mehrmals mit denselben neutralen Bildern. Protokolliere testweise, wie viele sichtbare Aktionen bei einem einzigen erneuten Besuch ausgelöst werden. Wiederhole das Schließen, während gerade ein Bild vorbereitet wird. Danach darf keine unerwartete neue Galerieansicht erscheinen. Prüfe außerdem einen zweiten Bereich, der weiterhin funktionieren soll. Der Bauauftrag ist dann vollständig genug, wenn Start, Besitz, Aufräumen und verspätete Ergebnisse beschrieben sind. Ein einzelner API-Aufruf ist ein Baustein; die beobachtete Ansicht benötigt trotzdem einen verständlichen Gesamtlebenszyklus.