What jQuery is Doing on Standards

Transcript

1. Why do they matter? STANDARDS

2. ▪ Why should I care? ▪ What is the process?

   ▪ Status and Success Stories EXPECTATIONS.

3. WHY SHOULD YOU CARE?

4. THE FUTURE IS COMING.

5. 0% 15% 30% 45% 60% 75% 90% 2006 2007 2008

   2009 2010 2011 2012 IE6 IE7 IE8 IE9

6. 0% 15% 30% 45% 60% 75% 90% 2006 2007 2008

   2009 2010 2011 2012 IE6

7. 0% 15% 30% 45% 60% 75% 90% 2006 2007 2008

   2009 2010 2011 2012 IE7

8. 0% 15% 30% 45% 60% 75% 90% 2006 2007 2008

   2009 2010 2011 2012 IE8

9. 0% 15% 30% 45% 60% 75% 90% 2006 2007 2008

   2009 2010 2011 2012 IE9

10. 2008 2009 2010 2011 2012 0% 10% 20% 30% 40%

    Firefox 2 Firefox 3 Firefox 3.5 Firefox 3.6 Firefox 5 Firefox 6 Firefox 11 Firefox 12 Firefox 13 Chrome 2 Chrome 3 Chrome 5 Chrome 6 Chrome 12 Chrome 13 Chrome 14 Chrome 18 Chrome 19

11. 2008 0% 8% 15% 23% 30% Firefox 2 Firefox 3

12. 2009 0% 10% 20% 30% 40% Firefox 2 Firefox 3

    Firefox 3.5 Chrome 2 Chrome 3

13. 2010 0% 10% 20% 30% 40% Firefox 3 Firefox 3.5

    Firefox 3.6 Chrome 5 Chrome 6

14. 2011 0% 10% 20% 30% 40% Firefox 3.6 Firefox 5

    Firefox 6 Chrome 12 Chrome 13 Chrome 14

15. 2012 0% 10% 20% 30% 40% Firefox 3.6 Firefox 11

    Firefox 12 Firefox 13 Chrome 18 Chrome 19

16. SLOW TAIL. FAST PATH.

17. SLOW TAIL SHRINKING.

18. CUTTING EDGE GROWING.

19. CUTTING EDGE SPEEDING UP.

20. HOW DOES IT WORK?

21. IMPLEMENTORS. "Standards committees should not be the ones who get

    to invent the future"

22. IMPLEMENTORS AND INCREASINGLY LIBRARY AUTHORS.

23. SUGAR VS PRIMITIVES.

24. CONSENSUS.

25. WORKERS RULE THE ROOST.

26. Working Draft (WD) Last Call (LC) Candidate Recommendation (CR) Proposed

    Edited Recommendation (PER) Proposed Recommendation (PR) Web Standard Selectors API 2, Shadow DOM, File API, DOM4, HTML5 Selectors 1, Flexbox, WebSockets, IndexedDB, CSS Paged Media Resource Timing, Battery Status, Web Workers, Web Storage XSLT Geolocation, URI Fragments Selectors 3, DOM3, HTML4, CSS 2.1, Media Queries

27. FEEDBACK.

28. Working Draft (WD) Last Call (LC) Candidate Recommendation (CR) Proposed

    Edited Recommendation (PER) Proposed Recommendation (PR) Web Standard Selectors API 2, Shadow DOM, File API, DOM4, HTML5 Selectors 1, Flexbox, WebSockets, IndexedDB, CSS Paged Media Resource Timing, Battery Status, Web Workers, Web Storage XSLT Geolocation, URI Fragments Selectors 3, DOM3, HTML4, CSS 2.1, Media Queries

29. Working Draft (WD) Last Call (LC) Candidate Recommendation (CR) Proposed

    Edited Recommendation (PER) Proposed Recommendation (PR) Web Standard Selectors API 2, Shadow DOM, File API, DOM4, HTML5 Selectors API 1, Flexbox, WebSockets, IndexedDB, Paged Media Resource Timing, Battery Status, Web Workers, Web Storage XSLT Geolocation, URI Fragments Selectors 3, DOM3, HTML4, CSS 2.1, Media Queries

