Scandinavian Web Developers Conference Day 1

Peter Svensson welcomes us to the conference. No wifi for all, unfortunately. 3G coverage inside the cinema was just ok to work.

The first day is about the front-end and back-end of web development.

Robert Nyman – HTML5

Overview of HTML5 with a slight focus to the actual HTML and not so much all the new apis.

In 200 the WhatWG group was formed from Mozilla, Opera and Apple out of dissatisfaction with the W3C work on next HTML. Now Google is also a member of WhatWG.
HTML5 is about semantics, accessibility and apis.
<!DOCTYPE html> Note that there is no version in doctype declaration.
HTML5 isn’t necessarily XHTML. HTML5 interprets the html in a friendly mannor.
For XHTML no doctype is needed. Must have correct contenttype from server.
Many new input types: color, week range, search. Default to text if type is unknown/unimplemented by browser.
<meta charset=”utf-8″>
<header role=”banner”> Headers can occur multiple times in the page (for sections within the page).
Role attribute can be used by screen readers.
<nav role=”navigation”> Encloses the primary navigation structure of the site.
<article> <section> <header> <hgroup> <h2>title</h2>
An article element’s content should make sense outside the page context.
<aside role=”complimentary”>, <footer>
Problem with ajax and accessibility. aria-attributes. aria-live. aria-relevant. WAI-ARIA Live Regions.
Video. “Without Flash we wouldn’t have youtube”, “Things can actually coexist”, “Not everything has to kill something”
video element can follow with several source elements for different codecs. First one supported will be used by browser. object-element fallback can also be used for Flash etc.
WebM project made everyone happy. Will get hardware acceleration. Matters how content providers will support WebM. “Is optimistic about WebM”. Kaltura and more.
Canvas. getContent(“2d”). A “3d” context is also coming. shadowBlur. rotate.
explorercanvas by Emil is canvas for MSIE, translates canvas to VML. Now hired by Google.
Mozilla Bespin is text editor on the web with syntax highlighting.
Geolocation sort of bundled but not part of official specifikation.
Watch dot box on Google Maps if your browser (Firefox) supports geolocation.
Cross document messaging.
Drag’n drop. Reverse engineered from old MSIE. Not liked. May change.
Nice that HTML5 is here today. Google.com uses HTML5. Hired the guy working on the specification.
Sjoerd Visscher, html5 shiv(?). IE8 does not recognize new elements like article as css styleable. But if the page calls document.createElement for the element name, it does! The return value of createElement can be thrown away.
IE9 looks much better. Nice stuff.

Stefan Pettersson – Developing Large-Scale JavaScript Web Sites

Not so technical/concret, but still a good overview of some things to think about for web sites with heavy loads (and I would think, even good for small sites).

Worked with Netlight, Aftonbladet. Did the map for http://www.hitta.se.
Getting questions from customers wanting to “do it like Google does”. Sites with lots of traffic, much content, much functionality, complex mess.
Read books by Steve Souders on JavaScript performance (by O’Reilly).
Establish an architecture. Best practices. A way to work.
New job type “front-end engineer” in the middle.
Load scripts on demand.
Load scripts after rendering.
Cache renewal, append build number to url.
XHR or JSONP? Go JSONP. For cross-site-scripting solutions.
Go with REST.
Use YUI3 for dependencies, module loading. Has sandbox.
Static content servers like LiteHttp. Cookieless. Cache friendly headers. Gzip.
Don’t put onclick in tags, attach event by jquery or other framework.
Progressive enhancements.
Pixelperfect in all browsers? Drop it! Too muc work. Sample with pin “bubble” for hitta.se.
Avoid putting things in global namespace.
Module pattern. Simulating missing private/public distinction in JavaScript.
Know the client. Embrace the client. Peer code reviews.
Build and deploy: Aggregate. Minify. (Preprocessor.) Automation.
Now working for Expansive Worlds.

Alexander Lang – Designing domain models with document databases

Some patterns on how to design the domain model for a document database.

Creator of Couch Potato.
Don’t understands why MongoDB gets so much attension.
Every document has an id.
Get info by url. CouchDB has builtin http server.
Polymorphic associations.
Reporting.
Map function. function(doc) { … emit(doc.id, <value>); }
Reduce function. function(key, values) { }
Nested attributes (3D forms).
Sample with survery, questions, choices.
Copy versus associations.
Because map reduce is built in, query code can analyze.
Always fast through static indexes.
Indexes are built on reads, not writes. Writes not expensive at all.

Rik Arends – Developing applications in the cloud

Showing a complete development IDE in the browser. Not available publicly just yet.

