Loading Additional Resources
The preferred way to load
JavaScript and CSS resources within the Aliro framework it to utilize the
Aliro Resource Loader∞ class. This helps assure optimal performance, load order, caching, etc.
If you choose to bypass loading resources via Aliro Resource Loader, perhaps because you have inline code, you will find a number of standalone functions for loading
JavaScript and CSS within the aliroAbstractRequest class. These serve as good secondary options.
External Resources
addScriptNode and addLinkNodes:
These functions take fully qualified script and/or link nodes (e.g.) <script type="text/javascript" src="foo.js"></script> & <style type="text/css"></style>. They add them either the page header or just below the closing body tag to assure proper load order, page validation, and optimal performance. The position can be overridden, but in most cases should not be.
Inline Resources
Sometimes it is not possible to keep all the
JavaScript and/or CSS within external files. When this is the case the Aliro Resource Loader will not be a good option. However, you will find a number of standalone functions for loading inline
JavaScript and CSS within the aliroAbstractRequest class.
addScriptText (example):
$scriptText = <<<ST
<script type="text/javascript">
var foo = 123;
function foobar() {
var test = 456;
};
</script>
ST;
$this->request->addScriptText($scriptText, 'default', true);
The 1st param is the code to embed, the 2nd is the position to place the node in the document, and the 3rd is a boolean value indicating if the code should be minified. Aliro makes use of
Minify∞ for runtime minification of
JavaScript and CSS.
YUI Compressor∞ is used to process static resources during release builds.
Result
<script type="text/javascript">var blah=123;function foobar(){test=456;};</script>
addCSSEmbed (example):
$cssText = <<<CT
<style type="text/css">
body {
background-color: red;
}
h1 {
font-size: 16px;
}
</style>
CT;
$this->request->addCSSEmbed($cssText, 'head', true);
The 1st param is the code to embed, the 2nd is the position to place the node in the document, and the 3rd is a boolean value indicating if the code should be minified. Aliro makes use of
Minify∞ for runtime minification of
JavaScript and CSS.
YUI Compressor∞ is used to process static resources during release builds.
Result
<style type="text/css">body{background-color:red}h1{font-size:16px}</style>
There are no comments on this page. [Add comment]