Bruce's tour of the Sausage Factory

Bruce Lawson

Bruce's tour
of the Sausage Factory

Bruce Lawson

Picture of a woman stirring a huge cauldron in a sausage factory
Bismarck, with quote 'The less men know of the making of laws and sausages, the better they sleep at night.'
metal cooking pot containing a murky brown liquid and some semi-cooked cow placenta
vintage advertisment of a lobster seasoning itself in a pan
Line drawing of an anthropomorphic sausage in chef's hat, with knife and fork
The noisiest of those competitive battles (between suppliers) will be about standards … in the computer industry, new standards can be the source of enormous wealth, or the death of corporate empires. With so much at stake, standards arouse violent passions.
The Economist, 1993
Line drawing of a sausage dressed as Queen Victoria
Line drawing of a horse-drawn railway captioned 'the first railway coach'
Line drawing of an anthropomorphic sausage dressed as a roman
Today, 60% of the world's railways use a gauge of 1,435 mm
(4 ft 8 1⁄2 in), known as standard or international gauge, also  Stephenson gauge after George Stephenson.
Line drawing of a horse-drawn railway, captioned 'the first railway coach'
Line drawing of a horse-drawn railway captioned 'the first railway coach'
Break of gauge would prove to be a nightmare during the American Civil War (1861–1865), often hindering the Confederacy's ability to move goods efficiently over long distances.
Track gauge in the United States (Wikipedia)
Following the Civil War, trade between the South and North grew and the break of gauge became a major economic nuisance. After considerable debate and planning, most of the southern rail network was converted from 5 ft (1,524 mm) gauge to 4 ft 9 in (1,448 mm) gauge, over two remarkable days beginning on Monday, May 31, 1886.
Open standards will give us interoperable software, information and data in government and will reduce costs by encouraging competition, avoiding lock-in to suppliers or products and providing more efficient services.
UK government
three horses' arses
a fat horse
Fat Horse Slim campaign webpage
A sausage on a skateboard, wearing casual clothing

HTTP referer

The misspelling referer originated in the original proposal by computer scientist Philip Hallam-Baker to incorporate the field into the HTTP specification. The misspelling was set in stone by the time of its incorporation into the Request for Comments standards document RFC 1945.

CSS colours

The first versions of Mosaic and Netscape Navigator used the X11 colors as the basis for the Web colors list, as both were originally X applications. The W3C specifications SVG and CSS level 3 module Color eventually adopted the X11 list with some changes. It is a superset of the 16 “VGA colors” defined in HTML 3.2 and CSS level 1.

X-11 colours

It is not known who originally compiled the list. The list does not show a continuity either in selected color values or in color names, and many color triplets have multiple names. Despite this, graphic designers and others got used to them, making it practically impossible to introduce a different list.

CSS colour…or ...?

CSS colour…or ...?

A sausage dressed as Dr Who, in front of a Tardis

Retrospective standardisation

<canvas>

Special thanks to Richard Williamson for creating the first implementation of canvas in Safari, from which the canvas feature was designed.
WHATWG Web Apps spec: acknowledgements
HTML5 acknowledgements page, 'Bruce Lawson' highlighted

<canvas> sausage

The path to proper standardization wasn’t very smooth. This began with the lack of a proper proposal coming from Apple’s side, resulting in the initial specification being based on reverse engineering works by Ian “Hixie” Hickson, editor of the HTML5 specification.
Thank you, Microsoft; HTML5 Canvas is a go!, June 2010

P*****s

creepy still from old horror film: sinister shadow walks upstairs

P*****s

Bruce: What’s the biggest danger to a free, open Web at the moment?
Hixie: Patents.
HTML5 Doctor: Interview with Ian Hickson
email from Apple patent lawyer claiming patent on canvas, 'However, in the event that the Web Applications 1.0 Working Draft, dated March 24, 2005, becomes part of a formalized draft standard at W3C or IETF, for example, Apple is prepared to address the disclosure/licensing rules of such organizations.'
sausage, dead, with an axe in its head. A big letter 'P' is saying 'muhahaha!'

<canvas />

canvas was originally implemented in Safari as an empty tag like img, but standards and other browsers have all gone with making it require an explicit close tag, to support fallback content.
Maciej Stachowiak, WebKit blog, 20 September 2006

Fallback content

