This document discusses JavaScript libraries and proposes ideas for improving them. It argues that while libraries are useful, developers should understand JavaScript fundamentals first. Current libraries have inconsistent APIs and lack modularity. The document proposes a new "CommonBrowserJS" library with common standards, pure feature detection, and support for CommonJS modules to converge the best ideas from existing libraries. Developing a simple "has.js" library for feature detection could be a first step. Overall the document advocates for improving JavaScript libraries by standardizing APIs and reducing magic while embracing modern JavaScript practices.

1. YOUR LIBRARY SUCKS.
jsconf.eu :: 25 Sept 2010 :: Peter Higgins

2. BUT YOU SHOULD USE IT.
jsconf.eu :: 25 Sept 2010 :: Peter Higgins

3. Me.
Dojo Toolkit Project Lead
JavaScript Engineer @joost / Adconion
Blogs Infrequently :: http://higginsforpresident.net
Codes @GitHub :: http://github.com/phiggins42
Twitter: @phiggins
Beer Drinking Expert

4. It’s Just JavaScript TM
Lovable, Simple
Self Healing
Promiscuous
Ubiquitous

5. The Good Parts
Context :: apply/call/hitch/partial
AOP, FTW. (duck punch...)
Prototypes, also FTW
Module Loading (/me jokes)

6. The Bad Parts
Date() :: designed with evil.
The DOM :: also designed with evil.
with() and eval() :: allegedly evil.

7. Teh Libraries
Dojo
YUI
Mootools / Prototype
FuseJS (?)
EmbedJS (?)
jQuery
Your own

8. LOVABLE, SIMPLE.

9. Libraries are a crutch
Learn JavaScript first
Know enough to dislike parts
Supplement those parts
Don’t be afraid of the word `prototype`
If you don’t know $.fn === $.prototype, quit (or learn)

10. PROMISCUOUS
Also known as Loose Typing

11. SELF-HEALING

12. BASIC AOP <3
// I can fix anything:
var oldfunction = some.oldFunction;
some.oldFunction = function(){
oldfunction.apply(some, arguments); // closures, ftw.
}

13. Philosophically
Fixes on the Natives vs Namespaced fixes
SomeString.trim() vs mylibrary.trim(SomeString)
mylibrary = {};
mylibrary.trim = String.prototype.trim ? function(str){
return str.trim();
} : function(str){ /* do the “fun” stuff */ };

14. Bind/Curry/Whatever
Context manipulation, FTW
mylibrary.bind = Function.prototype.bind ? function(fn, context){
return fn.bind(context);
} : function(fn, context){
return function(){
return fn.apply(context, arguments);
}
}

15. EASY TO ABUSE :(

16. DON’T DO THIS:
$(“div button#bar”).click(function(){
$(‘#bam’).addClass(“bar”);
$(‘#bam’).css(“width”, “200px”)
$(‘#bam’).animate({ width: “+=100” })
}).click();

17. To be fair ...
// easy to write bad code in any library:
var $ = dojo.query;
$(“div button#bar”).onclick(function(){
$(‘#bam’).addClass(“bar”);
$(‘#bam’).css(“width”, “200px”)
$(‘#bam’).animate({ width: 300 })
}).trigger(‘click’);

18. Why not:
var clicker = function(){
$(“#bam”)
.addClass(“bar”)
.css({ width:”200px” })
.animate({ width:”300px” })
}
$(“#bar”).click(clicker);
clicker();

19. UBIQUITOUS
“But can it run JavaScript?”

20. Device Penetration
Browsers, Now
Desktop, Mobile, Device
Server
Rhino
V8
Spidermonkey

21. Future Browsers?
Kitchen Crap
Televisions
Washer / Dryer?
...

22. COMMONJS
is piggybacking.

23. CommonJS
Modules should be in the language, not here.
Forgot about the browser (see: Modules)
Though has nothing to do with the DOM
A bit late?
Only more time will tell.

24. STANDARDS.
Yep. We (kinda) have them.

25. MDC: Array.prototype
Array.forEach / map / filter / indexOf / etc etc
None of us handle sparse arrays to spec
jQuery.map vs jQuery().map offends my senses
dojo.map(ar, “return item * 2”) is too much magic

26. “Portability”
[1,2,3].forEach(function(item, index){ ... }, context);
dojo.forEach([1,2,3], function(item, index){ ... }, context);
jQuery.each([1,2,3], function(index){ /* this == item */ });
Y.Array.each([1,2,3], function(item, index){ ... }, context)
Fuse.win([1,2,3], function(item, index){ ... }, context);

27. MDC: Fn.proto.bind
“this” is important.
var obj = {
counter:0,
inc: function(howmuch){ this.counter += howmuch || 0; }
};
var pfn = obj.inc.bind(obj, 5); // native, moo, proto way
var dfn = dojo.hitch(obj, “inc”, 5), // dojo
var dfn2 = dojo.hitch(obj, obj.inc, 5); // dojo is backwards
var jfn = jQuery.proxy(obj, “inc”); // so is jq. only w/ strings (also can’t pass args)
var jfn2 = jQuery.proxy(obj.inc, obj); // this is just plain inconsistent (no args here either)

28. I’M MISSING THE POINT?
No, i’m not being clear.

29. Your library sucks, still.
I’m a grumpy old man. </rant>
No compelling reason for YOU not to use them
If you understand what it’s doing
If you don’t MIX
Non-trivial tasks
Portability

30. Library Benefits
Deferred development cost
Open Source / Many Eyes
Battle-tested
Common / Consistent APIs

31. I WANT TO CHANGE TOPICS
Really. Let’s move forward, instead.

32. Propose: CommonBrowserJS
Reduce what we’ve learned over the years
Common Library to build upon
No Magic, Pure Standards
No UA sniffs, pure `feature detection`
Can load CommonJS modules/packages
Try to be agnostic? Back to Dojo beginnings.

33. Small Problems are Easy
MDC / ECMA standards are easy. What next?
Modularity
Stability (regressions, deprecation, sane versioning)
Localization/Internationalization? (l10n, i18n)

34. First pass: has.js
Agnostic Core
pure Feature Detection framework
API not as important as converging on test implementations
Naming shit is hard.

35. DOJO ALREADY DID IT.
@dojodidit - Really, We probably have.

36. DISCUSS.
Done talking. Ask questions if you like.

37. AAAAND THANKS.
#jsconfeu FTW, 2010 - enjoy the rest of the conference.

38. Me, again:
http://dante.dojotoolkit.org
http://higginsforpresident.net
http://twitter.com/phiggins
http://github.com/phiggins42
phiggins @ irc.freenode.net