Skip to content

Instantly share code, notes, and snippets.

3n / gist:967051
Created May 11, 2011
A "blog" "post" about asynchronous script loading and MooTools.
View gist:967051

A lot of talk at JSConf was on the use of modules: AMD, CommmonJS, or otherwise. Since the server-side JavaScript world has this mostly covered, a more heavily discussed topic was bringing the joys of modularity to the client-side. This, of course, is a tricky thing to do since loading scripts requires some sort of relatively slow and possibly asynchronous network request. How does one balance the issues of perceived latency, JS execution (UI blocking), page weight, and code tidiness? I spent some time looking into this and here's my first stab at a solution (no I'm not releasing some open source project shut up).

Real quick: if you don't agree that splitting files to do asynchronous loading is a good idea you should read more.

I code most of my projects in MooTools (including my current project, BankSimple), so modularity is a given for me. MooTools is

View guilloche.js
name: guilloche
script: guilloche.js
description: guilloche
provides: [Guilloche]
3n / onPause.js
Created Jan 13, 2011
defines :delay(time) pseudo for Element.Event in MooTools
We couldn’t find that file to show.
View gist:385810
// definition of trackEvent method on a global object
$3N = {
trackEvent : function(category, action, label, value){
if (typeof(pageTracker) == "object") pageTracker._trackEvent(category, action, label, value);
else if(typeof(_gaq) == "object") _gaq.push(['_trackEvent', category, action, label, value]);
View gist:283188
/* css to make <div id="new">NEW</div> into this: */
#new {
View gist:90053
Script: Event.addEventOnce.js
Extends the Event class (using .implement) with a method to add an event only once.
addEventOnce: function(type, func){
this.addEvent(type, function(e){ func(e); this.removeEvent(type, arguments.callee) });
return this;
3n / gist:81451
Created Mar 18, 2009
Array.each_asynchronously: Works just like Array.each except runs each iteration on a specified delay.
View gist:81451
Works just like Array.each except runs each iteration on a specified delay.
This means that script execution will continue in between each iteration,
rather than halting until the full array has been processed.
- fn: (function) The function to execute on each item in the array. It is
View snippet.txt
function coin_toss(prob){
return Math.random() > 1 - (prob || 0.5)
View gist:18404
addEventOnce: function(type, func){
this.addEvent(type, function(){ func(); this.removeEvent(type, arguments.callee) })
return this