Meh, rant, bla and stuff…

1. OF GAPS, FILLERS AND
EMPTY SPACES…
CHRIS HEILMANN (﴾@CODEPO8)﴿, FRONTEERS,
AMSTERDAM, OCTOBER 2015 https://www.flickr.com/photos/50064540@N02/7650431290 (﴾ealingjeff)﴿

2. AN NOYI NG
GA PS

3. https://twitter.com/heydonworks/status/646687758690459648
WE’VE COME A
LONG WAY AND
WE’RE STILL ON A
JOURNEY…

4. https://twitter.com/heydonworks/status/646687758690459648
https://www.christianheilmann.com/
wheres-‐chris-‐upcoming-‐speaking-‐
appointments/

5. ATTENDING THESE
EVENTS IS GREAT AND
I FEEL CONFUSED ALL
THE TIME HOW I
DESERVE ALL THIS…

6. THIS HERE IS A
PRIVILEGE WE HAVE…
SO MAKE SURE YOU
MAKE THE BEST OF IT!

7. YOU MEET AMAZING
PEOPLE AT EVENTS…
Lizzie Mary Cullen
lizziemarycullen.com

8. PEOPLE WHO DRAW THE
PRETTY LINES TO FILL OUT…

9. PEOPLE WHO GROW
WITH YOUR HELP…

10. AND YOU CAN GO AND
VISIT THEM AND WORK
TOGETHER -‐ THIS IS A
MOBILE WORLD!

11. https://twitter.com/muffinresearch/status/639116308030881792
WE’VE COME A
LONG WAY AND
WE’RE STILL ON A
JOURNEY…
TAKE SOME TIME TO HAVE FUN…

12. YOU MEET PEOPLE AND YOU MAKE IMPRESSIONS…

13. I GET, HOWEVER,
DISAPPOINTED WITH
THE RESULTS WE HAVE.

14. I FEEL A DISCONNECT
BETWEEN WHAT WE TALK
ABOUT AT EVENTS AND
WHAT I HEAR WHEN I TALK
TO PEOPLE I WORK WITH.

15. IT IS LIKE WE DON’T
REACH THE PEOPLE
WE CLAIM WE DO
THIS FOR…
• 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.

16. THIS IS SO RAMPANT,
THAT EVERY
BROWSER MAKER
HAS A DEDICATED
TEAM AND TOOLS
TO FIX PEOPLE’S
CODE WITH THEM.
http://dev.modern.ie/tools/staticscan/
https://github.com/MicrosoftEdge/static-‐code-‐scan

17. THE AMAZING TOOLS WE SHOW
HERE ARE LARGELY UNKNOWN…

18. THERE IS A HUGE
DIFFERENCE IN
MESSAGING AT
DIFFERENT
CONFERENCES.

19. LET’S TALK A BIT ABOUT
THE EXTREMES…

20. THE WEB IS FREE AND INDEPENDENT.

21. https://twitter.com/muffinresearch/status/639116308030881792
JAVASCRIPT IS
FAULT INTOLERANT.
http://kryogenix.org/code/browser/everyonehasjs.html

22. https://twitter.com/muffinresearch/status/639116308030881792
WE HAVE A PROBLEM
WITH TOO MANY
TOOLS COMING AND
GOING AND
BECOMING LANDFILL
OF THE WEB…

23. http://dowebsitesneedtolookexactlythesameineverybrowser.com/
WEBSITE AND APPS
DON’T NEED TO LOOK
THE SAME IN EVERY
BROWSER. REALLY.

24. COOL LINKS DON’T
CHANGE…

25. SIMULATING NATIVE
UI CONFUSES USERS

26. ALL OF THESE
THINGS ARE VERY
TRUE AND VERY
OBVIOUS…

27. Photo by Marc Thiele https://www.flickr.com/photos/marcthiele/21461088898/in/faves-‐11414938@N00/
WELCOME TO THE 10TH
ANNIVERSARY OF
STATING THE BLOODY
OBVIOUS…

