Improvisational JavaScript

In the book Bossypants, Tina Fey gives three rules of improv: 1. Always say yes, 2. Say yes, and, 3. Make statements. These rules are a damn good approach to dealing with the unexpected in comedy or anything else. Error handling in JavaScript, for example. The way JS deals with exceptions is already a little unpredictable - instead of fighting that, let’s take advantage of it to create better user experiences, more powerful services, and room for hacks and happy accidents.

Transcript

1. Improvisational
   JavaScript
   what Tina Fey taught me about error handling
   

   View Slide

2. howdy
   Garann Means, @garannm
   engineer at Etsy
   Austin, Texas
   Node for Front-End Developers
   Austin All-Girl Hack Night, Girl Develop It
   Austin
   

   View Slide

3. this book right here
   

   View Slide

4. “bossypants”
   by Tina Fey
   30 Rock, Saturday Night Live, Mean Girls
   hilarious
   best-seller
   success without infallibility
   

   View Slide

5. fallibility
   e.g. Liz Lemon
   empathetic character
   a caricature of Ms. Fey
   conflict inherent in doing something
   without knowing if it’s the right thing
   == lulz!
   

   View Slide

6. javascript
   infallible!
   fallibility comes from the developer
   failure to account for edge cases
   ignorance of user
   “works for me” mindset
   

   View Slide

7. key difference
   fallibility in Tina Fey characters:
   hilarious
   relatable
   fallibility in JavaScript:
   not funny
   users/developers run away screaming
   

   View Slide

8. comedy
   cope with uncertainty, even tragedy
   guide to dealing with humans
   adjusts expectations of how the world
   works
   computers rely on us to communicate
   this, using our observations
   

   View Slide

9. rules of improv
   “Will Change Your Life and Reduce
   Belly Fat *”
   1. AGREE
   2. SAY YES, AND
   3. MAKE STATEMENTS
   4. THERE ARE NO MISTAKES
   

   View Slide

10. 14,000 results for “bossypants rules of improv”
    

    View Slide

11. business, fasting(?), feminism, scrum, life.......
    

    View Slide

12. improv for
    machines
    machines like Yes and No
    all things must be true or false
    grey areas need algorithms
    grey areas approximated by developers
    instead of programming right answers, we
    program ways to find right answers
    

    View Slide

13. let’s
    improv a user
    registration form!
    

    View Slide

14. AGREE
    all answers are saved
    even incomplete gibberish
    even illegal strings
    nothing executed, just safely cached
    

    View Slide

15. SAY YES, AND
    autocomplete
    context-sensitive hints
    reuse entered info
    e.g. mailing and billing address
    

    View Slide

16. MAKE
    STATEMENTS
    work with what you know
    e.g. show a preview user profile
    highlight incomplete data separately
    allow continued, sandboxed progress
    

    View Slide

17. NO MISTAKES
    suggest a stronger password
    make it a step to more privileges
    suggest a unique username
    show user ID until then
    

    View Slide

18. hopefully not news
    ideas already exist in UI philosophy
    JavaScript can do more.
    dynamic typing
    schema-less data stores
    flexibility unique to our language and
    sphere of implementation
    

    View Slide

19. let’s improv some $#@!@ JavaScripts
    

    View Slide

20. improv.js
    your JavaScript is an improv partner
    a framework
    a transpiler
    machine learning
    JavaScript don’t give a
    

    View Slide

21. AGREE
    JS has no method overloading
    i.e., JS has infinite method overloading!
    function foo can do several things
    use arguments to decide which
    

    View Slide

22. agreeable
    functions
    JavaScript wants to say yes
    check for existence
    typeof check
    Object.length
    

    View Slide

23. agreeing in the
    real world
    jQuery’s $()
    $( `#myThing` );
    $( document.getElementById( myThing ) );
    $( this );
    $( `` );
    same result for all
    

    View Slide

24. SAY YES, AND
    is there a callback?
    execute that callback
    can’t tell?
    go back to AGREE-ment
    at minimum, return chainable context object
    

    View Slide

25. affirmative return
    values
    design functions to alter a context
    always be next()ing
    JavaScript would like to talk your ear off
    

    View Slide

