Your SlideShare is downloading. ×
JavaScript Libraries: The Big Picture
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

JavaScript Libraries: The Big Picture

35,857
views

Published on

Published in: Technology

5 Comments
57 Likes
Statistics
Notes
  • Excellent slideshow. I've taken some of the framework graphics as well as adapted to my startup
    Teisha
    http://dashinghealth.com http://healthimplants.com
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Even though you have a valid point I am afraid that I must disagree. And besides this article appears quite old.

    Hose
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Cool slideshow!!
    http://body-hercules.blogspot.com/
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Hey Cool
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • See http://simonwillison.net/2007/May/16/libraries/#comments for some corrections.
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
No Downloads
Views
Total Views
35,857
On Slideshare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
1,947
Comments
5
Likes
57
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. JavaScript Libraries: The Big Picture Simon Willison XTech, 16th May 2007
  • 2. • What problems do libraries solve? • An overview of the Big Four • ... what are the interesting ideas?
  • 3. Personal bias
  • 4. • I like JavaScript-the-language • So I won't be talking about frameworks that generate JavaScript code for you
  • 5. “ The Web is the most hostile software engineering environment imaginable.” Douglas Crockford
  • 6. The legacy of the browser wars
  • 7. • The DOM API kind of sucks • Event handling is frequently broken • Ajax is inconsistent • You have to roll your own animation • Drag and drop is tricky • Co-ordinates are surprisingly hard • Internet Explorer leaks memory like a sieve
  • 8. The Event model // Internet Explorer element.attachEvent('click', function() { alert(window.event); } ) // Everyone else element.addEventListener('click', function(ev) { alert(ev) }, false );
  • 9. “The bad news: JavaScript is broken. The good news: It can be fixed with more JavaScript!” Geek folk saying
  • 10. The big four • The Dojo Toolkit • The Yahoo! User Interface Library • Prototype (and Script.aculo.us) • jQuery
  • 11. The Dojo Toolkit
  • 12. • Founded in 2004 • Originally unified from a bunch of older frameworks • Initial aim was to show that JavaScript / DHTML should be taken seriously • Enormous amount of smart technology
  • 13. dojo.collections dojo.math dojo.crypto dojo.reflect dojo.date dojo.rpc dojo.dnd dojo.storage dojo.dom dojo.string dojo.event dojo.style dojo.io dojo.undo dojo.lang dojo.uri dojo.lfx dojo.widget dojo.logging dojo.xml http://www.flickr.com/photos/aprillynn77/8818200/
  • 14. dijit • The Dojo widget system • Create widgets programmatically, or use declarative markup <div dojoType=quot;dijit.TitlePanequot; label=quot;Terms and Conditionsquot; width=quot;200quot;> Text... </div>
  • 15. The future today • Cross browser 2D drawing APIs • dojo.storage - store data offline • dojo.undo.browser - history management • The Dojo Offline Toolkit
  • 16. The Yahoo! User Interface Library
  • 17. YUI • Created at Yahoo!, BSD licensed • Designed for both creating new applications and integration with legacy code • Focused on browser issues; almost no functionality relating to JS language itself • Extensively tested and documented
  • 18. controls calendar container autocomplete menu slider treeview dragdrop animation dom event connection utilities
  • 19. YAHOO.util.Event.on(window, 'load', function() {

×