MinifyX

Last updated Dec 8th, 2019 | Page history | Improve this page | Report an issue

Support the team building MODX with a monthly donation.

The budget raised through OpenCollective is transparent, including payouts, and any contributor can apply to be paid for their work on MODX.

Backers

Budget

$306 per month—let's make that $500!

Learn more

What is MinifyX?¶

MinifyX is a snippet that allows you to combine JS and CSS files to reduce server load and optimize loading speed.

MinifyX is created and maintained by SCHERP Ontwikkeling.

Requirements¶

MinifyX requires MODX® Revolution 2.2.0 or later.

History¶

Version	Release date	Author	Changes
1.0.0-PL1	March 26th, 2012	Patrick Nijkamp (SCHERP Ontwikkeling)	Initial release.
1.1.0-PL	September 09, 2012	Vasiliy Naumkin	Improved minifiers and code refactor

Download & Installation¶

Install the package through the MODX® package manager.

What you need to know¶

MinifyX combines your files to 1 cache file and loads it from there. If you combine CSS files you should use absolute paths when using images or other URL related calls, the same goes for javascript. Some frameworks use bootloaders (like EXT) that need to be in their respective directories before they work. Be sure not to fall for this trap, could save you some time ;)

Using MinifyX in the front-end¶

Placing the snippet¶

Place the main [[[MinifyX](extras/minifyx "MinifyX")]] snippet call on your webpage. If you have placed the snippet it assigns the following placeholders to your page:

Placeholder name	Content
`[[+MinifyX.css]]`	The tag containing the source to the CSS cache file (should be placed in the head, most of the time before the javascript includes)
`[[+MinifyX.javascript]]`	The tag containing the source to the javascript cache file (should be placed in the head)

Configuration parameters¶

You can configure the snippet "MinifyX" with the following parameters:

Parameter	Description	Values	Default Value	Required
jsSources	Comma separated list to your JS files from the site base URL	Comma separated string	(empty)	no
cssSources	Comma separated list to your CSS files from the site base URL	Comma separated string	(empty)	no
minifyCss	Whether to minify the CSS or not	0 = no, 1 = yes	0	no
minifyJs	Whether to minify the JS or not
(only block comments allowed! experimental)	0 = no, 1 = yes	0	no
cacheFolder	The folder to the cache files from the site base URL	A string	assets/components/minifyx/cache/	no
jsFilename	Base name of destination js file, without extension	A string	scripts
cssFilename	Base name of destination css file, without extension	A string	styles

Examples¶

Below you see the main snippet call and the placement of the placeholders. Every parameter is optional, we have just used some possibilities of customization.

<html>
<head>
[[MinifyX?
  &jsSources=`
    /assets/myframework.js,
    /assets/lightbox.js,
    /assets/script.js
`
  &cssSources=`
    /assets/style1.css,
    /assets/style2.css
`
]]

[[+MinifyX.javascript]]
[[+MinifyX.css]]
</head>
<body></body>
</html>

External sources¶

Developers website: http://www.scherpontwikkeling.nl/portfolio/modx-addons/minifyx.html

GitHub repository: http://www.github.com/b03tz/MinifyX/ and https://github.com/bezumkin/MinifyX

Report bugs and request features: http://www.github.com/b03tz/MinifyX/issues