Heim > Web-Frontend > HTML-Tutorial > Browserverlauf verstehen

Browserverlauf verstehen

WBOY
Freigeben: 2016-10-11 14:03:15
Original
1564 Leute haben es durchsucht

Dies ist ein grundlegender Artikel, der sich mit einigen verwandten Inhalten der Verlaufsstapelverwaltung in Browsern befasst. Der Grund dafür, dass ich dies schreibe, ist, dass ich kürzlich pushState untersuchen wollte, um zu sehen, welche Probleme auftreten würden, wenn PushState letztendlich den Inhalt des Browser-Verlaufsstapels beeinflusst. Daher habe ich einige Zeit damit verbracht, darüber nachzudenken, wie Browser damit umgehen der Verlaufsstapel. Denn während des Rechercheprozesses habe ich einige wichtige Punkte entdeckt, die mir vorher noch nie aufgefallen waren, also habe ich sie aufgezeichnet.

Demo-Adresse: http://liuyunzhuge.github.io/blog/history/demo1.html

Diese Demo wird für verwandte Tests verwendet, die später in diesem Artikel erwähnt werden. Wenn Sie auch interessiert sind, wird empfohlen, diese Demo jedes Mal in einem neuen Tab zu öffnen, anstatt sie von einem bereits vorhandenen aus zu öffnen Öffnen Sie es im Tab der Webseite, die geöffnet wurde. Da der Tab der Webseite bereits geöffnet ist, enthält der Verlaufsstapel bereits Datensätze zuvor besuchter Webseiten, sodass dies Auswirkungen auf die Ergebnisse des Problems hat testen möchte.

Der Browser zeichnet die besuchten Webseiten im selben Fenster (Tab) auf. Unabhängig davon, ob wir die Webseite auf eine der folgenden Arten ändern, zeichnet der Browser die geänderte Webseite auf, sodass sie weitergeleitet und weitergeleitet werden kann Mit der Zurück-Schaltfläche können Sie schnell zu den besuchten Webseiten wechseln:
1) Geben Sie die Webseitenadresse direkt in die Adressleiste ein.
2) Klicken Sie auf den Hyperlink in der Webseite, um zu anderen zu springen Webseiten; es kann jedoch nicht in neuen Fenstern geöffnet werden;
3) Durch Ändern von location.href über Skripte zu anderen Webseiten springen; dies ist jedoch nicht möglich ein Formular, das an ein neues Fenster gesendet wird.
Kurz gesagt: Solange die Webseite innerhalb desselben Fensters springt, zeichnet der Browser dies auf. Mit Ausnahme der Aktualisierung kann das Längenattribut des Verlaufsobjekts die Gesamtzahl der im aktuellen Fenster gespeicherten historischen Datensätze anzeigen. Auf der vorherigen Demoseite habe ich dieses Attribut nur geändert, wenn sich die Webseite ändert. beim Aktualisieren der Webseite. Diese Eigenschaft wird nicht geändert.

Der Browser verfügt über eine Datenstruktur zum Speichern des Verlaufs der Webseite. Ich nenne ihn den Verlaufsstapel, da seine Struktur der Art und Weise, wie ein Stapel verwendet wird, etwas ähnelt.

Betriebstest eins: Wenn Sie die vorherige Demo-Adresse kopieren und dann die folgenden Schritte im Chrome-Browser ausführen:

Öffnen Sie eine neue Registerkarte. Klicken Sie auf demo2.html. Klicken Sie auf demo3.html.

Der Browser speichert die oben genannten Zugriffsdatensätze auf ähnliche Weise wie in der folgenden Abbildung:

Browserverlauf verstehen

Da sich aktuelle Browser im Multi-Tab-Modus befinden, erstellt der Browser beim Öffnen eines Tabs, auch wenn Sie keine bestimmte Webseite besuchen, ein Stücklistenobjekt für diesen Tab, z. B. das Verlaufsobjekt, und dann das Leerzeichen Die Seite der neuen Registerkarte wird als erster Datensatz im Verlauf verwendet. Sie können also in der letzten Spalte im Bild oben 8 Datensätze sehen, was mit der auf der Demoseite angezeigten Zahl übereinstimmt:

Browserverlauf verstehen

Neben dem Verlaufsstapel verfügt der Browser auch über einen Zugriffszeiger, der die Position der aktuellen Webseite im Verlaufsstapel darstellt. Wenn wir die Webseitenadresse mit den oben aufgeführten Methoden ändern, wird die neue Seite standardmäßig an den Anfang des Verlaufsstapels verschoben und der Zeiger zeigt jedes Mal auf die neueste Webseite, wie in der Abbildung oben gezeigt Wenn die Seite geändert wird, zeigt der Zeiger der aktuellen Seite immer auf den Datensatz oben im Verlaufsstapel, wenn wir die Vorwärts- und Rückwärtsfunktionen des Browsers (einschließlich Schaltflächen, Verknüpfungen, Rechtsklickmenüs usw.) oder die bereitgestellte Option „Go“ verwenden nach Verlauf Die /back/forward-Methoden ändern nicht den Inhalt des Verlaufsstapels, sondern verschieben nur den Zeiger:

