Optimierung 3 Bilder nebeneinander in Tab

[starfoxfs]

Hi zusammen,

Ich möchte meinen Quellcode noch ein wenig optimieren da mir die Bilder zu langsam geladen werden bzw immer wieder kurze "Aussetzer" beim laden entstehen.

Angezeigt werden 3 Bilder nebeneinander fortsetzend in while Schleife.

$j = "3";
echo "<table width='100%' border='0' align='center' cellpadding='5' cellspacing='5'>";
echo "<tr>";

$sql = "SELECT NPL, NPLBLK, HMODTYP FROM ".$sqltab2." WHERE HMODTYP = '$mdlidkey' AND NPL = '$bildcode' ORDER BY id";
$result = $db->query($sql)or die(mysql_error());
while ($modell = $db->fetcharray($result))
{

$alt = mysql_fetch_array(mysql_query("SELECT nplblkedit, XPLBLK FROM ".$sqltab4." WHERE NPL = '" .$modell["NPL"]. "' AND NPLBLK = '" .$modell["NPLBLK"]."' ORDER BY id"))or die(mysql_error());

if ($j == 3) { 

   echo "</tr>";
   echo "<tr>";
  
   $j = 0;
}


echo "<td width='100%'><div id='imgborder'><div id='imgbez' align='center' valign='top'>".$alt["nplblkedit"]. "&nbsp;-&nbsp;" .$alt["XPLBLK"]."</div>";
echo "<div id='imagekl' align='center'><a href='?ctg=detail&mdl=".$modell["HMODTYP"]."&picord=".$modell["NPL"]."&pic=".$modell["NPLBLK"]."&auswahl=".$auswahl."' target='_self'><img border='0' width='230' height='116' src='picturesthumb/" .$modell["NPL"]."/IMGE/" .$modell["NPLBLK"].".jpg' title='" .$alt["nplblkedit"]. "&nbsp;-&nbsp;" .$alt["XPLBLK"]. "' alt='" .$alt["nplblkedit"]. "&nbsp;-&nbsp;" .$alt["XPLBLK"]. "'></a></div>";

echo "</div></td>";




$j++;
}

echo "</tr>";
echo "</table>";


?>

Was könnt man hier noch optimieren ? im Firefox wird sofort angefangen die Bilder zu laden, im Internet Explorer hingegen wird erst alles angezeigt wenn alle Bilder geladen sind was meistens wegen vielen Daten 30-40sek dauert was sehr lange ist.

 

[LSd]

Guten Morgen,
der Code ist recht überschaubar. Wie groß sind denn die Bilder?

Gruß

 

[starfoxfs]

so 10kb etwa pro Bild sind schon extra Thumbs der großen Bilder, geladen werden etwa so 30 Stück.

 

[SimonErich]

Thumbs mit 10 KB pro Bild ?
Das erscheint mir doch sehr groß.

Mir würde da jetzt spontan nur vorladen per Javascript einfallen.
Also einfach die ersten 3 Bilder laden lassen und anzeigen lassen und dann mit javascript die nächsten vorladen.

 

[low-group]

innerhalb der Schleife würde ich keine erneute DB-Abfrage machen, sondern dies in der ersten mit einbeziehen per LEFT JOIN e.t.c.
Desweiteren die Ausgabe in der Schleife nicht gleich ausgeben, sondern dies in eine Variable setzen $ausgabe .= .... und das allen zum Schluß ausgeben mit echo $ausgabe;

 

[starfoxfs]

Ok danke werde ich mal probieren

 

[Gumbo]

Du solltest erst einmal die Tabelle sauber aufbauen, etwa:

$j = 0;
echo '<table>';
echo '<tr>';
while (/* … */) {
	if ($j % 3 == 0 && $j > 0) {
		echo '</tr><tr>';
	}
	echo '<td>';
	/*
	  …
	*/
	echo '</td>';
	$j++;
}
while ($j % 3 != 0) {
	echo '<td></td>';
	$j++;
}
echo '</tr>';
echo '</table>';

Oder:

$j = 0;
while (/* … */) {
	if ($j == 0) {
		echo '<table>';
	}
	if ($j % 3 == 0) {
		echo '<tr>';
	}
	/*
	  …
	*/
	if ($j % 3 == 2) {
		echo '</tr>';
	}
	$j++;
}
if ($j > 0) {
	while ($j % 3 != 0) {
		echo '<td></td>';
		$j++;
	}
	echo '</tr>';
	echo '</table>';
}

Letzere ist eigentlich schöner, da die Tabelle nur ausgegeben wird, wenn die Bedingung mindestens einmal erfüllt ist.

 

[starfoxfs]

Ich hab mal deine 2te Variante verwendet @Gumbo aber ich sag mal von der Aufbaudauer im IE dauerts ähnlich lange vll ein klein bisschen schneller. In der Regel brauch der IE hier 40Sek bis überhaupt was angezeigt wird.

Ich bin am überlegen hier noch ein Javascript einzubauen um Loading ... anzuzeigen.

Wenn die Bilder einmal im Cache sind dauerts nichtmal 5 Sek für den Aufbau der Seite.