28. 2004 -‐ 2005:
STOP WRITING
INLINE JAVASCRIPT!

29. https://twitter.com/DanHannanMEP/status/647745678962245632/photo/1
THE WEB OF OLD FORGOT
ABOUT THE LURE OF UGC

30. WHICH LEADS TO THE
OTHER EXTREME…

31. http://www.alansadick.com

32. WE GOT VERY DATA
DRIVEN AND ARE
ADDICTED TO
NUMBERS…

33. BROWSER STATS PROVE THE FUTURE IS HERE…

34. TOOLING AND
ABSTRACTIONS SAVE
YOU FROM THE
CONFUSION OF THE
OPEN WEB.
“DON’T HOLD US BACK!”

35. AND HAVE AN
OVERWHELMING
AMOUNT OF
RESOURCES WITH
DISAGREEING ADVICE.
https://medium.com/@_cmdv_/i-‐want-‐to-‐
learn-‐javascript-‐in-‐2015-‐e96cd85ad225

36. GET TOOLING…

37. AND LEARN ABOUT
THE MODERN
STACK, DAMN
YOU…
https://egghead.io/series/how-‐to-‐
write-‐an-‐open-‐source-‐javascript-‐library

38. BOTH EXTREMES LOVE TO QUOTE SELF MADE
“LAWS” TO PROVE THEIR POINTS…

39. MOORE’S LAW

40. Software efficiency halves every 18 months,
compensating Moore's law.
MAY’S LAW

41. Be conservative in what you send;
be liberal in what you accept.
POSTEL’S LAW

42. https://www.flickr.com/photos/15511507@N00/5950941452 (﴾hepp)﴿
COLESLAW

43. WE NEED LESS DECREES
AND DEMANDS

44. WE STOPPED BEING THE
LOVABLE UNDERDOGS THAT
INVITE NEW TALENT…

45. WE TRY TO CHANGE THE WEB
TO BE MORE “PROFESSIONAL”

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

47. WE CONSIDER AUTOMATION AND
INNOVATION TO BE LINEAR…

48. WE EXPECT
EVERYBODY TO GET
PURE HAPPINESS
FROM CODING…
https://twitter.com/sarahmei/status/597276242887348224

49. WORKING AT A PACE
NO HUMAN SHOULD
WORK IN…

50. WE COMPLAIN ABOUT A LACK
OF DIVERSITY AND INVITING
ENVIRONMENTS…
…AND RUN HACKDAYS
TO SOLVE THAT PROBLEM!

51. WE CREATE OPEN, BUT ARE NOT
INVITING…

52. WE MADE THE
TERMINAL THE
STARTING POINT
OF WEB
DEVELOPMENT…

53. A TYPICAL START
OF A NEW WEB
PROJECT…
This is easy, just:
• Have a macbook -‐ everything else is not professional
and open enough
• Make sure you are sudo
• Install Node & NPM & Express.js
• Run the build script
• Look at a few minutes of random text scrolling by in
your terminal hoping that none of the warnings mean
something important
• If there is an error:
• Go to stack overflow and ask for help to learn that
you’re doing everything wrong and should use
another stack to start with
• Start typing some text in your editor
• Run the local server
• See that text in a browser.

54. INSTEAD OF
-‐ I DON’T KNOW -‐
THE WEB?
• JSBin, JSFiddle, Mozilla Thimble,
CodePen… all of these are great
teaching tools and not there to
impress one another.
• Free test hosting is a good opportunity
to get people up and running.

55. !AFFILIATED -‐
CALM DOWN.
https://www.youtube.com/watch?v=yS_Wk193mLo
https://tryappservice.azure.com/en-‐us

56. WE NEED FEWER
SHOW-‐OFF TOOLS…

57. LET’S ALLOW PEOPLE TO
BUILD MUSCLE MEMORY

58. Photo by State Farm https://www.flickr.com/photos/40567541@N08/9473169772
WE’RE WIRED TO TRY TO PREDICT HE NEXT STEP.

59. Photo by State Farm https://www.flickr.com/photos/40567541@N08/9473169772