When a canvas element represents embedded content, the user can still focus descendants of the canvas element (in the fallback content). When an element is focused, it is the target of keyboard interaction events (even though the element itself is not visible). This allows authors to make an interactive canvas keyboard-accessible.
canvas spec
<video src="foo.vdo">
  <p>Your browser is, like, a massive loser.<p>
  <img src=loser.gif alt="loser!" />
  <p><a href="foo.webm">Download the video.</a><p>
</video>

<picture> YAY!

<picture>
  <source src=…>
  <source src=…>
  <img src=… alt="I'm accessible!">
</picture>

Why <picture>, not <pic>?

robin says 'it's only 8 bytes', batman hits him saying 'perf matters!
6 pitchers of beer on a bar.

XHTML2 <img>

    
<img alt="W3C Logo" src="W3C.png">
W3C
</img>
    

RIP XHTML2

Today the Director announces that when the XHTML 2 Working Group charter expires as scheduled at the end of 2009, the charter will not be renewed.
WC3 July 2, 2009
A sausage, dressed formally as a judge
XHTML 2 was a beautiful specification of philosophical purity that had absolutely no resemblance to the real world.
Me (apparently)
Some things are clearer with hindsight of several years. It is necessary to evolve HTML incrementally. The attempt to get the world to switch to XML, including quotes around attribute values and slashes in empty tags and namespaces all at once didn't work. The large HTML-generating public did not move, largely because the browsers didn't complain.
Reinventing HTML - Timbo 27 Oct 2006

The HTML5 parsing algorithm

HTML5 is not trying to support old browsers. It's trying to support old content.

doctored illustration of pig from 'charlotte's web' with spider web saying 'mmm bacon'

HTML 3.2 "Wilbur"

Relative to HTML 2.0, HTML 3.2 adds widely deployed features such as tables, applets, text flow around images, superscripts and subscripts.

What happened to HTML3?

HTML 3.0 was a proposal for extending HTML published in March 1995 … However, the difference between HTML 2.0 and HTML 3.0 was so large that standardization and deployment of the whole proposal proved unwieldy. The HTML 3.0 draft has expired, and is not being maintained.

What was new

The BANNER element is used for corporate logos, navigation aids, disclaimers and other information which shouldn't be scrolled with the rest of the document.

The <PERSON> element is used for names of people to allow these to be extracted automatically by indexing programs.

The NOTE element is designed for use as admonishments such as notes, cautions or warnings, as commonly used in technical documentation.

HTML 3.0 supports the following kinds of fields:

HTML3 spec "forms"

Scribble on image?

These fields allow the user to scribble with a pointing device (such as a mouse or pen) on top of a predefined image … If the user agent can't display images, or can't provide a means for users to scribble on the image, then the field should be treated as a text field.

<FIG>

<FIG SRC="nicodamus.jpeg">
  <CAPTION>Ground dweller: <I>Nicodamus bicolor</I>
  builds silk snares</CAPTION>
  <P>A small hairy spider light
   fleshy red in color with a brown abdomen.
  <CREDIT>J. A. L. Cooke/OSF</CREDIT>
</FIG>

HTML5 <figure>

<figure>
 <img src="icodamus.jpeg">
 <figcaption>Ground dweller: <I>Nicodamus bicolor</I>
   builds silk snares</figcaption>
 <p>A small hairy spider …
 <small>J. A. L. Cooke/OSF</small>
</figure>
workers paving a path that is between two 'cowpaths'

HTML 3.2

Widely deployed rendering attributes are included where they have been shown to be interoperable. SCRIPT and STYLE are included to smooth the introduction of client-side scripts and style sheets.
HTML 3.2 DTD comment
A tearful sausage, being shunned by a bug hand pushing it away

Appcache

man alone at party, surrounded by kissing couples
http://www.lollercoasterlab.com/2011/05/forever-alone-this-party-is-crp.html

What's wrong with AppCache?

AppCache is declarative -- you give the browser a manifest and magic happens. This has well-documented limitations.
Alex Russell (sinister mastermind at Google)

SlapDache

The appcache API is another big mistake. It’s the best example of not understanding the problem before designing a solution, and I’m still trying to fix that mess.
Hixie
screenshot of Jake Archibald's A List Apart article 'appcache is a douchebag'
Service Workers

Service Workers CheatSheet

