Improvisational
JavaScript
what Tina Fey taught me about error handling
Slide 2
Slide 2 text
howdy
Garann Means, @garannm
engineer at Etsy
Austin, Texas
Node for Front-End Developers
Austin All-Girl Hack Night, Girl Develop It
Austin
Slide 3
Slide 3 text
this book right here
Slide 4
Slide 4 text
“bossypants”
by Tina Fey
30 Rock, Saturday Night Live, Mean Girls
hilarious
best-seller
success without infallibility
Slide 5
Slide 5 text
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!
Slide 6
Slide 6 text
javascript
infallible!
fallibility comes from the developer
failure to account for edge cases
ignorance of user
“works for me” mindset
Slide 7
Slide 7 text
key difference
fallibility in Tina Fey characters:
hilarious
relatable
fallibility in JavaScript:
not funny
users/developers run away screaming
Slide 8
Slide 8 text
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
Slide 9
Slide 9 text
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
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
Slide 13
Slide 13 text
let’s
improv a user
registration form!
Slide 14
Slide 14 text
AGREE
all answers are saved
even incomplete gibberish
even illegal strings
nothing executed, just safely cached
Slide 15
Slide 15 text
SAY YES, AND
autocomplete
context-sensitive hints
reuse entered info
e.g. mailing and billing address
Slide 16
Slide 16 text
MAKE
STATEMENTS
work with what you know
e.g. show a preview user profile
highlight incomplete data separately
allow continued, sandboxed progress
Slide 17
Slide 17 text
NO MISTAKES
suggest a stronger password
make it a step to more privileges
suggest a unique username
show user ID until then
Slide 18
Slide 18 text
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
Slide 19
Slide 19 text
let’s improv some $#@!@ JavaScripts
Slide 20
Slide 20 text
improv.js
your JavaScript is an improv partner
a framework
a transpiler
machine learning
JavaScript don’t give a
Slide 21
Slide 21 text
AGREE
JS has no method overloading
i.e., JS has infinite method overloading!
function foo can do several things
use arguments to decide which
Slide 22
Slide 22 text
agreeable
functions
JavaScript wants to say yes
check for existence
typeof check
Object.length
Slide 23
Slide 23 text
agreeing in the
real world
jQuery’s $()
$( `#myThing` );
$( document.getElementById( myThing ) );
$( this );
$( `` );
same result for all
Slide 24
Slide 24 text
SAY YES, AND
is there a callback?
execute that callback
can’t tell?
go back to AGREE-ment
at minimum, return chainable context object
Slide 25
Slide 25 text
affirmative return
values
design functions to alter a context
always be next()ing
JavaScript would like to talk your ear off
Slide 26
Slide 26 text
affirming the real
world
jQuery again
people love that chainability
put a callback on it
luxury return values
Slide 27
Slide 27 text
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
Slide 28
Slide 28 text
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!
Slide 29
Slide 29 text
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
Slide 30
Slide 30 text
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
Slide 31
Slide 31 text
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
Slide 32
Slide 32 text
real world error
handling
try to execute an XHR
timeouts
wait, try again n times
500 error
try other methods
Slide 33
Slide 33 text
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
Slide 34
Slide 34 text
improv.js and the golden rule
Slide 35
Slide 35 text
the golden rule
code it like you have to use it
frameworks
transpilers
UIs
any tool you create
Slide 36
Slide 36 text
agreeable
functions
function’s goal is reuse
good functions are decoupled
functions usable in multiple ways will be
used more
people like useful functions
Slide 37
Slide 37 text
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
Slide 38
Slide 38 text
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!”
Slide 39
Slide 39 text
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
Slide 40
Slide 40 text
errors
become useless once you deploy to prod
encourage narrower definitions of
acceptable instead of broader ones
every error thrown costs empathy points
Slide 41
Slide 41 text
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
Slide 42
Slide 42 text
JavaScript wants to be empathetic
Slide 43
Slide 43 text
language features
loosely defined function signatures
ad-hoc object states, visibility
no need to declare exceptions
blurred line between users and
developers
Slide 44
Slide 44 text
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
Slide 45
Slide 45 text
uncertainty is hard
encouraging good coding practices
chaining without object type guarantees
potentially limitless state hierarchies
continuing after errors in a useful state
Slide 46
Slide 46 text
uncertainty is
awesome
massively decoupled code
exponential potential
empathetic systems
Slide 47
Slide 47 text
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