30. Working Draft (WD) Last Call (LC) Candidate Recommendation (CR) Proposed

    Edited Recommendation (PER) Proposed Recommendation (PR) Web Standard Selectors API 2, Shadow DOM, File API, DOM4, HTML5 Selectors API 1, Flexbox, WebSockets, IndexedDB, Paged Media Resource Timing, Battery Status, Web Workers, Web Storage XSLT Geolocation, URI Fragments Selectors 3, DOM3, HTML4, CSS 2.1, Media Queries

31. MAILING LISTS.

32. PUBLIC-WEBAPPS. PUBLIC-HTML. WWW-STYLE. (ES-DISCUSS).

33. COMPLAINTS

34. MOTHERFUCKER I WANT A GRID!

35. LAYOUT SUCKS!

36. A WILD GRID LAYOUT APPEARS.

37. WHY CAN'T I CENTER SHIT!?

38. A WILD FLEXBOX APPEARS.

39. <style> .parent { display: box; box-align: center; box-pack: center; width:

    300px; height: 300px; margin: 0; padding: 0; background-color: black; } .child { width: 100px; height: 100px; background-color: #ccc; } </style> <div class="parent"> <div class="child"></div> </div> FLEXBOX.

40. IT WORKS!

41. IMPLEMENTORS ARE WORKING ON MOST OF THE IMPORTANT PROBLEMS.

42. IMPLEMENTOR ARE THE STANDARDS BODIES.

43. THEY NEED AND WANT OUR HELP!

44. EXAMPLES

45. QUERYSELECTORALL.

46. BROKEN :(

47. SCUMBAG BROWSERS COPY JQUERY FEATURE, IGNORE BUG REPORTS BY JQUERY

    AUTHOR

48. <div class="grandparent"> <p class="parent"> <span class="child"></span> </p> </div> <script> document.querySelectorAll(".parent")

    .querySelectorAll("div span"); </script> QSA.
49. None
50. None

51. ▪ <style scoped> and :scope uni cation ▪ Explicit use

    of :scope ▪ Naming ▪ .matchesSelector => .matches ▪ Semantics of .matches ▪ XPath (!?) ▪ Combinators (.find("> div")) ▪ Return type (Array, NodeList?) ISSUES.
52. None

53. DOCUMENT.PARSE

54. document.createElement("div"); div.innerHTML = "<td>hi</td>"; INNERHTML.

55. $("<td>hi</td>") .appendTo("tr"); UH OH.

56. var isTD = /^\s*<td/, depth = 0; if (isTD.test(string)) {

    string = "<table><tr>" + string + "</tr></table>"; depth = 2; } // ... SOLUTION.

57. wrapMap = { option: [ 1, "<select multiple='multiple'>", "</select>" ],

    legend: [ 1, "<fieldset>", "</fieldset>" ], thead: [ 1, "<table>", "</table>" ], tr: [ 2, "<table><tbody>", "</tbody></table>" ], td: [ 3, "<table><tbody><tr>", "</tr></tbody></table>" ], col: [ 2, "<table><tbody></tbody><colgroup>", "</colgroup></table>" ], area: [ 1, "<map>", "</map>" ], _default: [ 0, "", "" ] } JQUERY.

58. var fragment = Document.parse("<td>hi</td>"); DOCUMENT.PARSE.

59. None

60. CONSENSUS OF WHO?

61. WHY NOT US! "Standards committees should not be the ones

    who get to invent the future" Standards committees are not some weird, distant thing. They're us!

62. If I am not for myself, then who will be

    for me? And if I am only for myself, then what am I? And if not now, when? “

63. THE FUTURE IS COMING.

64. LET'S BE PART OF IT.

65. THANKS!

66. @WYCATS