State of jQuery  Spring 2011     John Resig
State of the Project
Project
Spending Money• All expenditures are handled via public  voting• What have we spent money on? • Team Meetings • Conference...
Sponsored Projects• jQuery UI • Scott G• jQuery Mobile • Filament Group• jQuery UI Grid • Richard, Joern, and Scott
Spending Money• What will we be spending money on? • Getting more developer time to train and    mentor new developers • D...
New Team and Eboard• Recently Joined: • Adam Sontag   • Working with the UI and Bug Triage      teams • Dan Heberden  • Wo...
jQuery Core and Bug Triage Teams• We’ve added a number of new committers  • Dave Methvin (dmethvin)  • Julian Aubourg (jau...
New CoreDevelopment Process• Weekly, public, team meetings• Defined release dates and schedule• Frequent discussion in #jqu...
Weekly Meeting Notes
Bug Triage Team• Responsible for processing all the bugs in  the bug tracker  • Make sure test cases are filed• Work throug...
Bugs
Roadmap Decisions• Put up a public form for people to submit  possible feature suggestions• The team works through all the...
Roadmap
New Releases• jQuery 1.4.4, 1.5, 1.5.1, 1.5.2, and 1.6!• Official Plugins Status• jQuery Mobile Alphas 2, 3, and 4
jQuery 1.6b1• Whole bunch of improvements • Rewrite of .attr()
.attr() Rewrite•   Provide a full series of .attr() hooks•   jQuery.attrHooks.selected = {        set: function( elem, val...
.prop()• Split apart attr/prop: • .attr(“selected”) -> “selected” • .prop(“selectedIndex”) -> 1 • .prop(“selected”) -> true
.attr() Performance• This rewrite also yields performance  increases of around 85%!
valHooks• Similar to cssHooks and valHooks but  handles .val() as well  • Inputs tend to have different support    dependi...
Better Support Tests• Interesting technique: • document.createElement(“body”) • Do it before the DOM is ready! • You can d...
:focus Selector• Make sure :focus works on all platforms:  $(“input:focus”) -> Find the focused input
Faster Triggering and         Data• Triggering performance has been improved  dramatically  • Which increases the performa...
Convenient Methodsfor Checking Elements• .is( Element ) • Simpler way to check equality• .filter( Element ) • Check if a se...
Synced Animations• Make it possible to ensure that animations  run at the same time  • Yielding animations that are less “...
requestAnimationFrame• New feature provided by the browser• Makes it easier to create high  performance, smoother, animati...
$.map( Object )• $.map( Array ) worked before• Now $.map( Object ) can map properties  to other values• $.map({ test: 1 },...
Use Function.prototype.bind• Use the method for jQuery.proxy()• Utilize the browsers native binding  mechanism  • Force th...
Relative .css()• Bringing the functionality back  from .animate():  • .css( “height”, “+=10” )  • Updates the height relat...
Official Plugins• We’ve made a change in policy regarding  official plugins• Official plugins will be maintained by the  jQue...
Existing Plugins• Into the jQuery Core team: • Color, Mousewheel, Easing, CSS Hooks• Into the jQuery UI team: • jQuery Tem...
jQuery Mobile
Response• Response has been overwhelmingly positive• We’re getting support from major mobile  browsers • RIM, Nokia, IE Mo...
Better Browser         Support• Firefox Mobile• Opera Mobile and Mini• Windows Phone 7 • (and Internet Explorer itself!)
What’s Landed?• Tons of bug fixes and enhancements• Ajax form handling• Unit Tests (!)• Excellent keyboard and accessibilit...
Rewrites• Faster performance across the board• All widgets using jQuery UI widget factory
Navigation Refactored• Rewrite of core navigation model • Including using the new pushState!• history.pushState(stateObj, ...
Media Query Helpers• New classes: .portrait, .landscape• label.ui-input-text {  	 display: block;  }  .min-width-480px lab...
Namespaced data-• jQuery Mobile is predominantly configured  through data- attributes• <div data-role=”page”></div>• You ca...
“Fast Click”• It’s surprisingly hard to make click, and  other mouse events, work as fast as  possible• There are a number...
Mobile Beta• jQuery Mobile Beta 1 is the next upcoming  release!• Even though it’s an alpha many people are  already deplo...
Enjoy the Conference!• More information: • http://blog.jquery.com/ (jQuery 1.6b1) • http://jquerymobile.com/
jQuery Keynote - Spring 2011
jQuery Keynote - Spring 2011
jQuery Keynote - Spring 2011
jQuery Keynote - Spring 2011
Upcoming SlideShare
Loading in...5
×

jQuery Keynote - Spring 2011

6,461

Published on

Keynote talk given at the 2011 jQuery Conference in the SF Valley.

Published in: Technology
0 Comments
10 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
6,461
On Slideshare
0
From Embeds
0
Number of Embeds
2
Actions
Shares
0
Downloads
99
Comments
0
Likes
10
Embeds 0
No embeds

No notes for slide

jQuery Keynote - Spring 2011

  1. 1. State of jQuery Spring 2011 John Resig
  2. 2. State of the Project
  3. 3. Project
  4. 4. Spending Money• All expenditures are handled via public voting• What have we spent money on? • Team Meetings • Conferences • Developer time
  5. 5. Sponsored Projects• jQuery UI • Scott G• jQuery Mobile • Filament Group• jQuery UI Grid • Richard, Joern, and Scott
  6. 6. Spending Money• What will we be spending money on? • Getting more developer time to train and mentor new developers • Design work and jQuery Mobile • More team meetings and conferences
  7. 7. New Team and Eboard• Recently Joined: • Adam Sontag • Working with the UI and Bug Triage teams • Dan Heberden • Working with Infrastructure and Bug Triage team
  8. 8. jQuery Core and Bug Triage Teams• We’ve added a number of new committers • Dave Methvin (dmethvin) • Julian Aubourg (jaubourg) • Anton Matzneller (jitter) • Timmy Willison (timwillison)• We also got a ton of help from Colin Snover in organizing the team.
  9. 9. New CoreDevelopment Process• Weekly, public, team meetings• Defined release dates and schedule• Frequent discussion in #jquery-dev (IRC) • Active participation of the committers and the bug triage team
  10. 10. Weekly Meeting Notes
  11. 11. Bug Triage Team• Responsible for processing all the bugs in the bug tracker • Make sure test cases are filed• Work through pulls in the Github pull request queue• Make sure the test suite is passing
  12. 12. Bugs
  13. 13. Roadmap Decisions• Put up a public form for people to submit possible feature suggestions• The team works through all the feature suggestions and creates a list • All of this is done in a publicly and discussed in a public meeting
  14. 14. Roadmap
  15. 15. New Releases• jQuery 1.4.4, 1.5, 1.5.1, 1.5.2, and 1.6!• Official Plugins Status• jQuery Mobile Alphas 2, 3, and 4
  16. 16. jQuery 1.6b1• Whole bunch of improvements • Rewrite of .attr()
  17. 17. .attr() Rewrite• Provide a full series of .attr() hooks• jQuery.attrHooks.selected = { set: function( elem, value ) { if ( value === false ) { jQuery.removeAttr(elem, “selected”); return value; } } };
  18. 18. .prop()• Split apart attr/prop: • .attr(“selected”) -> “selected” • .prop(“selectedIndex”) -> 1 • .prop(“selected”) -> true
  19. 19. .attr() Performance• This rewrite also yields performance increases of around 85%!
  20. 20. valHooks• Similar to cssHooks and valHooks but handles .val() as well • Inputs tend to have different support depending upon the platform• Getting value is over 147% faster!
  21. 21. Better Support Tests• Interesting technique: • document.createElement(“body”) • Do it before the DOM is ready! • You can do visual DOM tests before they’re displayed • Prevents flash of unstyled content
  22. 22. :focus Selector• Make sure :focus works on all platforms: $(“input:focus”) -> Find the focused input
  23. 23. Faster Triggering and Data• Triggering performance has been improved dramatically • Which increases the performance of .data() as a result!• .data() is around 115% faster!
  24. 24. Convenient Methodsfor Checking Elements• .is( Element ) • Simpler way to check equality• .filter( Element ) • Check if a set has an element• .find( Element ) • Equivalent to .contains()
  25. 25. Synced Animations• Make it possible to ensure that animations run at the same time • Yielding animations that are less “glitchy”• Animations are all run at the same timer cluster (timers tend to run every 15ms or so, depending upon the browser)
  26. 26. requestAnimationFrame• New feature provided by the browser• Makes it easier to create high performance, smoother, animations
  27. 27. $.map( Object )• $.map( Array ) worked before• Now $.map( Object ) can map properties to other values• $.map({ test: 1 }, function( name, value ) { return value + 1; });
  28. 28. Use Function.prototype.bind• Use the method for jQuery.proxy()• Utilize the browsers native binding mechanism • Force the `this` of a function to be a particular object
  29. 29. Relative .css()• Bringing the functionality back from .animate(): • .css( “height”, “+=10” ) • Updates the height relative to the current height
  30. 30. Official Plugins• We’ve made a change in policy regarding official plugins• Official plugins will be maintained by the jQuery team (UI, Core)• Only plugins that fit into those teams will be supported
  31. 31. Existing Plugins• Into the jQuery Core team: • Color, Mousewheel, Easing, CSS Hooks• Into the jQuery UI team: • jQuery Templates
  32. 32. jQuery Mobile
  33. 33. Response• Response has been overwhelmingly positive• We’re getting support from major mobile browsers • RIM, Nokia, IE Mobile• And major companies: • Microsoft, Adobe, Brightcove, BBC
  34. 34. Better Browser Support• Firefox Mobile• Opera Mobile and Mini• Windows Phone 7 • (and Internet Explorer itself!)
  35. 35. What’s Landed?• Tons of bug fixes and enhancements• Ajax form handling• Unit Tests (!)• Excellent keyboard and accessibility support• Touch optimized datepicker• Working great in PhoneGap
  36. 36. Rewrites• Faster performance across the board• All widgets using jQuery UI widget factory
  37. 37. Navigation Refactored• Rewrite of core navigation model • Including using the new pushState!• history.pushState(stateObj, "page 2", "bar.html");• URL now becomes: /bar.html• (but an actual page load isn’t done!)
  38. 38. Media Query Helpers• New classes: .portrait, .landscape• label.ui-input-text { display: block; } .min-width-480px label.ui-input-text { display: inline-block; }
  39. 39. Namespaced data-• jQuery Mobile is predominantly configured through data- attributes• <div data-role=”page”></div>• You can now namespace the attributes, if you wish.• <div data-jqm-role=”page”></div>
  40. 40. “Fast Click”• It’s surprisingly hard to make click, and other mouse events, work as fast as possible• There are a number of assumptions in place regarding touch events that make this hard.• We now fix this straight in jQuery Mobile.
  41. 41. Mobile Beta• jQuery Mobile Beta 1 is the next upcoming release!• Even though it’s an alpha many people are already deploying applications that work great.
  42. 42. Enjoy the Conference!• More information: • http://blog.jquery.com/ (jQuery 1.6b1) • http://jquerymobile.com/
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×