THE RAPID EVOLUTION OF WEB DEVELOPMENT

HTML5, CSS3 and Chrome 19 is so yesterday!Or

Thomas A. Powelltpowell@pint.com

@PINTSD

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

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)

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

Oh and Memes

 

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!?

What Makes Web Different?

• The Public Network

• Dev Practices

• Ownership

• Other Theories

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

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!

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!

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

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

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!

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?

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

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

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

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

HTML5 : Media

• <audio> and <video> tags

• Flash video begone!

• But...codec chaos returns

• And maturity and integration jumps backwards

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

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

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

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?

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

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

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

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

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)

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

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!

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

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

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

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

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

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

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?

Evaluation Solely By Looks

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

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?

Thanks!&

Questions?

Thomas A. Powell tpowell@pint.com

http://www.pint.com

Twitter: PINTSD