Asset Linker

Derek Jones edited this page Jul 5, 2012 · 19 revisions
Clone this wiki locally

File:Asset_Linker_0.1.1.zip

Introduction

Asset Linker is a library specifically to help with storage of css/js files and the loading of them.

I don't know about you but when I am writing my websites I find I suddenly need a new css file for just this method of a controller. Now having to add it into the view file manually is just a pain and would mean a new view file for just this method. Also I have a selection of js/css files I need all the time.

So I created this library to try and ease the process. The library can perform the following functions.

  1. Load a set of default assets including ones specifically for the public/admin & shared assets
  2. Load an asset on the fly for a particular controller/method
  3. Compress all public/admin/shared assets into a single file to save the browser loading many different files ### Download

File:Asset_Linker_0.1.1.zip

Usage

Load asset on the fly

To load an asset on the fly takes just one line of code.


// $level is ONE of the following public/admin/shared
// $type is ONE of the following css/js
// $name Name of file with extension
$this->assets->load($level,$type,$name);

Output assets

In the view file between the html HEAD tags include this line.


// $level is ONE of the following public/admin
$this->assets->link($level);

Config Settings

There are several settings used to set-up the library. All are explained in full in the actual config file. In short you can set-up the default assets/asset locations & asset caching settings.

Asset Caching

But the browser caches css/js files?? I hear you say. Yes it does but if you say have many javascript and css files it still takes quite a while to load. I have provided an example below.

Say we have 5 css stylesheets & 4 javascript files which we need to load on ever page. The total size of all the files is 180kb uncompressed. We have several possible cases, first-time page load/return visit & asset caching enabled/disabled.

[quote]Page load times: First-time visit + No Asset caching = 6.65s First-time visit + Asset caching = 3.07s Return visit + No Asset caching = 3.61s Return visit + Asset caching = 1.00s[/quote]

So as you can see when asset caching is enabled you get on average 36% speed-up. BUT this is not totally true, you only get this if the same person visits only twice. In real use you will only re-cache the asset files maybe once a day, so if 100 people visited your site twice in a day, only the first visit would get non cached asset files.

Another factor is these calculations have been made using non-compressed cache files.Compressing both js and css files can decrease there size by nearly 50%.

Notes

PLEASE NOTE I HAVE TESTED THE LIBRARY BUT CANNOT GUARANTEE IT TO WORK PERFECTLY. THERE ARE ALSO SEVERAL FEATURES I HAVE NOT FULLY IMPLEMENTED (LIKE THE CACHE COMPRESSION FUNCTIONS) I HOPE I CAN FINISH THESE OFF SOON.

Please also take into consideration if you use this library that this is my first real piece of code I have released for public use, so my documentation and coding standards may be lacking. I hope it can be of use to someone. Please do get back to me in the relevant CI forum thread about any problems and improvements.

Asset Linker library was tested using PHP 4.4.4

Category:Library Category:Assets