Diese Frage klingt vielleicht komisch, weil die Popstate in den meisten Fällen synchron ausgelöst werden, wenn Benutzer die Zurück-Taste drücken.So behandeln Sie die Schaltfläche "Zurück", wenn der Browser nicht ausgelöst wird Popstate-Ereignis sofort
Die W3C-Spezifikation besagt jedoch, dass ein UA (Browser) den Popstate-Status quittieren darf, wenn traversing history (siehe Punkt 14), d. popstate wird asynchron ausgelöst (obwohl die URL zu diesem Zeitpunkt geändert wurde).
Browser-Anbieter interpretieren und implementieren diese Spezifikation anders. Mozilla decides Firefox sollte popstate vor load auslösen können, und aus guten Gründen, so dass langsame Bilder popstate nicht blockieren werden.
Chrome/Safari anders entscheidet, und es führt unser Problem:
Wenn die Geschichte für einen Web-App verwalten, ist es oft wünschenswert ist, so schnell wie möglich Geschichte Managements, zu kick off, zum Beispiel. unter DOMContentLoaded anstelle von load. Aber im Gegenzug können Benutzer keine pushState zurücksetzen, da alle popstate bis load eingereiht sind.
Wir suchen Ratschläge für Möglichkeiten, mit solchen Szenarien umzugehen. Ich habe ein paar selbst:
- Lazyload Bilder, so
loadkann so schnell wie möglich feuern. - Block UI bis
loadwird gefeuert. - Init-Rahmen auf
loadanstelle vonDOMContentLoaded.
Gibt es bessere Lösungen?
aktualisieren: Dinge hässlich, wenn Ajax sind, dass Feuer vor load, wenn diese Anforderung Ergebnis in DOM ändern und DOM Änderung einige Bilder haben, geschieht, load werden, bis diese Bilder/timeout geladen verzögert wird, was bedeutet, popstate ist noch länger in der Warteschlange.
Update 2: Um eine einfache Demo für sie hinzufügen, um diesen jsbin page mit Chrom besuchen und sehen popstate bis load abgefeuert wird gesperrt. Sie können das Ergebnis zwischen dem zwischengespeicherten Bild und dem nicht zwischengespeicherten Bild vergleichen.
Bei Verwendung der Zurück-Taste sollte 'popstate' immer sofort ausgelöst werden. Der einzige Fall, in dem es nicht ausgelöst wird, ist beim Aktualisieren, aber in diesem Fall sollten Sie sich am besten auf die URI stützen (das ist der Punkt einer Aktualisierung). Ich muss etwas vermissen, aber nicht sicher was. –
@DavidMulder Ich habe eine jsbin Seite hinzugefügt, um das Problem zu demonstrieren. – bitinn
Ah, zumindest bekomme ich jetzt, dass du einen History-State-Wechsel feuere, bevor das "Laden" passiert ist ... Warum machst du das in der Welt?Nur ein Benutzer sollte den Status ändern und das erste Mal, wenn die App die Zurück-Schaltfläche lädt, sollten keine vorherigen anwendungsspezifischen Zustände aufweisen. Daher bin ich völlig verwirrt, was Sie zu tun versuchen. –