+Mike West (mkw.st/+), @mikewest

Dart.

I work for Chrome in Munich.

Dart Dart: Complex, high-fidelity, modern web apps

Structured Web Programming

Motivation

The current web has some real advantages.
However, the current web also has some real disadvantages.

Opportunity for Innovation

The Language

Design Constraints


class Point {
  var x, y;
  Point(this.x, this.y);
  operator +(other) => new Point(x+other.x, y+other.y);
  scale(factor) => new Point(x*factor, y*factor);
  distance() => Math.sqrt(x*x + y*y);
}
        

Dart is…

Optional Types

Dynamic

Isolates

Isolates

Futures


button.on.click.add((e) {
  costlyQuery();
  expensiveWork();
  lengthComputation();
  print("done!");
});
        
Future<Results> costlyQuery() {
  var completer = new Completer();
  database.query("SELECT * FROM giant_table", (data) {
    completer.complete(data);
  });
  return completer.future; 
}
button.on.click.add((e) {
  Future result = costlyQuery();
  result.handleException((exception) => print("DOH!"));
  result.chain((value) => expensiveWork())
        .chain((value) => lengthyComputation())
        .then((value) => print("done!"));
});

Snapshotting

Dart is snapshottable, which leads to an order-of-magnitude improvement in startup performance.

Libraries

#library("amazingness");

#import('dart:html');

DOM

// ...

sayHello(Element parent) {
  Element p = new Element.tag('p');
  p.text = 'Hello, Dartians!';
  p.on.click.add((event) => print 'You can click!');
  parent.nodes.add(p);
}

// ...

Templates

template Hello(String to) {
  <p var=p>${to}</p>
}
#import('dart:html');
#source('hello.dart');

main() {
  Hello hello = new Hello("Bob");
  hello.p.on.click.add((e) => print('Clicking!'));
  document.body.elements.add(hello.root);
}

Dart Editor

Screenshot of the Dart editor.

Dart SDK

Dartium

Dart to JavaScript

Paul Kinlan can see the future. The Future™

This presentation is already out of date.

Dart is not done

We need your help!

dartbug.com

Learn more!

?

+Mike West (mkw.st/+) mkwst@google.com