|
Hi Todd,
Good question. First, Yes it is possible. You may be aware that the way Minimee generates the cache script & link tags is based off of the format of the first such tag it encounters on the tag pair run. So in the following example:
{exp:minimee:js}
< script src="plugins.js" async="async" >< /script >
< script src="script.js" >< /script >
{/exp:minimee:js}
The rendered cache file would be based off the first tag, so:
< script src="as876dfa98s7d6fa9s8df5a9s8dfa9asdf.js" async="async" >< /script >
So, that’s how you’d use it; question is should you, and if so when (and when not).
Personally, I tend to not run Minimee on any external scripts (Facebook, Google Analytics, Twitter etc); I take the view that these scripts are most likely already cached in people’s browsers; plus it ensures I always get their most up to date code (since Minimee cannot detect changes to external files).
And if you’re like me, those are most likely the only viable candidates for asynchronous loading; all other scripts I might need are usually reliant upon each other (e.g. jquery + cycle + bootstrap + plugins + scripts).
Plus, the benefit of using Minimee to both compress and combine files means that you’re making gains by reducing your HTTP requests. So even if you’ve decoupled an HTTP request or two from the rest of the page load, you could argue you would have benefitted more if you’d had just 1 request total.
The exception might be for large scripts - the FB script is obnoxious at 55kb (jquery is 33kb!), so that is never something I want to bundle into the rest of my scripts.
If you’re using a lot of 3rd party services, you could consider combining all of these into a single Minimee’d async cache file, but then you’d need to periodically refresh the cached file to keep you scripts current (if you wanted to). That at least would consolidate your async HTTP requests down to 1. I’d consider that a win.
Well, I’m not sure if any of the above was what you were after - and none of the above is backed up by facts (get on the Cain Train), so follow at your own risk.
My final thought is that you’re probably doing pretty well if you’re at the point of considering async - but just in case, here’s a list of what I’d say are more important to do first:
- compress images (ImageOptim if you’re on a Mac)
- sprites
- scripts at bottom
- customise 3rd party frameworks/libraries to only include what’s used (e.g. modernizr, & twitter’s bootstrap)
- reduce number of web fonts
- limit your reliance on JS (controversial!)
- for scripts that are only needed on a single page, exclude from site-wide combination and embed inline (see {exp:minimee:embed})
And then of course there’s EE optimisation - but now I’m really getting off topic…
If you do have a go at harnessing async, I’d be appreciated to hear your findings!
Cheers,
John
|
