The wheel is spinning but the hamster is almost dead - Smartweb 2015

73
THE WHEEL IS SPINNING, BUT THE HAMSTER IS DEAD… CHRIS HEILMANN @CODEPO8, SMARTWEB, BUCHAREST, SEPTEMBER 2015

Transcript of The wheel is spinning but the hamster is almost dead - Smartweb 2015

Page 1: The wheel is spinning but the hamster is almost dead - Smartweb 2015

THE WHEEL IS SPINNING, BUT THE HAMSTER IS DEAD…

CHRIS HEILMANN (﴾@CODEPO8)﴿, SMARTWEB, BUCHAREST, SEPTEMBER 2015

Page 2: The wheel is spinning but the hamster is almost dead - Smartweb 2015

HI THERE!

Page 3: The wheel is spinning but the hamster is almost dead - Smartweb 2015

HOW ARE YOU?

Page 4: The wheel is spinning but the hamster is almost dead - Smartweb 2015

I assume that after a full day of great talks and meeting people who work in the same space as you,

THINGS ARE GREAT!

Page 5: The wheel is spinning but the hamster is almost dead - Smartweb 2015

Inspired Fascinated

Excited Hopeful

… a bit overwhelmed?

YOU PROBABLY ARE

Page 6: The wheel is spinning but the hamster is almost dead - Smartweb 2015

GOOD! HOLD ON TO THIS FEELING!

Page 7: The wheel is spinning but the hamster is almost dead - Smartweb 2015

DON’T GO BACK INTO THE OTHER MODE THAT IS VERY COMMON THESE DAYS…

Page 8: The wheel is spinning but the hamster is almost dead - Smartweb 2015

THAT FEELING THAT YOU DON’T BELONG…

Page 9: The wheel is spinning but the hamster is almost dead - Smartweb 2015

THAT FEELING THAT YOU’RE NOT GOOD ENOUGH…

Page 10: The wheel is spinning but the hamster is almost dead - Smartweb 2015

THE FEELING THAT YOU CAN’T CONTRIBUTE ANYTHING USEFUL…

Page 11: The wheel is spinning but the hamster is almost dead - Smartweb 2015

THE FEELING THAT YOU SHOULD APOLOGISE FOR NOT USING THE NEWEST AND COOLEST…

Page 12: The wheel is spinning but the hamster is almost dead - Smartweb 2015

DO NOT GO THERE -‐ AGAIN

Page 13: The wheel is spinning but the hamster is almost dead - Smartweb 2015

BECAUSE…

…IT IS ALL BULLSHIT WE TELL OURSELVES

Page 14: The wheel is spinning but the hamster is almost dead - Smartweb 2015

A LOT OF THE STRESS WE FEEL IS HOME-‐MADE. WE DRAG ONE ANOTHER DOWN.

Page 15: The wheel is spinning but the hamster is almost dead - Smartweb 2015

WE TURNED ENGINEERING INTO A RELIGION -‐ WITH ALL THE DOGMA AND HOLY WARS THAT COMES WITH.

Page 16: The wheel is spinning but the hamster is almost dead - Smartweb 2015

WE EXPECT EVERYBODY TO GET PURE HAPPINESS FROM CODING…

https://twitter.com/sarahmei/status/597276242887348224

Page 17: The wheel is spinning but the hamster is almost dead - Smartweb 2015

WORKING AT A PACE NO HUMAN SHOULD WORK IN…

Page 18: The wheel is spinning but the hamster is almost dead - Smartweb 2015

WHILST BELIEVING THAT TECHNICAL INNOVATION WILL MAKE A BETTER WORLD FOR HUMANS…

Humans need not apply!

https://www.youtube.com/watch?v=7Pq-‐S557XQU

Page 19: The wheel is spinning but the hamster is almost dead - Smartweb 2015

WE CELEBRATE OUR SOCIAL INEPTITUDE IN OUR HIRING AND TRAINING…

Page 20: The wheel is spinning but the hamster is almost dead - Smartweb 2015

FIZZING WITH THE BUZZ…

http://c2.com/cgi/wiki?FizzBuzzTest

