DEPRECATION WARNING
This documentation is not using the current rendering mechanism and is probably outdated. The extension maintainer should switch to the new system. Details on how to use the rendering mechanism can be found here.
Merging and compressing external CSS and JS¶
| Author: | Kasper Skårhøj |
|---|---|
| Created: | 2002-11-01T00:32:00 |
| Changed by: | Clemens Mach |
| Changed: | 2009-10-16T11:24:43.920000000 |
| Classification: | queo_speedup |
| Description: | The keywords help with categorizing and tagging of the manuals. You can combine two or more keywords and add additional keywords yourself. Please use at least one keyword from both lists. If your manual is NOT in english, see next tab "language" ---- forEditors (use this for editors / german "Redakteure") forAdmins (use this for Administrators) forDevelopers (use this for Developers) forBeginners (manuals covering TYPO3 basics) forIntermediates (manuals going into more depth) forAdvanced (covering the most advanced TYPO3 topics) see more: http://wiki.typo3.org/doc_template#tags ---- |
| Keywords: | css, javascript, compression, merging, speed, faster, reduction, forDevelopers, forIntermediates, forAdvanced |
| Author: | Michael Grundkötter |
| Email: | typo3@queo-flow.com |
| Info 4: | |
| Language: | en |
Merging and compressing external CSS and JS -
queo_speedup
Merging and compressing external CSS and JS¶
Extension Key: queo_speedup
Language: en
Keywords: css, javascript, compression, merging, speed, faster, reduction, forDevelopers, forIntermediates, forAdvanced
Copyright 2000-2008, Michael Grundkötter, <typo3@queo-flow.com>
This document is published under the Open Content License
available from http://www.opencontent.org/opl.shtml
The content of this document is related to TYPO3
- a GNU/GPL CMS/Framework available from www.typo3.org
Table of Contents¶
Merging and compressing external CSS and JS 1
`Introduction 3 <#1.1.Introduction|outline>`_
`Users manual / Administration 4 <#1.2.Users%20manual%20/%20Administration|outline>`_
`Configuration 5 <#1.3.Configuration|outline>`_
`Known problems 6 <#1.4.Known%20problems|outline>`_
Introduction¶
What does it do?¶
This extension takes all CSS and JS files which you have defined in page.includeCSS and page.includeJS and merges them into one file each. It additionally compresses these files, you can choose from different compression types.
The created files are deleted when the cache is cleared.
If you like your benchmark the improvement, install Firebug and YSlow or PageSpeed. Those extensions will tell you, that your page speed has improved! You will save a lot http requests and also the overall file size of the included CSS and JavaScript will decrease (only if you use compression).
Screenshots¶
This is a screen shot of the included files before usage of queo_speedup:
This is the same page after queo_speedup has been installed:
Users manual / Administration¶
Install the extension
Look into TS config of the extension. You can set compression type there and some other stuff needed for YUICompressor
Insert TS to your configuration. example:
page = PAGE
page.10 < styles.content.get
# you just need to add this line
page.20 < plugin.tx_queospeedup_pi1
Clear cache
Reload your page, now you should have just one CSS file (or two if you use _CSS_DEFAULT_STYLES in your other extensions) and one JS file.
Target group: Administrators or Developers
FAQ¶
Q: The speedup_* files are empty, now my site looks weird and no JS functionality is working any more, what happened?
A: You probably used the default config, which needs java installed and executable. Maybe you just need to configure the executable path, maybe you have to set another compression type which does not use java (which is everything except YUI), but PHP instead.
Q: There is no such speedup* file included in my source code. Why?
A: You have to include those files via page.includeCSS / page.includeJS! Other included files or code parts are NOT merged and packed. So please check if other extensions add code via additionalHeaderData.
Configuration¶
You just need to install the extension, then the default config will be loaded automatically. You only need to adjust something if the default does not work for you.
TS-Options¶
csscomp¶
Property
csscomp
Data type
string
Description
This sets the compression type for CSS files. Possible values are:"none", "minify" and "yuicss", where “none” means just merging and no compression
Default
yuicss
jscomp¶
Property
jscomp
Data type
string
Description
This sets the compression type for JS files. Possible values are:"none", "jsmin", "jsminplus" and "yuijs", where “none” means just merging and no compression
Default
yuijs
The following options are only used if YUICompressor is set in one of¶
Property
The following options are only used if YUICompressor is set in one of the above options.
tmpdir¶
Property
tmpdir
Data type
string
Description
This is the temporary directory for the YUICompressor process. The file there will be created and deleted via PHP, so make sure it is writeable by this user (same as webserver)!
Default
/tmp
javapath¶
Property
javapath
Data type
string
Description
This is the path to your java executable. Might be /usr/bin/java or something else. Just “java” is only working if this path has been added to your systems path variable!
Default
java
jarpath¶
Property
jarpath
Data type
string
Description
This is the location of the YUICompressor jar file. If it resides in a global path on your server, you can set this here. If it is somewhere inside your TYPO3 installation, please check the isRelative option (below)!
Default
/typo3conf/ext/queo_speedup/res/yuicompressor-2.4.2.jar
jarpath.isrelative¶
Property
jarpath.isrelative
Data type
boolean
Description
If set to 1, the absolute path to your TYPO3 installation is added to the value you specified as path. Thus you can use a relative path and don't need to know the full path of your TYPO3.
Possible values are 0 and 1
Default
1
Known problems¶
- You need installed java executable on your webserver to use YUI compression type! So if you selected YUI (which is default) and your compressed files are empty, you most likely have no java or your executable path has to be set.
- JSMin+ consumes a lot of memory, you have to use JSMin if PHP crashes
- Different encodings might cause problems if merged to one file. Please use just one encoding for all files of a type!
6