Rubbing the Sankara Stones the wrong way - From the Front 2014
66
Christian Heilmann (@codepo8) - From the Front - 18/09/14, Bologna, Italy RUBBING THE SANKARA STONES THE WRONG WAY.
-
Upload
christian-heilmann -
Category
Engineering
-
view
15 -
download
8
description
Closing keynote of the From the Front conference in Bologna, Italy in September 2014. It talks about the way we approached web development over the years and how what we defined as best practices then has to change now that we are facing a mobile led world in emerging markets.
Transcript of Rubbing the Sankara Stones the wrong way - From the Front 2014
Christian Heilmann (@codepo8) - From the Front - 18/09/14, Bologna, Italy
RUBBING THE SANKARA STONES THE WRONG WAY.
THOSE MAGICAL STONES…
MIND-BLOWING TIME!
HTM
L
CSS
Java
Scrip
t
THE HOLY TRINITY OF WEB STANDARDS
Structure (HTML, semantic extras)
Behaviour (JavaScript)
Presentation (CSS, imagery, SVG)
THE “WEB DEV ROCKSTAR” VERSION
Structure (HTML, semantic extras)
Beh
Presentation (CSS, imagery, SVG)
THE CONTROL FREAK VERSION (SINGLE PAGE APPS)
Behaviour (JavaScript)
Presentation (CSS, imagery, SVG)
TODAY’S VERSION
Structure (HTML, semantic extras)
Behaviour (JavaScript)
Presentation (CSS, imagery, SVG)
TODAY’S VERSION
Structure (HTML, semantic extras)
Behaviour (JavaScript)
Presentation (CSS, imagery, SVG)
• Preprocessors • CMS • Libraries • Frameworks
!new
JAVASCRIPT HAS ALWAYS BEEN USED IN BLOATED WAYS.
UNOBTRUSIVE JAVASCRIPT
http://www.onlinetools.org/articles/unobtrusivejavascript/
THINKING ABOUT DEPENDENCIES Thursday, June 16th, 2005 at 10:12 am
http://christianheilmann.com/2005/06/16/three-separated-layers-of-web-development-think-again/
IT IS AN ENDLESS STRUGGLE…
SO, WHAT’S THE ANTIDOTE?
DEALING WITH ANNOYANCES
BAIT AND PESTER…
http://idontwantyourfuckingapp.tumblr.com/
IT’S ALL THE BROWSER’S FAULT…
FANBOISM AND “I CAN DO THAT”
HOORAY FOR THE FAULT TOLERANT WEB!
PROVIDING A FALLBACK…
<img src="meh.jpg" alt="cute kitten photo">
PROVIDING A FALLBACK…
var img = document.querySelector('img');img.addEventListener('error', function(ev) { if (this.naturalWidth === 0 && this.naturalHeight === 0) { console.log('Image ' + this.src + ' not loaded'); }}, false);
CAN HAS VIDEO?
<video controls> <source src="dynamicsearch.mp4" type="video/mp4"> </source> <a href="dynamicsearch.mp4"> <img src="dynamicsearch.jpg" alt="Dynamic app search in Firefox OS"> </a> <p>Click image to play a video demo of dynamic app search</p></video>
CAN HAS VIDEO?
var v = document.querySelector('video'), sources = v.querySelectorAll('source'), lastsource = sources[sources.length-1];lastsource.addEventListener('error', function(ev) { var d = document.createElement('div'); d.innerHTML = v.innerHTML; v.parentNode.replaceChild(d, v);}, false);
WELCOME TO THE WEB!
THIS IS EXCITING AND MAKES ME VERY HAPPY!
Hating JavaScript is like hating the Internet. The Internet is a cobweb of different technologies cobbled together with duct tape, string and chewing gum. It's not elegantly designed in any way, because it's more of a growing organism than it is a machine constructed with intent.
“
http://www.quora.com/Why-is-JavaScript-the-only-client-side-language-available/answer/Mattias-Petter-Johansson
Mattias Petter Johansson, Spotify
STOP FORCING BELIEFS DOWN PEOPLE’S THROATS
If you build a web app today, it will run in browsers 10 years from now. Good luck trying the same with your favorite mobile OS (excluding Firefox OS).
THE WEB IS BUILT TO LAST
“
http://paulbakaus.com/2014/08/26/the-web-is-built-to-last/
Paul Bakaus, Google (ex. Zynga)
APPS
“Christian Heilmann
If you enable people world-wide to get a good experience and solve a problem they have, I like it. The technology you use is not the important part. How much you lock them in is. Don’t lock people in.
WORRY ABOUT YOUR OWN BEHAVIOUR AND TALK ABOUT IT
http://www.futureinsights.com/home/the-state-of-the-componentised-web.html
THE SIMPLE BEAUTY AND ROBUSTNESS OF STATIC HTML
PREMATURE OPTIMISATION
https://medium.com/@fredriknoren/on-generalization-608949214e63
BE SMUG ABOUT WHAT WE HAVE!
http://makethumbnails.com/
BAIT AND PESTER…
!
Vibration API Screen Orientation Geolocation API Mouse Lock API Open WebApps Network Information API Battery Status API Alarm API
SENSORS AND ACCESSING THE WORLD AROUND US
Push Notifications API WebFM API / FMRadio WebPayment IndexedDB Ambient light sensor Proximity sensor Notification
DEVELOPER TOOLS TOTALLY ROCK!
BUILD, DEPLOY AND DEBUG APPS IN THE BROWSER
WEBIDE
OHAI CHROME/ANDROID AND SAFARI/IOS! FIREFOX TOOLS ADAPTER
GET HEARD!
http://ffdevtools.uservoice.com/
https://openwebapps.uservoice.com/
EMBRACE THE WORLD!
http://opensignal.com/reports/2014/android-fragmentation/
18,796 Distinct Android devices (11,868 last
year)
WORLD-WIDE… OH, WAIT…
HELLO WORLD!
Intex Cloud FX: Firefox OS 1.0 GHz processor 128 MB RAM SD memory of up to 4GB. Dual-SIM Bluetooth Wi-Fi
1,999 Rupees ~ 25 Euro
HELLO WORLD OF GOOGLE PLAY
PICKING BRAINS IS EASY…
A TREASURE TROVE…
https://www.youtube.com/watch?v=dPz_5-MEvcg
ALEX FEYERKE — OFFLINE FIRST
https://www.youtube.com/watch?v=vBHt61yDO9U
A TREASURE TROVE…
TOOLS I’D HAVE KILLED FOR IN THE PAST…
COLLABORATIVE EDUCATION
https://www.youtube.com/watch?v=hC9sXz3tRow
NO MORE HESITATION!
THANKS! CHRIS HEILMANN @CODEPO8
