-
-
Save getify/713779 to your computer and use it in GitHub Desktop.
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <title>LABjs Demo</title> | |
| </head> | |
| <body> | |
| <!-- some stuff --> | |
| <script src="/js/LAB.js"></script> | |
| <script> | |
| $LAB | |
| .script(('https:'==document.location.protocol?'https://ssl':'http://www')+'.google-analytics.com/ga.js') | |
| .wait(function(){ | |
| var pageTracker = _gat._getTracker("UA-XXXXX-X"); | |
| pageTracker._trackPageview(); | |
| }); | |
| </script> | |
| </body> | |
| </html> |
@jimmykhlam -- corrected the ( ) issue... it was actually a missing ( at the beginning of the line, to surround the ?: ternary clause.
as for why to do this? you wouldn't do this is google-analytics was the only script you were loading on your page. that would be silly (perf-wise), to not just use their async snippet. OTOH, hiding as much logic away from your page markup as possible, the async snippet google provides is pretty ugly nitty details right inside your page. that argues for using a loader.
but the real reason for this gist is, almost every page in existence uses at least one, sometimes many javascript files, as well as the google analytics (or some other tracking tool) script. As soon as you have 2 or more scripts on a page, it makes more sense to use a loader which can optimize their loading, and which can (if necessary), sequence their execution, for dependency sake. LABjs provides you that general loader solution. If you're going to use it for other scripts on your page, you might as well use it to load google analytics. that's what this gist shows how to do.
@getify thanks for the explanation.
Where would one typically chain in the google analytics loading? My initial thought was at the end, but my confusion now is whether any .wait() calls above it would cause it to become 'dependant' on the execution of other code. In which case should it be included before any .wait() calls instead so that it can execute async to everything else?
<script>
$LAB
.script("framework.js").wait() //should google analytics loading come before this line?
.script("plugin.framework.js")
.script("myplugin.framework.js").wait()
.script("init.js")
.script(('https:'==document.location.protocol?'https://ssl':'http://www')+'.google-analytics.com/ga.js') //or here?
.wait(function(){
var pageTracker = _gat._getTracker("UA-XXXXX-X");
pageTracker._trackPageview();
});
</script>
@jimmykhlam I believe it's up to you. Is site functionality less important to you than the analytics? Then put ga first. Otherwise put it last.
i recommend loading google analytics with an entirely separate chain. It's neither dependent on, nor a depdency of, any other code in your page. so load the rest of the code in your page in one chain, and use a separate chain for google analytics.
I believe there may be an extra
)on line 13 afterhttp://www'.I was also wondering, since google analytics code is already asynchronous, what are benefits of using $LAB to load it? Thanks!
ref: http://code.google.com/apis/analytics/docs/tracking/asyncUsageGuide.html