From ajax.org, which are 15 people.
Doing JavaScript Charting and Live Markup.
Collaborative applications in the cloud. Refering to Google Docs.
Google BigTable map/reduce.
MongoDB soon autosharding. Redis.
[Nosql is actually sql without transactions, joins and predetermined schemas.]
Yahoo Geolocation Service.
Timeslider.
EtherPad.
Ajax.org Cloud IDE. Integrated with github.com. Demonstration a user interface in the browser. Looks a lot like Visual Studio with forms editor, property lists etc. Debugging.
Testing ui is hard. Selenium.
Chrome has socket open over which you can do debugging.
Sample with node.js and socket. Using GoogleGears like extension for now. Hoping that browsers will expose internal debug apis.
Next: read/write github, php, ruby, python, addon tooling, share code fragments.
Editor bindings.
@cloudeide for preview.

Daniel Glazman – Browser War 2010

A frenchmen showing languages skills in Swedish too. Inside W3C working groups.

Creator of Nvu. Did the styling engine of Netscape/Mozilla.
CEO of Disruptive Innovations.
W3C CSS working group co-chairman.
Blink and marqee tags are two proofs of the existence of the devil.
Handling bloody disputes from company strategists.
Must admin IE9 is very promising.
Never so many contributions to the working groups as today.
XHTML2 was big failure. Not backwards compatible.
“Reinventing HTML” by Tim Berners-Lee
HTML-WG => WhatWG 2006-10-27
HTML5 2009-10-06
HTML5: The most unreadable specification I have read in 20 years of standardization. Lots of internal links. The language.
Bluegriffin is new editor.
CSS2 object model was really bad with holes in the specification.
Canvas is going to shake the game industry too.
Impressed by Mozilla Bespin. Using frame buffer.
Properietary formats are doomed.
No flexible box model (yet).
Please stop supporting IE6.
JavaScript toolkits will have a hard time fighting for existence will new CSS3 support for transitions and animations.
Tensions in the standards communities.
Mozilla gets 80% of its revenue from Google. What will happen with that with regards to Chrome?
Infamous Apple tag <meta name=”viewport” />

Dylan Schiemann – Programming to patterns

Working with SitePen, Dojo.
Dojo 2.0 drops support for IE6/7. 50% less code.
Comparisions between Dojo and MooTools.
Mixins with Dojo.

Sergey Ilinsky – Managing complex client-side GUI Apps the right way

Creator of Ample SDK.
XBL2 doesn’t look to happen.
Put everything in script tags.
Declarative UI in the xml.
Open Source GUI frameworks ExtJS, Dojo, Qooxdoo, jQuery UI.
Events for removal in the document level.
Ample has a DOM and the browser has its DOM.
Div elements are not enough for datepickers and listviews.

Mark Wubben – Building browser extensions with Chrome.

Much easier than on Firefox with XUL and XPCom.
chrome://extensions/
An extension is a folder with a manifest.json file in it. Must have a name and a version.
Content scripts = User scripts from Greasemonkey (Aaron Boodman).
Isolated worlds.
Content scripts run in separate contexts, but shares the DOM.
Use events to communicate between scripts/extensions.
Sample: expand bit.ly urls on Twitter.
Background pages.
[Maybe someone should make a Firefox extension to read/run Chrome extensions for compatiblity between the browsers.]
[Secure also means less flexible.]
Chrome APIs.
Page actions. Browser actions. Popups.
Browser actions can talk between extensions.
Desktop notifications (in WebKit).
Url permissions shown on install.
[What's "Allow incognito" in extension configuration.]
11born.net/swdc
Someone has done something for Mozilla JetPack.

Malte Ubl – Getting started with node.js

The web is changing. We’re doing i/o wrong.
Comet.
JavaScript is popping up as a library language for the first time.
CommonJS, goal of server side JavaScript.
Node.js is all about non-blocking operations on the server. [Like .NET asynchronous requests.]
No breaking changes anymore to Node.js.
nonblocking.io
Cloud provider for Node.js.
Dependent on Python.
No Windows binary (yet), not a true Posix platform.

Patrick Chanezon – Google for developers

AppEngine for business.
Infrastructure As A Service = Amazon.
Platform As A Servuce = Google AppEngine [Windows Azure].
If you have an OpenID support and a notion of separate domains, you can integrate with Google App Marketplace.
Prediction API.
The APIs for Google Storage is the same as for Amazon S3, just change the domain. Adds a few features.

Chris Heilmann – Clever re-use of web technologies

From Yahoo.
Nobody cares what the html looks like.
Problems is that we love our technologies. Truism.
Play to push the envelope.
Not everyone has JavaScript on in their browsers.
Drag and drop is still confusing for a lot of users.
iPad is not the end of web design as we know it.
Not everything is solved with jQuery.
Issues in html5+css3: security, hardware access, native rich controls, layout, internationalization, accessibility, media.
A lot of “using newest technology” is a lame excuse for not architecting our solutions.
Yeah, we annoy people with open technology [not better than to annoy with closed technologies].
Progressive enhancement.
If you put a button on a web page that doesn’t work, you’ve broken a promise to your user [cause JavaScript is off].
Companies happy about Facebook blocking IE6.
developer-evangelism.com, wait-till-i.com.
Doesn’t matter what Apple makes since is is a religion and not a company. I buy 2nd and 3rd generation products these days.