gzip Komprimierung
CSS und Javascript Datein mit TYPO3 eigenen Funktionen komprimieren. Ein Speed Schub für eure Seite - auch google wird es lieben.
CSS und Javascript Dateien einbinden
Die Einbindung von Javascript und CSS Dateien in unser Template ist denkbar einfach.
Dafür gibt es im Page Object folgende Bereiche:
page.includeCSS {
mycss = EXT: my_template/Resources/Public/Css/mycss.css
}
page.includeJSlibs {
// Diese Javascriptdateien werden in den Seitenheader geschrieben
}
page.includeJSFooterlibs {
// Diese werden als erstes im Footer eingebunden
}
page.includeJSFooter {
// Diese Dateien kommen im Footer nach den JSFooterlibs
}
Externe Dateien auf Fremdservern
Wenn Ihr externe Dateien einbinden wollt, also Dateien die nicht auf eurem Server liegen, müsst ihr für diese ein Flag setzten. TYPO3 prüft vor der Einbindung der Dateien ab, ob diese Datei auf dem Server existent ist, sonst erfolgt keine Einbindung.
Grundsätzlich bin ich mit externen Dateien immer vorsichtig, wenn der Fremdserver down oder langsam antwortet, zieht das die eigene Seite runter.
page.includeJSFooterlibs {
jquery = https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js
jquery.external = 1
}
Komprimierung und Zusammenfassung von CSS und Javascriptdateien
TYPO3 unterstützt eine automatische Zusammenfassung und Komprimierung von Javascript und Css Dateien.
Die Voraussetzungen und Vorteile einer gzip Komprimierung habe ich ausführlich in diesem Artikel beschrieben: gzip Komprimierung mit TYPO3.
Die Funktionen werden in der Templatekonfiguration mit folgendem Eintrag aktiviert:
config {
compressJs = 1
compressCss = 1
concatenateJs = 1
concatenateCss = 1
}
Einzelne Dateien kann man von der Kompression und/oder Zusammenfassung ausschließen:
page.includeJSlibs {
respond = EXT:my_template/Resources/Public/JavaScript/Libs/respond.min.js
respond.excludeFromConcatenation = 1
respond.disableCompression = 1
}
CSS und Javascript Dateien mit Conditions wrappen
Auf ähnlichem Wege kann man die so eingebundenen Dateien mit einem allWrap versehen, um z.B. spezielle Browser anzusprechen. Diese Dateien sollten dann immer aus dem automatischen Zusammenfassen ausgeschlossen werden:
page.includeJSlibs {
respond = EXT:my_template/Resources/Public/JavaScript/Libs/respond.min.js
respond.allWrap = <!--[if IE 8 ]>|<![endif]-->
respond.excludeFromConcatenation = 1
respond.disableCompression = 1
}
Empfehlenswerte Lektüre:
TypoScript - kurz & gut
Ein kleines, aber umfassendes Nachschlagewerk aller TypoScript Funktionen das auf jedem Schreibtisch liegen sollte der sich mit TYPO3 intensiv beschäftigt. Es ist für die 6.2 Version nicht mehr ganz aktuell - aber als Referenz für die unzähligen TypoScript Funktionen das beste am Markt.
Kommentare
keine Kommentare vorhanden