Do Try This At Home

download Do Try This At Home

If you can't read please download the document

  • date post

    15-Jul-2015
  • Category

    Technology

  • view

    6.592
  • download

    2

Embed Size (px)

Transcript of Do Try This At Home

  • Do Try This at HomeAjax Bookmarking, Cross-site Scripting

    and Other Web 2.0 Browser Hacks

    Brian Dillard, Ajax R&D, Pathfinder Development

    1

  • About this talk

    1. Not too much code

    2. The high-level stuff

    3. The practical stuff

    4. The uplifting finale

    2

  • Where we are

    Its a really exciting time to be a web developer. Cool stuff is coming out every single day.

    3

  • Where we are

    ... but its hard to get too excited about technologies

    that arent yet ready for prime time. How best to participate?

    4

  • Where we areWalled gardens

    vs.ecosystems

    5

  • Where we areOpen Web

    vs.Closed Web

    Jonathan Zittrain

    6

  • Where we areAjaxvs.

    Flash/Flexvs.

    Silverlight

    7

  • Where we arePrototype/Scriptaculous

    vs.MooTools

    vs.Dojo/Dijit/Dojox

    vs.jQuery/jQuery UI

    vs.YUI & Ext

    8

  • Where we areWeb standards

    vs."embrace,

    extend, then innovate"

    9

  • Where we areInternet Explorer 8

    vs.Firefox 3

    vs.Safari 3.1

    vs.Opera 9.5

    10

  • To get a better future, not only do we need a return to 'the browser wars,' we need to applaud and use the hell out of 'non-standard' features until such time as theres a standard to cover equivalent functionality. Non-standard features are the future, and suggesting that they are somehow 'bad' is to work against your own self-interest.

    Alex Russell, President, Dojo Foundation

    11

  • CSS masks!12

  • CSS variables!13

  • But ... Webkit? Safari?14

  • What should I do?

    15

  • What's theright thing

    to do?

    What should I do?

    16

  • What's theright thing

    to do?

    How should Iinvest my time?

    What should I do?

    17

  • The future liesin the tension

    betweenemerging standards

    and de facto standards

    18

  • Today's technologies grew in the wild

    xmlHttpRequest DOMContentLoaded Selectors API Canvas supplanted SVG HTML5 Ajax Navigation Microformats

    19

  • Tomorrows will grow ... in committees?

    HTML 5 in two dialects, HTML and XML XHTML 2 ECMAScript 4 a.k.a. JavaScript 2 CSS 3 CSS Layout Module CSSOM DOM storage/client-side database storage Web Forms 2.0

    20

  • Draft specsare cool ...

    21

  • Draft specsare cool ...

    but live implementations

    are cooler.

    22

  • The Gears project started because a group of developers at Google were frustrated by the slow march of web browsers. Competition and standards were producing fantastic results, but it took a long time to get implementations on every browser. In some cases, we still dont have compatible implementations, years after the standards were finalized.

    Aaron Boodman, Gears Engineer

    23

  • Who will play a role in determiningthe shape of tomorrows web?

    Proprietary runtimes set the pace for multimedia and native UI integration

    Standards bodies & browser vendors do their little dance

    Ajax libraries & browser plugins paper over the differences

    24

  • Who will play a role in determiningthe shape of tomorrows web?

    So what about individual developers?

    25

  • Build cool stuff!

    26

  • Offline storage Dojo Storage Flash LSOs (Local Shared Objects) IE userData Form field auto-save

    Google Gears DOM storage: sessionStorage/globalStorage Client database storage

    27

  • Ajax history and bookmarking

    Dojo Toolkit Various Ajax frameworks, including GWT Really Simple History dsHistory IE8 and Ajax Navigation

    28

  • Cross-site scripting

    Doom and gloom from Crockford But XSS !== malware FF3 cross-window messaging with HTML 5

    postMessage API

    xssinterface - a library that uses postMessage, Gears or a cookie hack

    29

  • Other possibilities CSSOM CSSOM View Module elementFromPoint for drag/drop

    Web Forms 2.0 2 projects in suspended animation Dust them off?

    30

  • Best practices? If youre doing something simple, try to use the

    draft-standard API itself.

    If youre building a higher-level abstraction, use draft standards when theyre available.

    If youre going for the big hack, follow the conventions of successful libraries.

    If you dont need to rely on a specific JavaScript framework, dont.

    Make informed choices about joining the fray.

    31

  • Build plugins for popular frameworks.Solve a little problem well while looking to HTML 5.

    How to be part of the conversation

    32

  • Participate actively in open-source projects.You dont need to build a Gears module to use one.

    How to be part of the conversation

    33

  • Get down and dirty with beta browsers.File bug reports. Join forums. Blog about it.

    How to be part of the conversation

    34

  • Read and comment on draft specs

    How to be part of the conversation

    35

  • Read and comment on draft specs... just not late at night.

    How to be part of the conversation

    36

  • Vote with your feet.Use technologies whose philosophy you support.

    How to be part of the conversation

    37

  • Become a beat reporter.

    Tools for participating

    38

  • Research tools RSS: NetNewsWire/FeedDemon/GReader Oversubscribe

    labs.pathf.com/ajax/web20expo/ Or just bookmark trusted sites

    ajaxian.com quirksmode.org crockford.com

    39

  • Frequent browser vendor websites

    Tools for participating

    40

  • Browser sites Internet Explorer 8

    Readiness toolkit/developer forum Firefox 3

    Bug tracker Opera 9.5

    Bug tracker Safari 3

    Bug tracker

    41

  • Debuggers for everyone...not just Firefox & Firebug

    Tools for participating

    42

  • Debuggers Firefox Firebug Web developer toolbar

    Safari Develop menu Web Inspector

    43

  • Debuggers IE8 Developer Tools Finally built in

    Opera Developer Console Just a bookmarklet

    44

  • Standards body websites

    Tools for participating

    45

  • Standards bodies WC3 http://www.w3.org/

    WHATWG http://www.whatwg.org/

    ECMAScript http://www.ecmascript.org/

    46

  • Neither the CSS WG nor the HTML 5 WG nor, indeed, any W3C working group can define the future. They can only round off the sharp edges once the future becomes the past and thats all we should ever expect of them. ... [T]he W3C cannot save us.

    Alex Russell, President, Dojo Foundation

    47

  • If you wait for Google, Prototype, the WC3 and

    Adobe to solve your problems, then youre

    missing out.

    48

  • About me

    San Francisco: Reflect.com Chicago: United Airlines, Orbitz Worldwide Now: Pathfinder Development R&D: Playing with shiny new toys Blog: Agile Ajax (blogs.pathf.com/agileajax)

    49

  • Please rate me!50

  • Please rate me!51

  • Please rate me!52