Vollansicht: Schnelleres Laden bei js und css
Hier der Link zu einer Möglichkeit, das Laden von css und js zu beschleunigen.
Super Sache! 
Funktioniert klasse...
Funktioniert klasse...
Klasse Idee und doch so einfach,
danke für den Link.
Gruß
danke für den Link.
Gruß
... nur so als Nachtrag.
Hier dazu meine Änderung der /backend/inc/inc.generate_code.php
Vorher:
Nacher:...
Und die .htaccess anpassung:
Habe damit >50% Ladezeit gesparrt
Gruß
Hier dazu meine Änderung der /backend/inc/inc.generate_code.php
Vorher:
CODE
//JS and CSS file include
$sql = "SELECT
C.filetype, D.dirname, B.filename
FROM
". $cms_db['lay_upl'] ." A
LEFT JOIN ". $cms_db['upl'] ." B USING(idupl)
LEFT JOIN ". $cms_db['filetype'] ." C USING(idfiletype)
LEFT JOIN ". $cms_db['directory'] ." D on B.iddirectory=D.iddirectory
WHERE
idlay='$idlay'";
$db->query($sql);
while ($db->next_record()) {
if ($db->f('filetype') == 'js') $code .= <script src=\"".$db->f('dirname').$db->f('filename')."\" type=\"text/javascript\"></script>\n";
if ($db->f('filetype') == 'css') $code .= "<link rel=\"StyleSheet\" href=\"".$db->f('dirname').$db->f('filename')."\" type=\"text/css\" ".$sf_slash_closing_tag.">\n";
}
$code .= "<script type=\"text/javascript\">\n";
...
$sql = "SELECT
C.filetype, D.dirname, B.filename
FROM
". $cms_db['lay_upl'] ." A
LEFT JOIN ". $cms_db['upl'] ." B USING(idupl)
LEFT JOIN ". $cms_db['filetype'] ." C USING(idfiletype)
LEFT JOIN ". $cms_db['directory'] ." D on B.iddirectory=D.iddirectory
WHERE
idlay='$idlay'";
$db->query($sql);
while ($db->next_record()) {
if ($db->f('filetype') == 'js') $code .= <script src=\"".$db->f('dirname').$db->f('filename')."\" type=\"text/javascript\"></script>\n";
if ($db->f('filetype') == 'css') $code .= "<link rel=\"StyleSheet\" href=\"".$db->f('dirname').$db->f('filename')."\" type=\"text/css\" ".$sf_slash_closing_tag.">\n";
}
$code .= "<script type=\"text/javascript\">\n";
...
Nacher:...
CODE
//JS and CSS file include
$_code = array();
$sql = "SELECT
C.filetype, D.dirname, B.filename
FROM
". $cms_db['lay_upl'] ." A
LEFT JOIN ". $cms_db['upl'] ." B USING(idupl)
LEFT JOIN ". $cms_db['filetype'] ." C USING(idfiletype)
LEFT JOIN ". $cms_db['directory'] ." D on B.iddirectory=D.iddirectory
WHERE
idlay='$idlay'
AND C.filetype IN ('js', 'css')
ORDER BY D.dirname, C.filetype, B.filename";
$db->query($sql);
while ($db->next_record()) {
#if ($db->f('filetype') == 'js') $code .= "<script src=\"".$db->f('dirname').$db->f('filename')."\" type=\"text/javascript\"></script>\n";
#if ($db->f('filetype') == 'css') $code .= "<link rel=\"StyleSheet\" href=\"".$db->f('dirname').$db->f('filename')."\" type=\"text/css\" ".$sf_slash_closing_tag.">\n";
$_code[strval($db->f('dirname'))][strval($db->f('filetype'))][] = $db->f('filename');
}
if (!empty($_code)) foreach($_code as $k => $v) {
if (!empty($v)) foreach($v as $_k => $_v) {
if ($_k == 'js') $code .= sprintf("<script src=\"%1\$s%2\$s\" type=\"text/javascript\"></script>\n", $k, implode(',', $_v));
if ($_k == 'css') $code .= sprintf("<link rel=\"StyleSheet\" href=\"%1\$s%2\$s\" type=\"text/css\"%3\$s>\n", $k, implode(',', $_v), $sf_slash_closing_tag);
}
}
//internal scripts
$code .= "<script type=\"text/javascript\">\n";
...
$_code = array();
$sql = "SELECT
C.filetype, D.dirname, B.filename
FROM
". $cms_db['lay_upl'] ." A
LEFT JOIN ". $cms_db['upl'] ." B USING(idupl)
LEFT JOIN ". $cms_db['filetype'] ." C USING(idfiletype)
LEFT JOIN ". $cms_db['directory'] ." D on B.iddirectory=D.iddirectory
WHERE
idlay='$idlay'
AND C.filetype IN ('js', 'css')
ORDER BY D.dirname, C.filetype, B.filename";
$db->query($sql);
while ($db->next_record()) {
#if ($db->f('filetype') == 'js') $code .= "<script src=\"".$db->f('dirname').$db->f('filename')."\" type=\"text/javascript\"></script>\n";
#if ($db->f('filetype') == 'css') $code .= "<link rel=\"StyleSheet\" href=\"".$db->f('dirname').$db->f('filename')."\" type=\"text/css\" ".$sf_slash_closing_tag.">\n";
$_code[strval($db->f('dirname'))][strval($db->f('filetype'))][] = $db->f('filename');
}
if (!empty($_code)) foreach($_code as $k => $v) {
if (!empty($v)) foreach($v as $_k => $_v) {
if ($_k == 'js') $code .= sprintf("<script src=\"%1\$s%2\$s\" type=\"text/javascript\"></script>\n", $k, implode(',', $_v));
if ($_k == 'css') $code .= sprintf("<link rel=\"StyleSheet\" href=\"%1\$s%2\$s\" type=\"text/css\"%3\$s>\n", $k, implode(',', $_v), $sf_slash_closing_tag);
}
}
//internal scripts
$code .= "<script type=\"text/javascript\">\n";
...
Und die .htaccess anpassung:
QUELLTEXT
#
# Css/Js Rewrite
#
RewriteRule ^cms/css/(.*\.css) combine.php?type=css&files=$1
RewriteRule ^cms/js/(.*\.js) combine.php?type=javascript&files=$1
# Css/Js Rewrite
#
RewriteRule ^cms/css/(.*\.css) combine.php?type=css&files=$1
RewriteRule ^cms/js/(.*\.js) combine.php?type=javascript&files=$1
Habe damit >50% Ladezeit gesparrt
Gruß
@STam
Habe dein Hack mal ausprobiert, aber nun habe ich keine CSS-Angaben mehr
Die combine.php habe ich im ROOT-Ordner reinkopiert.
Die inc.generate_code.php habe ich dementsprechend deiner Angaben geändert.
.htaccess habe ich auch angepasst.
Die css-styles waren zuerst fest im Layout eingefügt - danach nochmal versucht diese über Sefrengo einbinden zu lassen - keine Änderung.
Muss ich beim einbinden deines Hacks noch was beachten.
Habe dein Hack mal ausprobiert, aber nun habe ich keine CSS-Angaben mehr
Die combine.php habe ich im ROOT-Ordner reinkopiert.
Die inc.generate_code.php habe ich dementsprechend deiner Angaben geändert.
.htaccess habe ich auch angepasst.
Die css-styles waren zuerst fest im Layout eingefügt - danach nochmal versucht diese über Sefrengo einbinden zu lassen - keine Änderung.
Muss ich beim einbinden deines Hacks noch was beachten.
Die 'combine.php' braucht die richtigen Rechte.
Zum testen kopiere doch einfach mal (aus dem Quelltext deiner Seite im Browser zB 'http://www.domain.de/cms/css/test.css,standard.css')
den CSS oder JS Aufruf und füge die URL selbst in die Adresszeile des Browsers ein.
Dann könnten wir sehen ob:
1. der Hack funktioniert:
2. der ModRewrite bei dir funktioniert
3. die 'combine.php' (die du Dir schon von hier hast!)
alle nötigen Rechte hat und die Ordner-Einstellungen richtig sind:
... bin gespannt
Gruß
Zum testen kopiere doch einfach mal (aus dem Quelltext deiner Seite im Browser zB 'http://www.domain.de/cms/css/test.css,standard.css')
den CSS oder JS Aufruf und füge die URL selbst in die Adresszeile des Browsers ein.
Dann könnten wir sehen ob:
1. der Hack funktioniert:
QUELLTEXT
<link rel="StyleSheet" href="cms/css/test.css,standard.css" type="text/css" />
2. der ModRewrite bei dir funktioniert
3. die 'combine.php' (die du Dir schon von hier hast!)
alle nötigen Rechte hat und die Ordner-Einstellungen richtig sind:
QUELLTEXT
$cache = true;
$cachedir = dirname(__FILE__) . '/.cache';# zB mit . davor
$cssdir = dirname(__FILE__) . '/cms/css';
$jsdir = dirname(__FILE__) . '/cms/js';
$cachedir = dirname(__FILE__) . '/.cache';# zB mit . davor
$cssdir = dirname(__FILE__) . '/cms/css';
$jsdir = dirname(__FILE__) . '/cms/js';
... bin gespannt
Gruß
Mein Projekt ist local installiert und modrewrite funktioniert, aber daran wird es wohl nicht liegen.
Muss ich die combine.phps auch so unter diesem Namen abspeichern. Ich denke nicht, da der Aufruf in der .htaccess combine.php ist.
So habe ich sie auch im root gespeichert.
Also wenn ich direkt versuche die CSS-Datei aufzurufen (http://localhost/mysefrengo/cms/css/mycss.css) sehe ich den Quellcode der combine.php
- Soll das so sein?
Habe mit Punkt davor und ohne Slash etc... auch ausprobiert - keine Änderung.
Der Cache-Ordner ist auch leer - hmm
Anscheinend habe ich noch irgendwas übersehen.
Muss ich die combine.phps auch so unter diesem Namen abspeichern. Ich denke nicht, da der Aufruf in der .htaccess combine.php ist.
So habe ich sie auch im root gespeichert.
Also wenn ich direkt versuche die CSS-Datei aufzurufen (http://localhost/mysefrengo/cms/css/mycss.css) sehe ich den Quellcode der combine.php
- Soll das so sein?QUELLTEXT
$cache = true;
$cachedir = dirname(__FILE__) . './cache';
$cssdir = dirname(__FILE__) . '/cms/css';
$jsdir = dirname(__FILE__) . '/cms/js';
$cachedir = dirname(__FILE__) . './cache';
$cssdir = dirname(__FILE__) . '/cms/css';
$jsdir = dirname(__FILE__) . '/cms/js';
Habe mit Punkt davor und ohne Slash etc... auch ausprobiert - keine Änderung.
Der Cache-Ordner ist auch leer - hmm
Anscheinend habe ich noch irgendwas übersehen.
@Micylin,
wie ich schon schrieb
Also nicht combine.phps (das s steht für Source).
Rechte; am besten 0755 (es sollte aber auch mit 0644 gehen)!
dann hast du etwas falsch gemacht
Gruß
P.S.:
wie ich schon schrieb
ZITAT
Die 'combine.php' braucht die richtigen Rechte.
Also nicht combine.phps (das s steht für Source).
Rechte; am besten 0755 (es sollte aber auch mit 0644 gehen)!
ZITAT
sehe ich den Quellcode der combine.php ohmy.gif - Soll das so sein?
... Nein,dann hast du etwas falsch gemacht
Gruß
P.S.:
ZITAT
$cachedir = dirname(__FILE__) . './cache';
ZITAT
$cachedir = dirname(__FILE__) . '/.cache';# zB mit . davor
... siehst du da auch einen Unterschied?
Danke Stam!
Es lag am Punkt des Cache-Ordners in der combine.php!
Es lag am Punkt des Cache-Ordners in der combine.php!
Kennt sich jemand gut genug mit Mod-Rewrite aus um mir zu beantworten wie ich diese nette Compression und Kombination auch mit Mod-Rewrite 2 an den start bringe? Derzeit werden die JS und CSS Dateien dann nicht mehr geladen sondern ein 404 Fehler ausgegeben.
Vermute daher, dass sich die Rules beißen! Weiß jemand rat?
Grüße Sascha
Vermute daher, dass sich die Rules beißen! Weiß jemand rat?
Grüße Sascha
Problem war, dass ich die orginal htaccess aus dem Artikel übernommen habe und nicht die Anpassung von STAM oben. In den Regeln müssen die / vor dem combine.php weggelassen werden (wie oben bereits zu sehen).
@STam: Die Variante funktioniert aber nicht bei direkt ins Layout geschriebener Verlinkung von js und css-Dateien oder habe ich da was übersehen?
da die musst du natürlich selber von Hand anpassen!
Dann nutzt du die htaccess Regeln von STAM und die normale Version von der Webseite (Achte auf die Pfadanpassung für deine CSS und JS Verzeichnisse!) und musst somit auch nix an Sefrengo rumschauben!
Dann nutzt du die htaccess Regeln von STAM und die normale Version von der Webseite (Achte auf die Pfadanpassung für deine CSS und JS Verzeichnisse!) und musst somit auch nix an Sefrengo rumschauben!
Ich I..., das macht ja die .htaccess. Schön, wenn man seine eigenen Links wieder versteht.
Wie misst man eigentlich die Ladezeit?
Wie misst man eigentlich die Ladezeit?
Zum Beispiel mit Yslow und Firebug http://developer.yahoo.com/yslow/ für Firefox
Oder halt mit http://www.websiteoptimization.com/services/analyze/ (ist auch in der Firefox Developer Toolbar enthalten)
Oder halt mit http://www.websiteoptimization.com/services/analyze/ (ist auch in der Firefox Developer Toolbar enthalten)
Tatsächlich, unter HTML validieren sind noch mehr Optionen 
ZITAT(saschapi @ Sat. 17. May 2008, 22:08) 
(ist auch in der Firefox Developer Toolbar enthalten)
also ich finde den in meiner developer-toolbar nicht. wo genau ist der denn versteckt?
Tools > View Speed Report
hmpf, da kann ich noch lange suchen. web developer 1.1.6 unter osx ist «View Speed Report» nicht vorhanden...zumindest bei mir
aber danke :-)
aber danke :-)
ZITAT(andi @ Tue. 20. May 2008, 08:52)
hmpf, da kann ich noch lange suchen. web developer 1.1.6 unter osx ist «View Speed Report» nicht vorhanden...zumindest bei mir
aber danke :-)
aber danke :-)
wenn's wirklich so ist, kannste doch den punkt (ähnlich dem lesezeichen) von hand in den optionen unter <<tools>> anlegen.
http://www.websiteoptimization.com/cgi-bin/wso/wso.pl?url=
danke bkm :-)
Dieses ist eine vereinfachte Darstellung unseres Foreninhaltes. Um die detaillierte Vollansicht mit Formatierung und Bildern zu betrachten, bitte hier klicken.