Twitter widgets

gistfile1.js

(function(document){ 
	var script = 'script',
	    twitterWidgets = document.createElement(script),
	    lastScript = document.getElementsByTagName(script)[0];
	
	twitterWidgets.async = twitterWidgets.src = 'http://platform.twitter.com/widgets.js'; 
	lastScript.parentNode.insertBefore(twitterWidgets, lastScript); 
})(document);

// compressed 177 bytes
(function(a){var b="script",c=a.createElement(b),d=a.getElementsByTagName(b)[0];c.async=c.src="http://platform.twitter.com/widgets.js",d.parentNode.insertBefore(c,d)})(document)

// insertAfter might work too, saving another byte, but haven't tested

Nice!

Although I imagine the "script = 'script'" but would increase the gzipped size, vs just using "script" twice.

Setting .async could be skipped entirely, if you wanted to. See http://mathiasbynens.be/notes/async-analytics-snippet#async for the details.

There's really not much point in setting async to some truthy value, as it defaulting to false is legacy behavior that is now deprecated and been spec'd away. The spec now says that async defaults totrue for dynamically created script elements. This spec default is now implemented in FF4+, Webkit nightlies (since march), Chrome 12+, and soon Opera. In all versions of IE and older webkits, a dynamic script already behaves as though it's async=true, regardless of what you set it to, so it's moot in those browsers.

Furthermore, in FF<=3.5, it ignored the async setting on dynamic scripts, so it's moot there. Likewise with older Opera. FF3.6 is the only FF that defaulted to false but actually payed attention if you set it to true.

So, all in all, setting it to true is rather legacy and out-dated (and thus bad practice for new scripts). Mozilla's not supporting FF3.6 anymore, so it's probably not much point for scripts to waste any effort doing so (and the only downside here would be slightly less performance there anyway).

But if you do care about current and older versions of Opera and FF3.6, it's not so terrible.

@miketaylr-
I've had mixed success getting some versions of Opera to respect it, so I generally assume that it's not reliable there. Then again, Opera seems to be one of those browsers where supporting only the latest version is the only thing that really matters (to most people). And, I know Opera is working on implementing the spec (soonish!?) so I'm ok with a tiny perf degradation temporarily, rather than baking legacy code into my released script projects.

The question is not whether the few bytes matters, it's the question of principle, of not just blindly performing some action in code that has nowhere near as much effect as it appears in code that it does. I bet most developers don't realize the reality I tried to illustrate above. Especially doing so without a comment, leaves the code looking like it's more critical than it is, which trips up later developers (or your future self if you forget).

Remember, in these snippets (like GA snippet and Twitter button snippets, etc), they end up getting thrown into pages and left there untouched for years (or "forever"), so I think it's important to have a cautious eye to what you put in them, not for the bytes but for the responsibility of future-proof and future-thinking code.

I was simply trying to raise awareness about aysnc's actual behavior now, and the rapidly shrinking effectiveness/validity of setting it.

Fair points, Kyle.

@miketaylr, do you happen to have more details on when the current version(s) of Opera actually respect .async=true?