26. affirming the real
    world
    jQuery again
    people love that chainability
    put a callback on it
    luxury return values
    

    View Slide

27. MAKE
    STATEMENTS
    create helpful instances
    include the most information reasonable
    don’t hide information once set
    clarify what is application state and what
    is object state
    

    View Slide

28. imperative states
    return instances automatically
    set smart defaults
    allow access to the best picture of state
    possible from any object
    JS doesn’t know what it’s doing, but it’s
    doin it!
    

    View Slide

29. real world
    imperatives
    the good ol’ DOM
    all properties exist
    add more properties easily
    each element has its own state
    browser’s DOM API unaffected
    

    View Slide

30. NO MISTAKES
    try..catch should be a last resort
    if private property is accessible, it isn’t
    private
    type casting should be the norm, not an
    error
    AGREE or return this and GTFO
    

    View Slide

31. no-error error
    handling
    can’t run foo() with input bar?
    check for type, properties
    errors are the result of a developer
    failing to realize a use case
    JS just wants to make you happy
    

    View Slide

32. real world error
    handling
    try to execute an XHR
    timeouts
    wait, try again n times
    500 error
    try other methods
    

    View Slide

33. when things just
    fail
    JS has a thing for that
    error-first callbacks (or arguments)
    if an error callback isn’t supplied, gets
    swallowed
    developer opts in to error handling
    

    View Slide

34. improv.js and the golden rule
    

    View Slide

35. the golden rule
    code it like you have to use it
    frameworks
    transpilers
    UIs
    any tool you create
    

    View Slide

36. agreeable
    functions
    function’s goal is reuse
    good functions are decoupled
    functions usable in multiple ways will be
    used more
    people like useful functions
    

    View Slide

37. affirmative return
    values
    return true; === return “derp derp derp”;
    worst case? goes unused
    fewer modern functions are pure utilities
    async? return promises or subscribers
    functions that leave you hanging suck
    

    View Slide

38. imperative states
    clear and controllable picture of app
    expose carefully chosen, useful information
    protect abstractions for convenience, not
    out of distrust
    “that’s a good-lookin object!”
    

    View Slide

39. no-error error
    handling
    exceptions are useless
    nowhere to go from a dead stop
    multiple ways to provide opt-in error
    information
    developers know what they want, and JS
    wants to give it to them
    

    View Slide

40. errors
    become useless once you deploy to prod
    encourage narrower definitions of
    acceptable instead of broader ones
    every error thrown costs empathy points
    

    View Slide

41. the golden rule
    if your code is not a good improv
    partner, code and developer both fail
    code is meant to be built upon
    someone will use your code in a way you
    don’t expect
    

    View Slide

42. JavaScript wants to be empathetic
    

    View Slide

43. language features
    loosely defined function signatures
    ad-hoc object states, visibility
    no need to declare exceptions
    blurred line between users and
    developers
    

    View Slide

44. the future
    ES6, TypeScript, Dart?
    you can write JS in any language now
    JavaScript creates unique opportunities
    JS is comedy in a world of drama
    deals well with uncertainty
    

    View Slide

45. uncertainty is hard
    encouraging good coding practices
    chaining without object type guarantees
    potentially limitless state hierarchies
    continuing after errors in a useful state
    

    View Slide

46. uncertainty is
    awesome
    massively decoupled code
    exponential potential
    empathetic systems
    

    View Slide

47. JavaScript wants
    to be hilarious
    predictability is boring
    “legality” is boring
    forcing others to conform to your
    expectations is boring
    the way JS works is the way it works best
    

    View Slide

48. * JavaScript will not reduce belly fat.
    

    View Slide

49. image credits
    http://www.flickr.com/photos/penelopejonze/3693651284/
    http://www.flickr.com/photos/derivativeofcourse/6794700318/
    http://www.flickr.com/photos/35442027@N08/3447109640/in/
    photostream/
    http://www.flickr.com/photos/rakka/4643831214/
    http://www.flickr.com/photos/rakka/3096769092/
    http://www.flickr.com/photos/rakka/2536040927/
    http://www.flickr.com/photos/fieldtripp/3116937266/
    

    View Slide