The "Fizz-‐Buzz test" is an interview question designed to help filter out the 99.5% of programming job candidates who can't seem to program their way out of a wet paper bag.

"Write a program that prints the numbers from 1 to 100. But for multiples of three print “Fizz” instead of the number and for the multiples of five print “Buzz”. For numbers which are multiples of both three and five print “FizzBuzz”."

Page 21: The wheel is spinning but the hamster is almost dead - Smartweb 2015

FIZZING WITH THE BUZZ…

http://c2.com/cgi/wiki?FizzBuzzTest

The "Fizz-‐Buzz test" is an interview question designed to help filter out the 99.5% of programming job candidates who can't seem to program their way out of a wet paper bag.

"Write a program that prints the numbers from 1 to 100. But for multiples of three print “Fizz” instead of the number and for the multiples of five print “Buzz”. For numbers which are multiples of both three and five print “FizzBuzz”."

Page 22: The wheel is spinning but the hamster is almost dead - Smartweb 2015

THE HAMMERS WE WIELD…

https://twitter.com/estellevw/status/645266254459088897http://codepen.io/estelle/pen/wKWwey

Page 23: The wheel is spinning but the hamster is almost dead - Smartweb 2015

WE COMPLAIN ABOUT A LACK OF DIVERSITY AND INVITING ENVIRONMENTS…

…AND RUN HACKDAYS TO SOLVE THAT PROBLEM!

Page 24: The wheel is spinning but the hamster is almost dead - Smartweb 2015

WE TEACH WORKING FOR A HI-‐FIDELITY MEDIUM USING HYPOTHETICAL EXAMPLES…

Page 25: The wheel is spinning but the hamster is almost dead - Smartweb 2015

AND HAVE AN OVERWHELMING AMOUNT OF RESOURCES WITH DISAGREEING ADVICE.

https://medium.com/@_cmdv_/i-‐want-‐to-‐learn-‐javascript-‐in-‐2015-‐e96cd85ad225

Page 26: The wheel is spinning but the hamster is almost dead - Smartweb 2015

THERE ARE SO MUCH BETTER WAYS AT OUR DISPOSAL…

http://worrydream.com/#!/LearnableProgramming

Brett Victor: Learnable Programming (﴾2012)﴿

Page 27: The wheel is spinning but the hamster is almost dead - Smartweb 2015

SO CELEBRATE THE CHOICES YOU HAVE AND FIND YOUR WAY OF LEARNING WHAT MAKES A DIFFERENCE TO YOU!

Page 28: The wheel is spinning but the hamster is almost dead - Smartweb 2015

TRUST IN YOUR ABILITY TO LEARN!

Page 29: The wheel is spinning but the hamster is almost dead - Smartweb 2015

NOT EVERYTHING IS DOOM AND GLOOM AND US RUNNING OUT OF TIME…

Page 30: The wheel is spinning but the hamster is almost dead - Smartweb 2015

WHAT WE’RE EXPERIENCING IS GROWING PAINS…

Page 31: The wheel is spinning but the hamster is almost dead - Smartweb 2015

WE’RE FEELING THREATENED BY NATURAL EVOLUTION AND CHANGE.

Page 32: The wheel is spinning but the hamster is almost dead - Smartweb 2015

YES, THE WEB AND OUR TECHNOLOGIES NEED TO EVOLVE AND CATCH UP WITH NEW DEMANDS…

Page 33: The wheel is spinning but the hamster is almost dead - Smartweb 2015

BUT THIS DOESN’T MEAN WE ALL NEED TO TOSS AWAY ALL WE HAVE ACHIEVED AND DEMANDED…

Page 34: The wheel is spinning but the hamster is almost dead - Smartweb 2015

LET’S GO BACK TO WHEN I STARTED AS A WEB DEVELOPER.

Page 35: The wheel is spinning but the hamster is almost dead - Smartweb 2015

I REMEMBER WHEN THIS WAS ALL FIELDS…

Page 36: The wheel is spinning but the hamster is almost dead - Smartweb 2015

I REMEMBER WHEN THIS WAS ALL FIELDS…

Page 37: The wheel is spinning but the hamster is almost dead - Smartweb 2015

