Javascript Libraries - Friend or Foe? ===================================== Simon Willison, Dan Webb, Peter Paul Koch, Stuart Langridge, Cameron Adams What's a Library? [simon w] Reusuable code, solves a common problems, patches How many libraries? [stuart l] 200 million [simon w] 2.5 new ones every week What's good about libraries? [Dan] sick of copying and pasting functions into a file. Other programmers would laugh and tell you that you can't cut and paste. Some people say they fix the problems for you. Simon has experience of Yahoo's corporate environment... [sw] for full details go to Nate's talk. 3 main problems - javascript event model, connections back to the server, things the browser doesn't support like animation and drag&drop. Drag and Drop is really trendy, nightmare to build from scratch. [cameron] One of the advantages of Yahoo libraries - you get the experience of yahoo in your code. You do test it? [sw] Have this idea of graded browser support - A Grade browsers are ones Yahoo Properties have to work flawlessly in, yahoo libs are tested in all of them. SHouldn't rely on them but it's good to know they will work in that environment. What's wrong with libraries? [Peter] People rely on them, but only if you know what they're doing. Otherwise you won't know how to solve an obscure browser bug. People tend to use them too quickly. Ask the audience - who's using javascript libraries regularly? Web Developers are independent, I want to know how it works in browsers. Libraries tend to obscure that, and do so too much. [d] with javascript it's difficult to get away from the uglyness (look at panel). Libraries suggest you can do whizzy effects without knowing javascript, but you use them for any amount of time you find yourself using the source code. [sl] how many use javascript? about half of audience are doing javascript with no libraries. Goal of reusable code, that's what's the libraries try to do. Joel Spolsky, law of leaky abstractions, if something doesn't work you're completely sunk. You're not learning what it's doing you're learning the library. [c] "abstractions should be for abstracting work" [sw] "Law of Leaky Abstractions" is a classic - javascript is leakiest set of abstractions there is. More evils? [dan] many of the major ones take the traditional approach of being monolithic, large, do many things, all or nothing, but if I only need this little bit then have to use the whole thing. People are downloading these things, I'm concerned about that, don't want user to download more than they have to. [sl] Dean Edwards was looking at Yahoo Libraries, tree widget loaded 250k of libraries. Whole point of code reuse, but then if you want to do one tiny thing you have to load the whole library. [d] Dependency management is one thing that differs between javascript and traditional programming. One of the main reasons why people aren't using libraries, would rather use atomic functions. [sw] known and understood techniques for avoiding this - caching, downside is that you go to one website and download YUI library, then go to another and you get a different. Dojo are looking at edge caching, get your code on one server - if everyone links to the same file, get that. Minification and other tricks for shrinking code size. [sl] Edge caching only works if you're yahoo, doesn't work for my library. [d] would be interesting to see a service where you can host some javascript libraries [sl] not much collaboration between libraries - if you want one thing from 2 libraries, then you end up having to include all of both [sw] disagree, mochikit has packaging system, dojo has one, jsan is an attempt to do the same, mochikit checks if dojo is running and will use it's packaging system instead. [sl] like americans and russians in 1983. Good that people are thinking about this. What makes a desirable javascript library? ------------------------------------------ [sl] I need to have written it [d] Actually like libraries that operate at a lower level, that fix bits of javascript. Average DOM scripting you always work with events, always working with lists of objects and nodes, things for easily working with lists I really like. Like easy ways to select nodes, things like cssquery, useful to me. Don't want a calendar component - have different needs? [c] boutique vs department store? [d] jquery - aspects of that I like, compact and just deals with selecting nodes and doing stuff with them. 90% of what you do when you're DOM scripting. [p] has to be small - pick code snippets you need and put them in you're own library. Forced to think for yourself. [d] Cutting and pasting functions is a bit tedious? [p] principle has to be that you choose your own components. Know what I need. [sl] that works if you're ppk. most people are not javascript genius. I want a library that does everything I want as is 5k. Don't want a noddy thing that doesn't do much. (argument if browsers and javascript is crap?) [sl] would you use a small library that made things easier if it was smaller? only half the audience would. [d] don't you think there's a baseline? basic stuff you always copy and paste? [sl] javascript libraries are very useful if you write gmail. All I do is getelementsbyid and walk the node. [p] what about classname, or event libraries? [sl] would like it to be a lot easier to do DOM scripting stuff, but I don't think we found something that does for decent programming languages did for c [sw] desirable attributes, dependent on what you're trying to do. working out if it's good enough for you to use - has to be documented, needs to be a community around it, you need to be able to understand what's going on. Is the source code clear and sane enough? If there are bugs am I going to be able to dive in and fix that. Pet peeve is libraries that don't respect javascript - "basically a toy, if you use this library we'll write you javascript for you". Java to Javascript compiler in GWT - makes web development more like swing. [sl] what .net stuff does [sw] ruby on rails rjs - write ruby that will be turned into javascript. Partly because of the leaky abstractions, but javascript isn't a bad language. Respect it and you can get a lot out of it [p] javascript libraries that treat javascript as javascript [d] big difference between taking good ideas and implementing them, and forcing it to be like your favourite language. [p] programmers don't want to learn javascript [sw] this way lies madness Are Libraries guns in the hands of children? -------------------------------------------- [d] javascript is a gun in the hand of children. late 90s I was doing DHTML hacking, realise my sins, now it's come back again, but we're seeing the same mistakes, every day there's another ajax homepage. Don't think libraries make it any worse. [p] don't make it any better either. [c] scriptaculous? [p] people are more interested intellectually, everyone had floating
s because they were cool, now people are thinking why they use javascript [sl] rubbish. dhtml sites haven't gone away, just fetch stuff off the server [sw] when Yahoo put the YUI out, they also released the Yahoo Design Patterns library - smart people have put together descriptive patterns showing how to highlight things to the user. People learning that this isn't always a good idea, bunch of theory that really does enhance user experience. Which Libraries are good? ------------------------- [p] none - don't use any myself [d] really undecided [c] bicurious? [d] (lost for words) [sl] don't like idea of libraries, use the yahoo one at work, but it just works, thankyou very much. Like yahoo one, don't like prototype because I don't like ruby. Thing I always use libraries for is using ajax. Use the DOM bit of yahoo only. [c] Dan recently did a roundup of libraries? [d] really interested in libraries, but don't use them heavily. Look through the code, spot some morsels of really good stuff. [c] read the compressed version [sw] plug for all four, i did a talk a few weeks back and chose the same 4 that Dan did - dojo, mochikit, prototype and yahoo [sl] don't use dojo and alex is too clever. Undo from back button, not sure that should be possible. Too easy to use that for the wrong things. [sw] dojo are "trying to give you the future today" - store data offline, dojo can do that with crazy hacks. In a years time when firefox starts supporting that natively, you won't need to change anything. [d] a lot of problems where javascript is not a good solution, dojo tackles those. Choose the right tool for the job. Suddenly everything is being written in javascript, maybe flash is better for this? [sl] all the libraries are open source, can't do that with flash. [sw] whole new panel Where are javascript libraries headed? -------------------------------------- [sl] Dojo - stated goal is to give you everything and the others to catch up. Have to head that way, if you stay minimal [c] see an aggregation? will dojo take over whole market? [d] nobody has come up with best solution for designing a library [sw] nobody has come up with the best way to design a programming language. Depends on use. [d] been thinking a lot about how we can design javascript libaries in a different way that aren't monolithic. avoid namespace issues, improvements can be made. Using capabilities of javascript to improve things - want simple interfaces Q&A --- q: mentioned rjs templates, from an application design point of view i find it nice, not because I don't understand js [d] rails all about making it look nice to the programmer, had some back and forth with DHH. About making what the user is downloading good, need to realise that. Look at the rails javascript helpers - look at the source code [sw] what if you turn javascript off? [d] maybe. rails tries to make you be a good developer, but it discourages you from writing good javascript [sl] distinction between idea of rjs and how they work in practice. Is it better to not use it at all? [d] rjs writes simple scripting calls, add more, where do you stop? q: none of you have mentioned the word deadline. as a php developer, I need to accomplish this quickly, maintaining that and keeping a quick download. Can someone build a site that asks what functionality and gives you a download. [sw] dojo does that, pull in bootstrap, then it loads things on demand, if you're using lots of code pull in different things. Have command line packaging thing that looks at your code, looks at what you need, gives you the smallest possible download. q: advantages and disadvantages of big four? [d] on sitepoint i put up a large article that is exactly that. Look at that. q: ... [p] when i find useful code i put it on my site - never went beyond that [c] javascript is still relatively immature, still pushing boundaries. Ask in a few years - probably a different situation. [sl] not a sin to make stuff easy. important for people to know what they're doing then they make better sites, but if everyone has to know everything then you're breaking the easy way of getting involved with the web q: any progress on updating javascript in the browser [sw] want libraries to basically be obsolete - browser is supposed to be an abstraction and we only have libraries because they're not good enough. Efforts to standardise things like XmlHTTPRequest. [sl] look at things like e4x, fantastic, only available in mozilla. EIther insist that all browser manufacturers keep up to date, or make everything except firefox go away. Not going to happen. IE4 had HTML+Time - documented standard, never took off. Either provide a library or give up. [c] same as css [sw] five year lead time on anything in browsers. Will take a long time, libraries will patch gap [sl] libraries are like css hacks [d] keep an eye on changelogs of mozilla, get new bits of javascript language every so often [sw] Brenden Eich [d] interesting stuff in his presentation on Javascript 2 q: Libraries are trying to make javascript like python, but they're build like a server side language. Questions like "what if Javascript isn't turned on" aren't answered. Don't think in client side way. [sl] how can a js library fix if js is turned off? Everyone can do server side coding, thinking about it in that way. But it's a good thing, lots of knowledge about how to do that. [d] need to have a different approach with javascript, DRY has been mentioned, sometimes in javascript to relax that so you don't get loads of dependencies. Conventional wisdom in other programming languages. Javascript is a different discipline. People who come from CSS side grasp that concept better than people who come from server side. q: Dustin Diaz did a top 10 javascript function, what are yours? [c] get elements by attribute [d] like css query like things. Actually, no, foreach and map, functional programming stuff [p] don't have any favourites [sl] dowhatimean(). really like e4x stuff. and document.getElementById. the DOM. Javascript objects with curly bracket syntax. [sw] hitch() - obscure thing, Aaron Boodman - solves the problem of event handlers not being able to call a method of calling an objects methods. If you know how it works, you know javascript. [d] the equivalent in prototype is bind()