Rapid Evolution of Web Dev? aka Talking About The Web
-
Upload
pint-inc -
Category
Technology
-
view
952 -
download
0
description
Transcript of Rapid Evolution of Web Dev? aka Talking About The Web
![Page 1: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/1.jpg)
THE RAPID EVOLUTION OF WEB DEVELOPMENT
HTML5, CSS3 and Chrome 19 is so yesterday!Or
Thomas A. [email protected]
@PINTSD
![Page 2: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/2.jpg)
Who Am I?
• Yeah I worked on the Old Timey Internet
• Wrote a bunch of books
• Taught a lot people
• Web Agency Background
• Started a few successful Web Software Plays
![Page 3: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/3.jpg)
Why Am I Here?
• Hoping to talk about Data Viz & Big Data
• “Too Specific. How about HTML5?”
• Ok, easy enough
• “Scratch that! Too techie, talk about changes and trends in Web dev instead!”
• Ok...sure (head scratching)
![Page 4: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/4.jpg)
Here We Are Then• ~45 mins or so, let’s start the clock
• Time to talk about hopefully interesting things
• Sure you might be into marketing, but we need context so let’s talk about:
• Techie stuff : HTML5, JS, Networks, etc.
• Security and Privacy
• Performance
• Trends
![Page 5: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/5.jpg)
Oh and Memes
![Page 6: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/6.jpg)
A Long Time Ago...
• I wrote this book on paper
• Premise: Web Sites/Apps == Software, thus treat dev as such
• Then : “Wow, makes sense”
• Now : “Eh...Duh”
• So we’ve evolved and fast!?
![Page 7: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/7.jpg)
What Makes Web Different?
• The Public Network
• Dev Practices
• Ownership
• Other Theories
![Page 8: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/8.jpg)
The Network
• You don’t control it end to end
• Delivery time not guaranteed
• Latency is significant
• HTTP impacts
• Simple but...
• Stateless
• Slow
• Security - an after thought
![Page 9: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/9.jpg)
Dev Practices
• What are those?
• Software Engineering without _________
• Release cycles
• You mean when we change code?
• QA
• Always doing or never doing?
• Let the users tell us!
![Page 10: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/10.jpg)
Owner Effects
• Strong Patron and Walled Gardens
• Many Patrons and Open Market
• Convention and consensus over some predetermined standard
• Is there a right answer?
• Trade-offs always!
![Page 11: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/11.jpg)
Theories• It’s different because
• Easy to leave ... but stickiness=lock-in
• Biz model ... but freemium looks like shareware
• Distribution ... but software is now the same
• Platform ... but browser becomes OS
• UI Issues ... but look at history
![Page 12: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/12.jpg)
Let’s Take a Tour
• Different or not it doesn’t matter
• Time to tour the Web Dev Space
• We’ll go up and down the stack
• Visit some buzzwords
• Expose some pros and cons
• Hopefully seed many questions for the end
![Page 13: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/13.jpg)
Browser Wars
• Version Number Battle
• Chrome 19*, Firefox 13, Opera 12, and coming up last IE 10
• Near monthly releases and nightly updates
• Tons of invented features
• Trouble: Continuous QA cycle!
![Page 14: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/14.jpg)
Zombie Browsers
• Yes IE6 sucks (7/8 too)
• But did it back then?
• Consider that Chrome 19 will suck in 10 years
• Dev today for features which you expect to be standard which later aren’t...what happens?
![Page 15: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/15.jpg)
Browser as Platform
• Browsers have more privileged access
• File System, Geoloc, WebCam, Gamepad, and more
• Native is ultimate goal - see Google Native Client
• Netscape’s early vision finally realized
• Browser as OS - see Chrome OS
• Outcomes: Security, Complexity, Portability just in new container
![Page 16: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/16.jpg)
What is HTML5?• Sad Truth: Most often a buzzword for
anything new, focused on some feature of interest and tremendously confused with heavy JavaScript use
• Sprawling Spec under constant change
• Evolution of HTML 4
• Acknowledges failure of XHTML
• Paves cowpaths with non-standard to standard
• Secret Win: Tag Soup Parse Rules
![Page 17: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/17.jpg)
HTML5 : Semantic Tags
• <header>, <footer>, <section>, <article>, <aside>, <nav>, <figure>, <mark>, <time>
• You can easily use them now
• HTML5 Shim, Modernizr
• Better than <div> - itis
• Outcomes: Semantics (maybe SEO), outlining
![Page 18: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/18.jpg)
HTML5 : Web Forms
• Rich Form Widgets
• Date Pickers, Color Pickers, Sliders, Search box, Autocomplete Lists
• Semantic Types
• email, tel, url, number
• Validation without JavaScript
• pattern, required, semantic types
![Page 19: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/19.jpg)
HTML5 : Media
• <audio> and <video> tags
• Flash video begone!
• But...codec chaos returns
• And maturity and integration jumps backwards
![Page 20: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/20.jpg)
HTML5 : Canvas
• <canvas> tag + Canvas API using JavaScript = Programmatic Bitmap Graphics
• Pros: Small API and fast esp. if GPU accelerated
• Cons: Too low level, no IE until IE9, Not retained mode (no picking), accessibility is bad
![Page 21: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/21.jpg)
Canvas Alternatives
• SVG - tag based, retained mode, in some cases faster
• JS DOM Animation - flexible but can be slow
• Flash - yes Flash, get over it
• CSS Animations and Transitions
• Fast but specialized and feature limited
![Page 22: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/22.jpg)
JavaScript Everywhere• Client-Side (with many names - DHTML,
Ajax, HTML5, etc.)
• Library Mania: jQuery, ExtJS, Backbone,...
• Server-Side:
• node.js, silk.js, Helma, Ringo, even classic ASP
• Mobile
• Sencha Touch, Phone Gap, ...
• Even Desktop
![Page 23: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/23.jpg)
Hating on JavaScript• It has “Ugly Parts”
• Rework it - ECMAScript5, 6, etc.
• Compile to it - Coffeescript, GWT
• It’s Slow
• Yeah and other dynamic langs?
• Great improvements: V8, Chakra
• It’s insecure
• Is it? Or is it what you are doing with it?
![Page 24: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/24.jpg)
CSS 1,2,3,4...
• Multiple Columns, Drop Shadows, Custom Fonts, Image Borders, Layouts, Media-Queries, Animations, Filters!?
• CSS Bloat
• Welcome to -vendor prefix hell!
• Compilers Emerge
• Less, Sass, Stylus
• BTW CSS Variables are here too
![Page 25: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/25.jpg)
Server-Side
• First stop the “____ won’t scale” nonsense, that’s a different problem
• JavaScript to erode PHP, Ruby, Python
• All continue with C# and Java a bit more entrenched
• More biz logic moves client-side.
• Server side becomes service layer
• REST won, URL as command line, and JSON everywhere
![Page 26: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/26.jpg)
Database Drama
• The Rise of NoSQL (ex. MongoDB)
• Lots of hype here
• Good reasons why we want it but...
• DB research and tradition thrown out the window
• Change for sure, I expect a hybrid winner
![Page 27: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/27.jpg)
Security Challenges
• Hack traffic is nearly ambient at this point
• Exploits are now industrialized
• Pants are down all over the place
• Anonymous is really not that l33t
• Trust relationship are not understood or admitted to
![Page 28: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/28.jpg)
Security Face Palms
• The client-side is untrustworthy!
• You can’t can’t can’t trust inputs
• You must encrypt your transmission
• Especially given heavy public WiFi use
• Open Source is open to all (hackers included)
![Page 29: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/29.jpg)
Web Security Truths
• Tech can’t solve the security problem
• There is no such thing as perfect security
• Security is a posture, not a feature
• The business model of Web security is mostly flawed
![Page 30: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/30.jpg)
Delivery Woes• Speed matters! Can never be fast
enough
• Bandwidth fallacy still reigns, but latency is more important!
• Even 100ms can equal loss
• Client Side problems are source of > 80% of speed problems
• 3rd Party Includes and Scripts are major problem
• Speed, Security, even SPOF!
![Page 31: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/31.jpg)
Serving Changes
• Performance & scale matter!
• Apache is fading
• Others rising Ngnix, Lighthttpd, node.js, etc.
• Protocols are changing - SPDY
• # of requests is the issue
• I/O is still a bottleneck
• CDNs use is more common
![Page 32: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/32.jpg)
Analytics Shake-Up
• Reliances on JavaScript, Cookies and 3rd party hosts are quite troubling
• Lots of handwaving and conflicts of interest
• There is increasing tracking abuse
• Regulation is coming
• EU Cookie Law
• Could be a good business opportunity
![Page 33: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/33.jpg)
Big Data != Big Wisdom
• We want to know everything!
• Storing and processing all that data is expensive and time consuming
• Viz helps
• Good questions help more
![Page 34: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/34.jpg)
Data Driven to Disaster
• Lots of “data science” but often lack some basic scientific thinking patterns
• Causality and correlation are quite often confused
• Tons of confirmation bias
• Lots of sampling bias
• Crowd Wisdom is ruling a bit much
• Science isn’t easy, be skeptical
![Page 35: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/35.jpg)
Mobile! Mobile! Mobile!
• Indeed huge changes!
• Mobile won’t completely rule
• On Star Trek ...
• In Japan...
• Creation vs. Consumption
• Walled Garden versus Open Garden tension again
![Page 36: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/36.jpg)
Tool/Tech Blaming
• The languages, services, tools, hosts, etc. you use don’t make you do dumb things we tend to do that fine on our own
• Looking for the perfect _____ is going to be a long process
• Trade-offs exist, deal with them
![Page 37: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/37.jpg)
Implementation over Function?
• Who cares what your app is written in?
• Hackers? Competitors?
• What does Google or ____ use?
• Does it matter?
• BTW ever viewed Google’s source?
![Page 38: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/38.jpg)
Evaluation Solely By Looks
![Page 39: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/39.jpg)
The Constant
• Being human is the constant, new technology is the variable
• Human nature tends to trend to norms over time
• The Web doesn’t make you (or your kids or customers) a smarter, super-friend making multi-tasker
![Page 40: Rapid Evolution of Web Dev? aka Talking About The Web](https://reader036.fdocuments.in/reader036/viewer/2022081404/5583d7c2d8b42af76c8b4b46/html5/thumbnails/40.jpg)
User General Truths• Customer always right, listen to the
customer, nobody likes to wait, less work-more gain, etc.
• I’ve tended to find more insight in books like Robert Cialdini’s Influence: The Psychology of Persuasion or general works on General Biz, Psych, CogSci, Interface Design, etc. then Web specific ones
• BTW have you heard? The Web is the real world?