60. https://shkspr.mobi/blog/2015/09/you-mustnt-criticise-the-status-quo-at-a-hackday/
Geeks are people who run on
dissent. We see the world is broken,
refuse to accept it, and try to fix
things. Then other geeks try to fix our
mistakes, and then we fix theirs, until
we either asymptotically climb
towards perfection or tear the whole
thing down and start again.
-‐ Terrence Eden (@edent)

61. REMEMBER, WE WERE
ADAMANT NOT TO
BREAK THE WEB…

62. AND NOW WE DO,
EVERY SINGLE DAY.

63. FOR THE SAKE OF
FEELING IN CONTROL.

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

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

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

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

68. https://twitter.com/DanHannanMEP/status/647745678962245632/photo/1
LET’S NOT VALUE BEING FIRST
HIGHER THAN BEING USABLE

69. I SAY WE SHOULD TRY TO
STOP FORCING OR
PREDICTING THE FUTURE

70. DIDN’T SEE IT COMING…

71. IT IS TIME TO USE
WHAT WE HAVE MORE
AND TO BE MORE
DEMANDING TO FIX
OUR BASELINE…
WE SHOULD NOT
NEED TO CARE
ABOUT THE BROWSER
AND HAVE TO TEST IN
ALL OF THEM!

72. THERE ARE SOME
BREAKTHROUGHS TO
CELEBRATE…
https://playbook.cio.gov/designstandards

73. DEEP DOWN, WE ALL
ARE DO-‐GOODERS AND
TECHNO HIPPIES.
AND WE CAN MAKE A
CHANGE!

74. PREPARE FOR A BIG CHANGE

75. WE FOCUS ALMOST EXCLUSIVELY
ON THE VALLEY FOR INNOVATION
AND GROWTH

76. AND THERE IS NO LACK OF
MONEY BEING THROWN
AROUND…

77. THE REAL GROWTH
HAPPENS ELSEWHERE…

78. AND THESE MARKETS PLAY
BY VERY DIFFERENT RULES
TO WHAT WE DO NOW…

79. 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

80. PROXY BROWSERS
ARE A BIG THING
THERE…
https://vimeo.com/130296585
https://speakerdeck.com/tkadlec/better-‐by-‐
proxy-‐at-‐mobilism-‐2015
Tim Kadlec: Better by Proxy

81. 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.

82. BE ALONG FOR THE
RIDE…

83. SOMETIMES NOT
CONTROLLING
THINGS IS WHEN
THE FUN STARTS…

84. YES, THE WEB IS FULL OF TERRIBLE IDEAS, BAD
ARCHITECTURE AND LACKS A LOT OF FEATURES
NATIVE ENVIRONMENTS OFFER.

85. BUT WHAT WE TRY
TO REPLACE IT WITH
RIGHT NOW, IS A
STEP BACKWARDS…

86. WABI-‐SABI
https://www.youtube.com/watch?v=V1gxziZwmkc

87. https://en.wikipedia.org/wiki/Wabi-sabi
Wabi-‐sabi (﴾侘寂)﴿ represents a
comprehensive Japanese world
view or aesthetic centred on the
acceptance of transience and
imperfection. The aesthetic is
sometimes described as one of
beauty that is "imperfect,
impermanent, and incomplete"
CELEBRATED GAPS…

88. https://en.wikipedia.org/wiki/Kintsugi
"When the Japanese mend
broken objects, they
aggrandise the damage by
filling the cracks with gold.
They believe that when
something has suffered
damage and has a history it
becomes more beautiful."
-‐ Billie Mobayed
CELEBRATED GAPS…

89. YES, THE WEB IS FULL OF TERRIBLE IDEAS, BAD
ARCHITECTURE AND LACKS A LOT OF FEATURES
NATIVE ENVIRONMENTS OFFER.

90. LET’S WORK ON FILLING THOSE CRACKS WITH GOLD
-‐ TOGETHER

91. 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

92. THANK YOU!
CHRIS HEILMANN
@CODEPO8