I've build something similar to this; here's how i did it:
on my webserver, there are a bunch of JS and CSS files. During each
page load, i create an array of CSS and JS files, which have to be
included on that page. Currently i store these in session, but that
isn't needed. In the header of the page, i have 2 calls, one to "/
framework/load?css/<scriptname>" and one to "/framework/load?js/</
scriptname>". That script ("load" is a PHP file which reads the array,
generates a hash out of it, checks to see if the files are modified
since the last time they where "build" and if so, recombines all files
and minifies them (in case of JS: Packer, in case of CSS: remove
newlines, comments and tabs). After compiling it writes the generated
file to disk and serves that to the browser. It was a lot of work, but
it allows me to keep all original JS and CSS files on the server (=
greater maintainability) and improves load times drastically.

HTH

-- Gilles

On Jul 16, 7:55 am, Klaus Hartl <[EMAIL PROTECTED]> wrote:
> Stephan Beal wrote:
> > Hi, all!
>
> > i just wanted to take a moment to share a tip which i don't see used
> > too often on live sites:
>
> > Combine all of your JS scripts into a single file. This helps reduce
> > the load time of the page by reducing the number of separate GET
> > requests.
>
> > In principal you should be able to do the following to combine the
> > files:
>
> > cat file1.js file2.js file3.js > all.js
>
> > but some scripts do not work with this because they are missing a
> > trailing semicolon (shame on them!). A simple workaround is:
>
> > for i in file1.js file2.js file3.js; do
> >   cat $i
> >   echo ';'
> > done > all.js
>
> > If you're using GNU Make to build your project, here's a bit of Make
> > code which does this:
>
> > mega.js.inputs := jquery.pack.js interface.js \
> >                 jquery.blockUI.pack.js jquery.contextmenu.packed.js \
> >                 jquery.idTabs.pack.js \
> >                 jquery.colorPicker.js \
> >                 jquery.bogoTabs.js
> > $(mega.js.inputs):
> > $(mega.js): $(mega.js.inputs)
> >         @echo "Creating $@ ..."; \
> >         for i in $(mega.js.inputs); do cat $$i; echo ';'; done > $@
> > # ^^^^^ without the extra semicolon, the included file doesn't work
>
> > Obviously, edit $(mega.js.inputs) to suit your project.
>
> That is very reasonable. Here's some information 
> why:http://yuiblog.com/blog/2006/11/28/performance-research-part-1/
>
> If you're on Rails, you can use the AssetPackager plugin that does the
> merging automatically for you depending on the environment.
>
> --Klaus

Reply via email to