• Like

Loading…

Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

has.js

  • 1,909 views
Published

has.js presentation from AustinJS 16 Nov 2010

has.js presentation from AustinJS 16 Nov 2010

Published in Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
1,909
On SlideShare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
8
Comments
0
Likes
2

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. HAS.JS @austinjs :: 16 Nov 2010 :: Peter Higgins
  • 2. Me. Dojo Toolkit Project Lead JavaScript Engineer @joost / Adconion Blogs Infrequently :: http://higginsforpresident.net Codes @GitHub :: http://github.com/phiggins42 Twitter: @phiggins Beer Drinking Expert
  • 3. THE DOJO FOUNDATION > Dojo Toolkit ... http://dojofoundation.org
  • 4. UA Sniffing agreeably bad easy to avoid ... mostly sometimes impossible or asynchronous. or unacceptable expense.
  • 5. FEATURE DETECTION To the rescue ...
  • 6. Intent Destroy Be Modernizr++! https://github.com/Modernizr/Modernizr End Browser Sniffing
  • 7. has.js, now pure feature detection library minimal api minimal code size consistent conventions normalize names
  • 8. prefab tests: (function(has, addtest, cssprop){ var toString = {}.toString, NEW_DATE = new Date, FUNCTION_CLASS = "[object Function]"; // Date tests addtest("date-toisostring", function(){ return toString.call(NEW_DATE.toISOString) == FUNCTION_CLASS; }); addtest("date-tojson", function(){ return toString.call(NEW_DATE.toJSON) == FUNCTION_CLASS; }); addtest("date-now", function(){ return toString.call(Date.now) == FUNCTION_CLASS; }); })(has, has.add, has.cssprop);
  • 9. has.js “categories” Array Function Audio Graphics CSS JSON DOM Video Events bugs, etc. Form (html5y)
  • 10. using has if(!has("date-tojson")){ Date.prototype.toJson = function(){ /* spec based supplemental shim */ } } mylib.trim = has("string-trim") ? function(str){ return str.trim(); } : function(str){ /* regexp/replace that guy */ };
  • 11. exposed API has.addtest("my-funkytest", function(g, d, el){ // g: Reference to global, typically `window` // d: Refered to `document` element // el: an element to use. // returns: Boolean; return true; }); has.addtest("my-othertest", function(){ return true; }, true); // immediately if(has("my-funkytest") && has("my-othertest")){ /* win. */ }
  • 12. exposed API has.cssprop = function(name, el){ // does this element support this css property } has.clearElement = function(el){ // empty this element } has.isHostType = function(obj, prop){ // check if the return type is different from the actual data type }
  • 13. The plan Collect Data. Make a builder ... and other tooling. More tests. Solve the async thing.
  • 14. Collecting Data Pre-populated test results var _testCache = g.globalexistingtestcache || {}; Session Based Testing? Browser Support Matrix Platform Specific Builds Mobile, Browser, Server ...
  • 15. Collected Data http://dante.dojotoolkit.org/hasjs/tests/runTests.html http://fmbip.com/hasjs (ads?)
  • 16. Building Closure Compiler Advanced Mode Dead path removal? http://code.google.com/closure/compiler/
  • 17. Builder, step two. mylib.trim = has("string-trim") ? function(str){ return str.trim(); } : function(str){ /* regexp/replace that guy */ }; // build = { “string-trim”:“true” } becomes: my.trim = true ? function(a){ return a.trim(); } : function(a){ /* ... */ }; // becomes: my.trim = function(a){ return a.trim(); }
  • 18. Hopes and Dreams Dojo 2.0, dojo-fd Common standard codebase for libraries or personal consumption ... CommonBrowserJS (#cbjs) über.js - https://github.com/phiggins42/uber.js es5shim? build option?
  • 19. has.js https://github.com/phiggins42/has.js http://hasjs.org #hasjs @ irc.freenode.net
  • 20. AAAAND THANKS. I promise I’m done talking.
  • 21. Me, again: http://dante.dojotoolkit.org http://higginsforpresident.net http://twitter.com/phiggins http://github.com/phiggins42 phiggins @ irc.freenode.net