1) Die Vorwärtsfunktion/go(1)/forward bewegt den Zeiger nur um eine Position nach oben;

2) Die Rückwärtsfunktion/go(-1)/forward bewegt den Zeiger nur um eine Position nach unten;

3) go(n) bewegt den Zeiger um n Positionen nach oben; go(-n) bewegt den Zeiger um n Positionen nach unten.

Der Browser findet die Webseite im Verlaufsstapel und zeigt sie basierend auf der verschobenen Zeigerposition an. Wenn Sie mit dem

-Vorgang fortfahren, um die Ergebnisse des ersten

zu testen, fahren Sie mit den folgenden Vorgängen fort.

Betriebstest 2:

Klicken Sie sieben Mal auf die Zurück-Schaltfläche des Browsers.

Zu diesem Zeitpunkt nimmt die Speichersituation im Verlaufsstapel des Browsers den folgenden Status an:

Browserverlauf verstehen

Obwohl History.go(n) und History.go(-n) den Zeiger an eine beliebige Position bewegen können, wird der Zeiger nicht bewegt, wenn die zu verschiebende Position den Positionsbereich des Verlaufsstapels überschreitet. Daher wird in den Ergebnissen von Betriebstest 2 der Aufruf von History.go(-100) und History.go(100) nicht funktionieren.

Es gibt zwei weitere Situationen, die den Inhalt des Verlaufsstapels ändern.

Betriebstest 3: Wenn wir den Ergebnissen von Betriebstest 2 folgen und dreimal auf die Schaltfläche „Weiter“ klicken, wechselt der Verlaufsstapel des Browsers in den folgenden Zustand:

Browserverlauf verstehen

Da zu diesem Zeitpunkt weder Betriebstest 2 noch Betriebstest 3 den Inhalt des Verlaufsstapels geändert haben, sollte die Verlaufsstatistik auf der Seite bei korrekter Angabe immer noch 8 sein:

Browserverlauf verstehen

Betriebstest vier: Als nächstes führen wir die folgenden zwei Schritte aus: Klicken Sie auf demo2.html und dann auf demo3.html. Zu diesem Zeitpunkt lautet die Verlaufsstatistik auf der Seite:

Browserverlauf verstehen

history.length hat sich geändert, was darauf hinweist, dass sich auch der Inhalt des Verlaufsstapels geändert hat. Aber warum wird daraus 6 statt 10 (8 2)? Sehen Sie sich zu diesem Zeitpunkt den Status des Browser-Verlaufsstapels an:

Browserverlauf verstehen

Wenn der Browser einen neuen Datensatz in den Verlaufsstapel schiebt, schiebt er ihn direkt hinter den aktuellen Zeiger. Wenn sich andere Datensatzelemente hinter dem aktuellen Zeiger befinden, werden diese verworfen. Dies macht es leicht zu verstehen, warum die Gesamtzahl der historischen Aufzeichnungen nach dem vierten Betriebstest nur 6 beträgt.

Ein weiterer wichtiger Punkt bei der Browserverwaltung von Verlaufsdatensätzen ist, dass die Gesamtzahl der gespeicherten Verlaufsstapel begrenzt ist. Sowohl Chrome als auch Firefox sind auf 50 begrenzt. Wenn die Speichermenge des Verlaufsstapels diesen Grenzwert überschreitet, wird der Speicher der Verlaufsdatensätze fortlaufend gespeichert, d. h. neue Datensätze werden an die Spitze des Stapels verschoben und die unteren Datensätze werden von unten entfernt des Stapels. Durch kontinuierliches Umschalten und Klicken auf Demo1, Demo2, Demo3 und Demo4 auf der Demoseite ändern sich die auf der Seite gedruckten statistischen Informationen nach Erreichen einer bestimmten Anzahl nicht mehr, was bedeutet, dass das historische Datensatzlimit erreicht wurde. Allerdings habe ich in IE11 auf mehr als 100 geklickt und festgestellt, dass es sich immer noch ändert, was darauf hindeutet, dass die Einschränkungen des IE möglicherweise höher sind oder auch nicht. .

In diesem Artikel werden einige Inhalte zur Browserverlaufsverwaltung aufgeführt. Die Analyse kann einige Unvollkommenheiten aufweisen. Ihre Kritik und Korrekturen sind willkommen. Ich hoffe, dass der obige Inhalt Freunden in Not dabei hilft, ihr Verständnis für Geschichte und PushState zu vertiefen:)

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage