Date post: | 15-Jan-2015 |
Category: |
Technology |
Upload: | jarrod-overson |
View: | 814 times |
Download: | 0 times |
JARROD OVERSON
MANAGING
JAVASCRIPT@jsoversonCOMPLEXITY
WHO ISRIOT
WE MAKE A GAME
A GAME THAT GOT HUGE
BUT I JUST MAKE WEB
STUFF
THE WEB IS AWESOME
BUT, WE NEED TO TALK.
PEAK OF INFLATED EXPECTATIONS
TROUGH OF DISILLUSIONMENT
HTML5
MOBILE WEB APPS
PLATEAU OF REALITY
The Web Platform
2008 2009 2010 2011 2012 2013 2014 NOW WE CAN MOVE ON
STEP TWO
STEP ONE
STEP THREE
HONESTY
DYNAMIC LANGUAGES ARE MESSY.1.
COMING TO TERMS
Combine the normal pitfalls with !• Immature IDEs and tooling • Wildly variable module styles • Best practices that vary monthly • Similar yet vastly different ecosystems
THE TALENT POOL IS NUTS.2.
COMING TO TERMS
Web Platform Engineers
jQuery Experts
Made a menu fade in once
async wat?
PROGRESS IS STAGGERING.3.
COMING TO TERMS
It’s hard to keep up. !Everyone has an opinion. !The future doesn’t get here all at once.
REFACTORING JAVASCRIPT IS NOT EASY.4.
COMING TO TERMS
Callback hell is more than just deep nesting. !IDEs can’t help much yet. !Flexibility is more important here than anywhere.
THE WEB IS HARD!5.
COMING TO TERMS
Web applications are not solved. !Even the giants pivot and backtrack. !So many solutions just don’t exist yet.
WHY ARE WE EVEN HERE?
JAVASCRIPTWON
AND THIS ISN’T EVEN ITS FINAL FORM
STEP ONE
STEP THREE
ACCEPTANCESTEP TWO
RESPECT YOUR JAVASCRIPT
‣ Indentation style ‣ Line length ‣ Quote styles ‣ Naming conventions ‣ Curly brace placement ‣ Directory structure ‣ Everything
GET EVERYONE TOGETHER
ENFORCE
‣ Use community tools ‣ Grunt ‣ Gulp ‣ JSHint ‣ etc
‣ Warnings === errors ‣ Make it hard to be
wrong
DOCUMENT
‣ Treat docs as code ‣ Make it
‣ easy to find ‣ easy to read ‣ easy to update ‣ easy to discuss
‣ Use github!
AGREE
RESPECT THE COMMUNITY
RESPECT THE COMMUNITY
>90% use last comma
http://sideeffect.kr/popularconvention/#javascript
>80% indent with spaces
>55% use single quotes
https://github.com/Seravo/js-winning-style
https://github.com/rwaldron/idiomatic.js/
Research public style guides
VIOLATIONS BEGET VIOLATIONS
ALLOW 1 & ALLOW 1,000
KNOW YOUR OPTIONS
JSHINT
ESLINT
JSCS
Community-driven JSLint fork. High configurability.
JSHint alternative. High configurability.
Code style checker. Good complement to JSHint.
WHAT ABOUT JSLINT AND CLOSURE LINTER?
KNOW YOUR OPTION’S OPTIONS
BE AGGRESSIVE. YOUR FEELINGS WILL GET HURT.
SMART DEVIATION IS OK AND EXPECTED
!!function fn(param) { /*jshint eqeqeq:false*/ ! if (param == 42) return; !}
SET NUMERIC LIMITS
"maxparams" : 4 "maxdepth" : 4 "maxstatements" : 20 "maxlen" : 100 "maxcomplexity" : 7
WHAT ISCOMPLEXITY?CYCLOMATIC
TECHNICALLY
CYCLOMATIC COMPLEXITY IS THE NUMBER OF PATHS
THROUGH YOUR CODE
PRACTICALLY
CYCLOMATIC COMPLEXITY IS HOW HARD
YOUR CODE IS TO TEST
COMPLEXITY : 1
!function main(a) { !}
COMPLEXITY : 2
function main(a) { if (a > 5) { } }
COMPLEXITY : ?
function main(a) { if (a > 5) { ! } else { ! } }
COMPLEXITY : 3
function main(a) { if (a > 10) { ! } else if(a > 5) { ! } }
COMPLEXITY : ?
function main(a) { if (a > 5) { if (a > 10) { ! } } }
COMPLEXITY : 7function main(a) { if (a) { } else if (a) { } ! if (other) { } ! for (var i = 0; i < a; i++) { if (i % 2) { } else if (i % 3) { } } }
I KNOW WHAT YOU’RE THINKINGI’M
GOING TO MAKE THE MOST AMAZING .JSHINTRC
EVER
BUT IT’S NOT THAT EASY
STEP TWO
STEP ONE
PERSEVERANCE
STEP THREE
VISUALIZE YOUR GOAL
YOUR GOAL
THE PATH
FILES PASSING IDEAL SETTINGS
THE PATH
FILES IN NEED OF LARGER REFACTOR
THE PATH
QUICK WINS
OTHER METRICS
HALSTEAD METRICS
CODE COVERAGE
MAINTAINABILITY
LINES OF CODE
MAINTAINABILITY?fn(averageEffort, averageComplexity, averageLines);
fn(difficulty, volume)fn(length, vocabulary)
fn(uniqueOperators, totalOperands, uniqueOperands)
fn(uniqueOperators, uniqueOperands)
fn(totalOperators, totalOperands)
MAURICE HALSTEADHALSTEAD METRICS
PHIL BOOTH ARIYA HIDAYATTHOMAS MCCABECYCLOMATIC COMPLEXITY COMPLEXITY ANALYSIS JS STATIC ANALYSIS
WHO TO BLAME
THE UNEXAMINED CODE IS NOT WORTH RELEASING
“
”- SOCRATES
CODE IS NOT JUST LOGIC.CODE IS AN API.
TREAT IT LIKE ONE.
Recap
PERSEVERANCE
The web has unique value, it’s not a cheap alternative to native apps.
Embrace the web and JavaScript as your platform.
Create new tools. Automate & visualize everything.
ACCEPTANCE
HONESTY
JARROD OVERSON
MANAGING
JAVASCRIPT@jsoversonCOMPLEXITY
Office hours @ 2:10pm