History of jQuery

jQuery Past, Present, and Future John Resig (ejohn.org)

Inspiration ✦ Simon Willison’s getElementsBySelector ✦ Dean Edwards’ cssQuery ✦ Dean Edwards’ addEvent ✦ Prototype ✦ Behavior ✦ moo.fx

The Beginning ✦ Started August of ’05 ✦ http://ejohn.org/blog/selectors-in-javascript/ ✦ $(’#foo ol li’) .set(’title’,’List Items!’) .bind(’click’,function(){alert(’Hello!’);}) .select(’.tmp’) .style(’color’,’white’) .select(’.foo’) .style(’background’,’red’); ✦ jSelect!

First Implementation ✦ http://ejohn.org/apps/jselect/selector.js ✦ $(document).bind(”ready”, init); var rows = $(”#table tr:gt(0)”); $(”#table th”).bind(”click”,function(){ if ( removeClass( this, “asc” ) ) { addClass( this, “desc” ); rows.reverse(); } else { removeClass( this, “desc” ); addClass( this, “asc” ); rows.sort( ofType(this).n ); } })

First Implementation ✦ function sort(f) { cur = cur.sort(function(a,b){ if ( typeof f == ‘object’ ) var ret = f(a,b); else var ret = genericSort(a,b,f); if ( a < b ) b.parentNode.insertBefore( a, b ); else if ( a > b ) a.parentNode.insertBefore( b, a ); return ret; }); return this; } function reverse() { cur[0].parentNode.appendChild( cur[0] ); for ( var i = 1; i < cur.length; i++ ) cur[i-1].parentNode.insertBefore( cur[i], cur[i-1] ); cur = cur.reverse(); return this; }

Expression Parsing ✦ var t = “[title]”; var re = new RegExp( “^[([a-z0-9-]+)(~?^?=?)’?([^’]*)’?]”, “i” ); var m = re.exec(t); t = t.replace( re, “” ); alert( t + “---” + m[1] + “---” + m[2] );

Release! ✦ Released at BarCamp NYC (Jan 2006) ✦ “New Wave JavaScript” ✦ Hit Digg and del.icio.us/popular ✦ CSS + XPath ✦ DOM Modiﬁcation ✦ Events ✦ moo.fx-rewrite Animations

Download Builder

First Plugin ✦ 11 days later... ✦ JSON plugin ✦ “Unlike Prototype, jQuery doesn’t mess around with built-in JavaScript objects. It’s new—too new to have a version number!— but I’ve been writing some code with it and enjoying it.” ✦ http://mg.to/2006/01/25/json-for-jquery

Initial Choices ✦ The “$” war ✦ .style ✦ .onclick ✦ $(“id”) -> DOMElement DOMElement.onclick = jQuery method ✦ Creative Commons -> MIT ✦ No Ajax! -> Ajax!

“jQuery 2” ✦ May ‘06 ✦ <script type=”text/jquery”> pre: css ‘background’ ‘#212121’ css ‘color’ ‘#0F0’ css ‘padding’ ‘10px’ css ‘font-size’ ‘14px’ body: prepend ‘<h1>jquery<sup>2</sup></h1>’ input:ﬁrst: click compile input:last: click run </script>

Early Events ✦ SVN (May ‘06) / Trac ✦ Drupal ✦ Thickbox (April ‘06) ✦ Version 1.0 (August ‘06)

Teenage jQuery ✦ jQuery Magazine ✦ “Why jQuery is better”

Later Events ✦ Plugins Repository ✦ Evangelism Team

Progress ✦ 13 Releases (not including previews) ✦ 4200 Mailing List Subscribers ✦ 48% Developer Coverage (Ajaxian.com)

Who uses jQuery? • Digg • Miami Herald • Google • Food Network • NBC • REI • MSNBC • The Onion • Amazon • FeedBurner • Intel • PokerRoom • BBC • Warner Bros. • AOL • Def Jam • Oracle • Classmates • Cisco • Fandango • Newsweek • Pandora • Techonorati • isoHunt • Washington Post • Ask A Ninja • Sourceforge • Ars Technica • American Eagle • Linux.com • Salesforce • Joost • Newsgator • Barack Obama • Boston Globe • Nintendo • My YearBook • and more! • New York Post

jQuery: Now ✦ jQuery 1.2.1 ✦ jQuery UI

jQuery UI ✦ First major new project since jQuery ✦ Important new direction for the project ✦ Huge boost to interest

Future ✦ jQuery Test Suite ✦ jQuery UI ✦ Internationalization ✦ Forums

Test Suite ✦ Distributed ✦ Run in any browser ✦ Submit results back to central server ✦ UI Testing ✦ Automation ✦ Manual user tests

jQuery UI ✦ Reﬁne, improve ✦ Release new widgets ✦ More corporate support

Internationalization ✦ Individual language sites ✦ Dedicated documentation

Forums ✦ Mailing List just isn’t scaling ✦ Very frequent request ✦ Probably better suited to audience

Questions?

http://cachina.wordpress.com	128
http://blog.cachina.com.br	58
http://www.slideshare.net	17
http://127.0.0.1:8000	2
http://translate.googleusercontent.com	1
http://onwebdev.blogspot.com	1

History of jQuery

by jeresig on Oct 31, 2007

Accessibility

Categories

Tags

Upload Details

Usage Rights

6 Embeds 207

Statistics

History of jQuery — Presentation Transcript