THEN HTML5 HAPPENED…

• required attribute • new field types: date,

color, tel, number…

Page 38: The wheel is spinning but the hamster is almost dead - Smartweb 2015

THEN HTML5 HAPPENED…

• required attribute • new field types: date,

color, tel, number…

don’t call me!

Page 39: The wheel is spinning but the hamster is almost dead - Smartweb 2015

HOW EXCELLENT IS THIS?

✓ Form validation ✓ Pattern definitions ✓ Automatic filling by

browsers ✓ Hi-‐Fi interaction

Page 40: The wheel is spinning but the hamster is almost dead - Smartweb 2015

SOLVING A FEW SMALL SCREEN INTERACTION SPECIFIC ISSUES…

Page 41: The wheel is spinning but the hamster is almost dead - Smartweb 2015

SELECTING A VALUE FROM A MASSIVE LIST IS NOT FUN…

Page 42: The wheel is spinning but the hamster is almost dead - Smartweb 2015

YOU CAN, HOWEVER, TYPE AND KIND OF AUTOCOMPLETE…

Page 43: The wheel is spinning but the hamster is almost dead - Smartweb 2015

IN HTML5, WE GOT A DATALIST FOR THAT…

Page 44: The wheel is spinning but the hamster is almost dead - Smartweb 2015

BY UNDERSTANDING HTML5 PARSING, WE CAN HAVE BOTH…

https://adactio.com/journal/4272

Page 45: The wheel is spinning but the hamster is almost dead - Smartweb 2015

HTML5 BROWSERS GET THE DATALIST FUNCTIONALITY…

Page 46: The wheel is spinning but the hamster is almost dead - Smartweb 2015

OLDER BROWSERS GET A SENSIBLE INTERFACE…

Page 47: The wheel is spinning but the hamster is almost dead - Smartweb 2015

ALL THIS IS POSSIBLE BECAUSE OF THE FAULT TOLERANT NATURE OF HTML (﴾AND CSS)﴿

on('error', () => { shrug(); line.next(); });

Page 48: The wheel is spinning but the hamster is almost dead - Smartweb 2015

WE DEMANDED THIS NOT TO GO AWAY!

Page 49: The wheel is spinning but the hamster is almost dead - Smartweb 2015

AND YET, WE FORFEIT THIS FEATURE EVERY SINGLE DAY…

Page 50: The wheel is spinning but the hamster is almost dead - Smartweb 2015

…AND CELEBRATE SOLUTIONS THAT ARE PRETTY MUCH UNRELIABLE.

Page 51: The wheel is spinning but the hamster is almost dead - Smartweb 2015

WHY DO WE DO THIS?

Page 52: The wheel is spinning but the hamster is almost dead - Smartweb 2015

THE ANSWER IS SIMPLE:

WE FEEL THAT WE NEED TO BE IN CONTROL.

Page 53: The wheel is spinning but the hamster is almost dead - Smartweb 2015

WITH JAVASCRIPT, WE ARE IN CONTROL AND WE CAN FIX ALMOST ANYTHING.

=

Page 54: The wheel is spinning but the hamster is almost dead - Smartweb 2015

THE PROBLEM IS THAT US IN CONTROL ALSO MEANS US RESPONSIBLE FOR THE OUTCOME…

Page 55: The wheel is spinning but the hamster is almost dead - Smartweb 2015

WE FORFEIT ALL THE BEAUTIFUL AND IMPORTANT THINGS BROWSERS ALREADY DO FOR US…

Page 56: The wheel is spinning but the hamster is almost dead - Smartweb 2015

FOR THE SAKE OF DEVELOPER CONVENIENCE AND A PERCEIVED CHANCE OF CONTROL.

Page 57: The wheel is spinning but the hamster is almost dead - Smartweb 2015

I’M NOT SAYING NOT TO USE JAVASCRIPT -‐ FAR FROM IT.

Page 58: The wheel is spinning but the hamster is almost dead - Smartweb 2015

BUT I BEG OF YOU TO CONSIDER WHAT YOU DO AND STOP RELYING ON MAGICAL SOLUTIONS.

Page 59: The wheel is spinning but the hamster is almost dead - Smartweb 2015

