Bilder Ladereihenfolge

mani

Beginner

Posts: 3

Sunday, June 7th 2009, 3:58pm

Bilder Ladereihenfolge

Hi !

Ich habe folgendes Problem:
Auf einer Seite werden Miniaturansichten von Bildern geladen.
Wenn man auf sie klickt wird ein Pop-up geöffnet in dem es groß angezeigt wird.
Allerdings sind das locker 100 Miniaturansichten, was eine ganze Weile braucht um zu laden.
Während auf der Hauptseite noch Bilder laden bleibt das Pop-up leer...
Wie kann ich das Pop-up sofort laden, nachdem es angezeigt wird.

MfG,
Mani

vince

Master

Posts: 1,103

Sunday, June 7th 2009, 11:01pm

Hi,

bei so großen Mengen wäre es nicht schlecht die Bilder asynchron nachzuladen.

Handelt es sich um ein übliches java script popup mittels open einem neuen Fenster, oder einem popup eines javascript frameworks oder scripts wie lightroom ?

mani

Beginner

Posts: 3

Monday, June 8th 2009, 1:49pm

Das laden der Bilder ist ermal nicht mein Problem,
sondern dass das Pop-up erst geladen wird wenn die Seite mit der Übersicht fertig geladen ist, was einige Minuten dauern kann.
Wie kann ich das Popup in der "Ladereihenfolge" vorstufen, falls das geht? :wacko:

Es ist normales Javascript "open" Popup
Ausserdem verwende ich PHP um aus einem Ordner mit Fotos via "scandir" alle Dateien herauszulesen.

Torben Brodt

Administrator

Posts: 8,454

Monday, June 8th 2009, 7:31pm

Hi,
wo hast du das Nadelöhr ausgemacht? Ist es die Dateigröße oder die Aufrufdauer? (oder gar die absurde Anzahl an HTTP Requests)
Ich habe das Gefühl du erstellst die Thumbnails on the fly. Der Rechenaufwand ist also das Nadelöhr.
Lösung hierzu ist Caching.

Eine weitere Optimierung ist das asynchrone Nachladen von Bildern.
Das heißt, dass du statt 100 Bildern auf einmal nur 20 anzeigst. Und dann mit Pfeiltasten herumnavigierst.
Die neuen Bilder platzierst du mit JavaScript.

Wenn du gezwungen bist 100 Bilder zu platzieren, dann solltest du alle Miniaturbilder in eine große Grafik packen.
Die Grafik verschiebst du dann mit background-position hin und her.
Das spart Dateigröße und HTTP Requests. Ist aber mit großem Programmieraufwand verbunden.

Latest blogs: Neuer EX4 Server, Java EE Summit im Juni in München, Kostenlos zur Cebit + Windows 8 Entwickler Schulung

mani

Beginner

Posts: 3

Tuesday, June 9th 2009, 6:55am

Nein, ich habe einen Ordner mit Thumbnails und einen mit Originalen.
Auf der ersten Seite werden alle Bilder in Miniatur angezeigt und mit den Originalen verlinkt,
wobei man dann auf die zweite Seite kommt.
Auf dieser werden dann links und rechts 2 Vorschaubilder und in der Mintte das Original angezeigt.
Ausserdem noch 2 Pfeile zum Bild weiter schalten.

Aber ist nicht mehr so wichtig, hab jetzt nur mehr 1 Fenster.
Den fensterinhalt jedesmal mit location.href geändert.
So gibt es kein Ladeproblem mehr

This post has been edited 1 times, last edit by "mani" (Jun 9th 2009, 1:51pm)