cutaway diagram of Apollo lunar module
cartoon walrus in front of lunar module
cartoon leg with lampshade on top, next to walrus and lunar module
nnavigator.serviceWorker.register
  ("/*", "/assets/v1/wrkr.js").then(
    function(serviceWorker) {
          console.log("success!");
          // call window.location.reload()
        },
      function(why) {
        console.error("failed!:", why);
    }
);
browser shows nothing when not connected to web
browser shows site when connected to web worker, even though not connected to web
this.addEventListener('fetch',
    function(event) {
  if (event.request.context == 'image'
    && new Date().getDay() == 4) {
    event.respondWith(
      fetch('/kitten.jpg')
    ) // thx @jaffathecake
  } // more: http://youtu.be/4uQMl7mFB6g
});

Service Workers + IndexedDB = Power

When combined with access to IndexedDB and a new form of Cache, the ability to respond with arbitrary content is incredibly powerful.
AlRu's GitHub ServWrkr ExplainerDoc ChuckleFest

IndexedDB

wikipedia photo of Joseph Stalin

IndexedDB

You've got to be kidding. It's a joke, right? This is the state of the art in databases? No, it's a bunch of children recreating database assembly code from the 1960's. This is awful, awful stuff … Looking at the example, I see spaghetti control flow and data flying in all directions, like a spoiled child throwing his broccoli at the wall.

IDB heebie jeebies

This API is complex and unclear about what's going on.
idb is a beast of an API
Big catastrophe this indexedDB!
this is f*cking GARBAGE, and i will not use it.
www.html5rocks.com/en/tutorials/indexeddb/todo/
wikipedia photo of a douche/ enema kit

IDB heebie jeebies

The goal of IndexedDB was to allow multiple different query processors to be built in JS. We expected few people to use it directly.
Adrian Bateman (Microsoft)
W3C Technical Architecture Group
when we try to produce high-level APIs, they tend to suck for various reasons, and therefore that we should produce lower-level primitives atop which people can build nicer things
Robin Berjon
Slinky-like extensible sausage

Extensible Web Manifesto

Browser vendors should provide new low-level capabilities that expose the possibilities of the underlying platform as closely as possible. They should also seed the discussion of high-level APIs through JavaScript implementations of new features
extensiblewebmanifesto.org
sausage sitting in cart pulled by snail; sign ssays maximum speed 5 kph

Why are Standards slow?

Why is everything else around us developing so fast, but the web is so slow to adopt anything?
Mark Roberts' email to WHATWG, 10 Oct 2013

Hixie's reply:

  1. Have someone design the feature.
  2. Have someone write a specification for it.
  3. Have some people write tests for it.
  4. Have one browser implement it.
  5. Have another browser implement it.
  6. Have another browser implement it.
  7. Have another browser implement it.
  8. Have people document it.

Compared with…

This is in contrast to "everything else", which just needs:
  1. Someone to implement it.
Geolocation

There's an app API for that

iOS8
Apple iOS Developer Library — Pre-Release: HealthKit Constants Reference

Fortune 500 firms in 1955 vs. 2014

Almost 88% of the companies from 1955 have either gone bankrupt, merged, or still exist but have fallen from the top Fortune 500 companies.
American Enterprise Institute
Superhero images: Web Component and Shadow DOM
web components' rearranging to its anagram 'spec.own. entomb'

Web Components

Web Components enable Web application authors to define widgets with a level of visual richness and interactivity not possible with CSS alone, and ease of composition and reuse not possible with script libraries today.
Introduction to Web Components

Extend existing HTML elements

var p = Object.create(HTMLButtonElement.prototype);
var FancyButton = document.registerElement
    ('fancy-button',
        {extends: 'button', prototype: p});
…
<button is="fancy-button">
In order for the open web to compete with its walled competitors, there must be a clear path for good ideas by web developers to become part of the infrastructure of the web. We must enable web developers to build the future web.
extensiblewebmanifesto.org
Virtuous sausage, dressed like an angel

How to participate

Browse, discuss, propose on W3C Specifiction forum.

Use cases > pet proposed syntax. Read and use Mozilla's WebAPI/DesignGuidelines.

sausage dressed as Lord Kitchener, pointing at viewer, strapline reads 'standards need you'

Thanks for help

Image acknowledgments

ß