THERE ARE A FEW REASONS FOR THAT:

• The web is a mess. The average web page creeps up to 2MB with hundreds of dependencies.

• Outdated frameworks and helper libraries hinder browser interoperability. The quick fix of today is the part of the landfill of tomorrow.

• By trying to control the web we created parallel solutions for desktop and mobile -‐ each of which disappointing.

Page 60: The wheel is spinning but the hamster is almost dead - Smartweb 2015

CHECK WHAT YOU BUILT AND FIX IT FORWARD…

PLEASE?http://dev.modern.ie/tools/staticscan/

https://github.com/MicrosoftEdge/static-‐code-‐scan

Page 61: The wheel is spinning but the hamster is almost dead - Smartweb 2015

THE WEB IS WORLD-‐WIDE AND WE’RE GETTING FRUSTRATED FOR NOT DELIVERING WHAT THE VALLEY WANTS…

Page 62: The wheel is spinning but the hamster is almost dead - Smartweb 2015

THE HYPE IS MOVING AWAY FROM THE WEB TOWARDS MORE CONTROLLED ENVIRONMENTS.

THE WEB CAN’T COMPETE AS IT IS

AGAINST ITS NATURE.

Page 63: The wheel is spinning but the hamster is almost dead - Smartweb 2015

THE NEXT USERS ARE NOT THOSE WHO COMPLAIN THE WEB IS NOT AS GOOD AS NATIVE APPS…

https://vimeo.com/139312920

https://brucelawson.github.io/talks/2015/velocity

Bruce Lawson at SOTB 2015

Page 64: The wheel is spinning but the hamster is almost dead - Smartweb 2015

PROXY BROWSERS ARE A BIG THING THERE…

https://vimeo.com/130296585https://speakerdeck.com/tkadlec/better-‐by-‐proxy-‐at-‐mobilism-‐2015

Tim Kadlec: Better by Proxy

Page 65: The wheel is spinning but the hamster is almost dead - Smartweb 2015

WE’RE ADDICTED TO MAKING THINGS GENERIC…

http://josdejong.com/blog/2015/01/06/code-reuse/

Page 66: The wheel is spinning but the hamster is almost dead - Smartweb 2015

RELEASING OPEN SOURCE SOLUTIONS IS NOT RELEASING FREE CODE AND HOPING PEOPLE FIX AND MAINTAIN FOR YOU…

The toxic side of free by Remy Sharp (﴾@rem)﴿

https://remysharp.com/2015/09/14/jsbin-toxic-part-1

Page 67: The wheel is spinning but the hamster is almost dead - Smartweb 2015

OPEN SOURCE IS FREE -‐ AS IN PUPPY!

Page 68: The wheel is spinning but the hamster is almost dead - Smartweb 2015

THE WEB IS A GIFT TO US ALL, AND YOU CAN CONTRIBUTE IN MANY WAYS. ALL OF US PLAYING ON THE BLEEDING EDGE IS MISSING THE POINT.

Page 69: The wheel is spinning but the hamster is almost dead - Smartweb 2015

BE ALONG FOR THE RIDE…

Page 70: The wheel is spinning but the hamster is almost dead - Smartweb 2015

SOMETIMES NOT CONTROLLING THINGS IS WHEN THE FUN STARTS…

Page 71: The wheel is spinning but the hamster is almost dead - Smartweb 2015

We all have different desires and needs, but if we don’t discover what we want from ourselves and what we stand for, we will live passively and unfulfilled.

– Bill Watterson

Page 72: The wheel is spinning but the hamster is almost dead - Smartweb 2015

SO BE ACTIVE!

✓ Improve your basic skills, catch up on what’s possible. caniuse.com is a riveting read!

✓ Start helping people who are not up to date. You start teaching and you end up learning.

✓ Report problems, demand support for basic features, not only for the hot, new (﴾half-‐baked)﴿ ones.

✓ Reach out beyond our echo chamber if you want to reach people who need the knowledge you have.

Page 73: The wheel is spinning but the hamster is almost dead - Smartweb 2015

THANK YOU!CHRIS HEILMANN

@CODEPO8