Dieser Blog enthält Tipps und Trick zur Performance-Optimierung von Webseiten bei JavaScript, CSS, HTML, PHP und MySQL!
PHP:flush() nach HTML-HeaderDie Funktion
flush() sendet den Inhalt des Ausgabepuffers sofort an den Browser. Führt man diese Funktion direkt nach dem HTML-Header aus, kann der Browser im Header angegebene JS- und CSS-Dateien vorladen, während der <body> noch erstellt wird und übermittelt werden muss. Dies kann je nach Länge des Dokuments das Laden der Seite stark beschleunigen. Unter welchen Ausnahmen die Funktion
flush() nicht seinen Zweck erfüllt, findet ihr in der
PHP-Dokumentation.
Inkrement vs. BerechnungEine Variable durch Inkrementieren um Eins zu erhöhen ist c.a. 30% schneller als eine Erhörung durch +1:
$i++
30% schneller als
$i = $i + 1
Pre-Inkrement vs. Post-Inkrement++$i ist eindeutig schneller als $i++ Dies sollte man vor allem in Schleifen beachten, da diese Operation unter Umständen sehr häufig aufgerufen wird!
Schleifen: for vs. while vs. do-whileDie for-Schleife ist fast doppelt so langsam wie die While-Schleife! Die Do-While-Schleife ist aber noch ein Stück schneller als die While-Schleife. Test (im Durchschnitt):
5,0 Sekunden for ($i=0; $i<1 000 000 000; ++$i) {}
3,0 Sekunden $i=0; while($i<1 000 000 000) {++$i;}
2,8 Sekunden $i=0;do {++$i;} while($i<1 000 000 000);
Array-Index$a['abc'] ist zehn (1000%) mal schneller als $a[abc] (ohne Anführungszeichen)!!!
Kurzschreibweisen bei einfachen Berechnungen$a /= $b; ist 20% schneller als $a = $a / $b;
Singlequotes oder DoublequotesVergleiche haben ergeben, dass 'Singlequotes' ein meist Tick schneller sind als "Doublequotes", auch mit Variablem im String:
Ohne Variablen im String sind 'Singlequotes' schneller, auch bei bis zu drei Variablen lohnt es sich 'Singlequotes' zu verwenden. 'Text'.$v.'Text'.$v.'Text'.$v
Sollte man mehr Variablen im Text haben sind "Doublequotes" schneller. "Text$v Text$v Text$v Text$v Text$v "
Muss man jedoch Variablen aus den Klammern herausnehmen z.B.: "Text".$v."Text".$v."Text$v Text$v Text$v " ist dies wiederum langsamer als die 'Singlequotes'.
MySQL:mysql_pconnect statt mysql_connectDie Funktion
mysql_pconnect versucht im Vergleich zur Funktion
mysql_connect nicht sofort eine neue Verbindung zum MySQL-Server einzurichten, sondern prüft zuerst ob es bereits eine bestehende zum MySQL-Server Verbindung gibt. Zudem wird die Verbindung nach Beenden des PHP-Scripts nicht beendet und kann auch nicht durch
mysql_close beendet werden. In meinem Test über 500% schneller!
SELECT durch Index beschleunigenUm so mehr Datensätze sich in der Datenbank befinden, um so wichtiger wird der Index in MySQL-Spalten. Besonders wichtig ist der Index, wenn man Datensätze anhand Spalte suchen will.
Angenommen wir haben eine Datenbank mit 1 Millionen Datensätzen. Dort wollen wir einen Datensatz suchen, indem in der Spalte "Name" nach dem passenden Namen suchen:
Ohne einen Index der Spalte "Name" kann es im ungünstigsten Fall passieren, dass jeder Datensatz mit dem gesuchten Namen verglichen muss, bis man im 1 Millionsten Datensatz endlich den Namen "Xaver" gefunden hat. Dauert ehwig, ganz klar!
Mit Index sparen wir uns extrem viel Zeit: Für jeden Index wird eine neue Tabelle angelegt die nach der Spalte sortiert ist, also z.B. alphabetisch nach Namen. So kann MySQL nun folgendermaßen vorgehen:
Prüft Datensatz 500 000 (die Mitte von 0 bis 1 Mio) auf Gleichheit mit dem gesuchten Namen bzw. String, trifft dies nicht zu so untersucht er ob der String davor oder danach kommt. In unserem Beispiel danach: Also führt er diese Überprüfung in der Mitte von 500 000 bis 1 Mio usw. bis der richtige Datensatz gefunden wurde.
Dies kann mit dem Modell des
Binären Suchbaums verglichen werden. Die maximale Anzahl von Vergleichen lässt sich durch Aufrunden( logarithmus(anzDatensätze) ). In unserem Fall: maximal 14 Vergleiche anstatt maximal 1 Million! Eine Effizientssteigerung um über 7000%. Dabei gilt um so mehr Datensätze um so höher die Einsparung. Bei einer Billiarde (1 000 000 000 000 000) maximal 35 Vergleiche -> Effizientssteigerung um 28 Milliarden %. Doch auch bei nur 100 Datensätzen ist der Index um 500% Schneller!
Kleiner Nachteil: das Einfügen neuer Datensätze dauert pro Index ein wenig länger, da die sortierte Position ermittelt werden muss. Daher gilt: Index nur wenn für die Suche benötigt!
HTML:Anzahl der externen Scripts einschränkenMöglichst wenig Inline-CSS und -JavaScript verwendenMöglichst geringe Verschachtelungstiefe von DOM-ObjektenKomprimierung von Statischen DateienCache-ControleLast-Modified verwendenKein Etag verwendenCookielänge und -anzahl gering haltenGeeignetes Bildformat und Komprimierung verwendetCSSVerwenden von CSS-SpritesÄhnliches zusammenfassen... um den Code zu kürzen, und damit auch die Ladezeit.
z.B.:
.a { color:red; font-size:14pt; text-align:left; }
.b { color:red; font-size:14pt; text-align:center; }
.c { color:red; font-size:14pt; text-align:right; }
.d { color:red; font-size:14pt; text-align:justify; }
->
.a, .b, .c, .d { color:red; font-size:14pt; }
.a { text-align:left; }
.b { text-align:center; }
.c { text-align:right; }
.d { text-align:justify; }
Hier 43% kürzer!
CSS komprimierenJavaScriptVerwenden eines JavaScript-PackerDurch die Verwendung ein sog. JavaScript-Packer ist es möglich das Datenvolumen des Scripts, und damit die Übertragungszeit deutlich zu verringern. Dabei werden üblicherweise lokale Variablennamen gekürzt und Kommentare entfernt. Manche Packer bieten auch die Base64-Methode an, um den Code (meist) noch mehr zu kürzen und vor allem für den Menschen fast unlesbar zu machen.
Dabei nicht vergessen zuvor eine Kopie des Originalscripts zu erstellen, um den Script in gut lesbarer Form weiterhin zu bearbeiten.
Achtung: Der Code sieht zwar dann unlesbar aus, aber dies hindert einen geschickten Programmierer nicht daran, trotzdem an den Code zu kommen - ein sichere Methode dafür gibt es nicht! Einzige Möglichkeit ist es den Script möglichst kompliziert zu machen, z.B. durch Kurzschreibweise oder Funktions-verschachtelung den Leser durcheinander zu bringen.
++i statt i++ in for-schleifen
for(var i=0; i<1000000000; ++i){} dauert in der ausführung 10,021 Sekunden
for(var i=0; i<1000000000; i++){} dauetr 11,397 Sekunden, das sind rund 13% mehr!
es gilt auch: i-- braucht rund 13% länger als --i!
Aber: in Do-While- und While-Schleifen sind beide c.a. gleich schnell
for vs. while vs. do-while
Die for-Schleife ist fast doppelt so langsam wie die While-Schleife! Die Do-While-Schleife ist aber noch ein Stück schneller als die While-Schleife. Test (im Durchschnitt):
10,001 Sekunden for (var i=0; i<1 000 000 000; ++i) {}
8,769 Sekunden var i=0; while($i<1 000 000 000) {++i;}
6,953 Sekunden var i=0;do {++i;} while(i<1 000 000 000);
Damit zeigt JS das selbe verhalten wie PHP
...