Technik für die Priorisierung von Bild-Download im Web-Browser

Ich habe eine Webseite, die viele Miniaturbilder (etwa 100) enthält. Wenn Sie auf eines der Miniaturbilder klicken, wird ein modales Popup erstellt, das eigentlich eine neue Webseite innerhalb eines Iframes ist. Diese neue Webseite enthält 1 großes Bild.Technik für die Priorisierung von Bild-Download im Web-Browser

Das Problem tritt auf, wenn der Benutzer das Popup öffnet, bevor alle 100 Thumbnails auf der übergeordneten Seite heruntergeladen haben. Der Benutzer muss jetzt lange warten, bis er das große Bild im Popup sehen kann, da der Browser nicht weiß, ob er dieses neue Bild über die Vorschaubilder, die es bereits abzurufen versucht, priorisiert.

Irgendwelche Gedanken zu einer Lösung für dieses Problem?

Quelle

2012-08-16 cbp

Können wir die Webseite sehen? Meine Hauptfrage ist, ob die Thumbnails vorgeneriert wurden oder auf der Clientseite verkleinert werden. –

Sind alle Bilder beim Laden der Seite über dem Falz sichtbar? – Paul

Die Seite befindet sich in einem Intranet. Nicht alle Bilder sind über der Falte, einige sind darunter. Die Vorschaubilder sind vorgeneriert. – cbp

Wenn Sie die Seite laden, reiht der Browser 100 Anfragen für die Vorschaubilder. Es gibt keine Möglichkeit, Elemente aus der Anforderungswarteschlange zu entfernen. Je nach Browser können bis zu 6 gleichzeitig angefordert werden (bezogen auf this thread), aber sie werden immer noch vor dem großen Bild des modalen Dialogfelds eingereiht. Was Sie tun können (von demselben Thread aus), ist das Hosten der modalen Dialogbilder in einer separaten Subdomain, so dass der Browser sie in eine separate Warteschlange stellt, als ob sie sich auf völlig verschiedenen Seiten befinden würden. Diese neue Warteschlange könnte gleichzeitig mit Ihren Thumbnail-Anforderungen ausgeführt werden.

Quelle

2012-08-16 22:54:08

Ja, das ist wahrscheinlich die einfachste Lösung – cbp

Interessante Frage. Ich bin noch nie auf eine solche Situation gestoßen. Ein Workaround, der Ihnen in den Sinn kommt, wäre, die Miniaturbilder nur zu laden, wenn der Benutzer sie anzeigt.

Wenn Sie jQuery verwenden, können Sie dieses Plugin versuchen Sie es mit:

Lazy Load Plugin for jQuery

Quelle

2012-08-16 22:52:27

Danke, ja, das ist etwas wert, es zu versuchen. – cbp

Eine Möglichkeit, dies zu beheben, besteht darin, Ihre kleinen Thumbnails zu einem großen gekachelten Bild zu kombinieren, wodurch die Anzahl der Bilder auf der Seite reduziert wird.

Quelle

2012-08-16 22:56:41 tenfour

Ja das würde funktionieren. Wäre aber in unserem Szenario wahrscheinlich ziemlich schwierig, da neue Miniaturansichten häufig erstellt werden (es ist wie ein Dokumentenpostfachsystem, wobei die Vorschaubilder der Dokumente in der Mailbox sind). – cbp

Sie können BASE64-Daten-URI für alle kleinen Bilder verwenden. Ihre Seite kann größer werden, aber in einigen Installationen - ganze Seite geladen wurde schneller.

Die andere Option - laden Sie das große Bild von anderen Subdomain, da die "Warteschlange" von Hostname ist.

Quelle

2012-08-16 22:56:59

Technik für die Priorisierung von Bild-Download im Web-Browser

Antwort

Verwandte Themen