PHP Speedy: Javascript in den Footer

3. September, 2009 · 2 Kommentare

PHP Speedy ist eine ganz feine Sache – es komprimiert automatisch verschiedene Javascripts in eine einzelne Datei, was die Requests reduziert und die Ladezeit verkürzt. Allerdings hat es ein kleines Manko: Es beachtet die Design-Richtlinie Javascript ans Dokumenten-Ende nicht. So kann man das beheben:

Die Datei php_speedy/controller/compressor.php öffnen und dort zu Zeile 431 springen. Dort sollte etwas in der Form stehen:

$source = preg_replace("!<head([^>]+)?>!is","$0 \n".$newfile."\n",$source)

Das ändern wir in:

if(preg_match("/<script/",$newfile)) {
	$source = preg_replace("!</body>!is","\n".$newfile."\n $0",$source);
} else {
	$source = preg_replace("!<head([^>]+)?>!is","$0 \n".$newfile."\n",$source);
}

Somit wird die komprimierte CSS Datei am Anfang geladen und die Javascript Datei am Ende. Als Resultat wirkt der Page Load subjektiv schneller. Das liegt daran, dass man früher etwas sehen kann, da der Browser das Rendern schon beginnt bevor die Javascript Datei geladen ist.

Ihren XING-Kontakten zeigen Artikel bei Xing veröffentlichen
Kategorie:Performance · PHP · Tipps · Webdev
Tags: · · ·
  • Matthias

    muss man den cache dann noch einmal leeren, damit das tool richtig funktioniert? mir ist nicht aufgefallen, dass die seite jetzt schneller geladen wird.

    glg matthias

  • http://hjacob.com/ Hendrik Jacob

    Hi Matthias,

    Cache leeren macht Sinn (hab ich vergessen zu erwähnen, sorry).

    Der Effekt ist allerdings auch sehr unterschiedlich von Seite zu Seite. Umso mehr Inhalt die Seite hat und umso mehr Javascript Code, desto merklicher der Unterschied.

    Hier eben nen Zitat von den Yahoo Best Practices:

    Put Scripts at the Bottom
    ——————-
    The problem caused by scripts is that they block parallel downloads. The HTTP/1.1 specification suggests that browsers download no more than two components in parallel per hostname. If you serve your images from multiple hostnames, you can get more than two downloads to occur in parallel. While a script is downloading, however, the browser won’t start any other downloads, even on different hostnames.
    In some situations it’s not easy to move scripts to the bottom. If, for example, the script uses document.write to insert part of the page’s content, it can’t be moved lower in the page. There might also be scoping issues. In many cases, there are ways to workaround these situations.
    An alternative suggestion that often comes up is to use deferred scripts. The DEFER attribute indicates that the script does not contain document.write, and is a clue to browsers that they can continue rendering. Unfortunately, Firefox doesn’t support the DEFER attribute. In Internet Explorer, the script may be deferred, but not as much as desired. If a script can be deferred, it can also be moved to the bottom of the page. That will make your web pages load faster.

meet me in the interwebs
Kaffee-Kasse
Flattr ist ein sehr gut gemachter Micropayment Dienst, der es endlich ermöglicht auf faire Weise Geld zu spenden und einzunehmen.