diff --git a/examples/raw/hello_world.dart b/examples/raw/hello_world.dart
index c9ed52af24..ee4669c5d7 100644
--- a/examples/raw/hello_world.dart
+++ b/examples/raw/hello_world.dart
@@ -8,7 +8,7 @@ Picture draw(int a, int r, int g, int b) {
   Size size = new Size(view.width, view.height);
 
   PictureRecorder recorder = new PictureRecorder();
-  final double devicePixelRatio = sky.view.devicePixelRatio;
+  final double devicePixelRatio = view.devicePixelRatio;
   Canvas canvas = new Canvas(recorder, Point.origin & (size * devicePixelRatio));
   canvas.scale(devicePixelRatio, devicePixelRatio);
   double radius = size.shortestSide * 0.45;
diff --git a/examples/raw/painting_node.dart b/examples/raw/painting_node.dart
index 2a7e67f5ab..3cfa950cef 100644
--- a/examples/raw/painting_node.dart
+++ b/examples/raw/painting_node.dart
@@ -21,7 +21,7 @@ Picture draw(int a, int r, int g, int b) {
     paintingNode = new PaintingNode();
     Paint innerPaint = new Paint()..color = new Color.fromARGB(a, 255 - r, 255 - g, 255 - b);
     PictureRecorder innerRecorder = new PictureRecorder();
-    Canvas innerCanvas = new Canvas(innerRecorder, Point.origin & bounds);
+    Canvas innerCanvas = new Canvas(innerRecorder, Point.origin & size);
     innerCanvas.drawCircle(size.center(Point.origin), radius * 0.5, innerPaint);
 
     paintingNode.setBackingDrawable(innerRecorder.endRecordingAsDrawable());
diff --git a/examples/raw/shadow.dart b/examples/raw/shadow.dart
index 2907a3cb61..c301beb8fb 100644
--- a/examples/raw/shadow.dart
+++ b/examples/raw/shadow.dart
@@ -21,11 +21,11 @@ void beginFrame(double timeStamp) {
           ..setPaintBits(PaintBits.all)
           ..setOffset(const Offset(5.0, 5.0))
           ..setColorMode(TransferMode.src),
-        (Paint layerPaint) {
-      layerPaint.color = const Color.fromARGB(128, 55, 55, 55);
-      layerPaint.setMaskFilter(
-          new MaskFilter.blur(BlurStyle.normal, 5.0, highQuality: true));
-    })
+        new Paint()
+          ..color = const Color.fromARGB(128, 55, 55, 55)
+          ..setMaskFilter(
+            new MaskFilter.blur(BlurStyle.normal, 5.0, highQuality: true))
+    )
     // Main layer.
     ..addLayerOnTop(new DrawLooperLayerInfo(), new Paint());
   paint.setDrawLooper(builder.build());
diff --git a/examples/raw/spinning_image.dart b/examples/raw/spinning_image.dart
index 8e5267b8b5..d4a22395ed 100644
--- a/examples/raw/spinning_image.dart
+++ b/examples/raw/spinning_image.dart
@@ -20,7 +20,7 @@ void beginFrame(double timeStamp) {
   PictureRecorder recorder = new PictureRecorder();
   final double devicePixelRatio = view.devicePixelRatio;
   Canvas canvas = new Canvas(recorder, Point.origin & new Size(view.width * devicePixelRatio, view.height * devicePixelRatio));
-  cavnas.scale(devicePixelRatio, devicePixelRatio);
+  canvas.scale(devicePixelRatio, devicePixelRatio);
   canvas.translate(view.width / 2.0, view.height / 2.0);
   canvas.rotate(math.PI * delta / 1800);
   canvas.scale(0.2, 0.2);
@@ -61,7 +61,7 @@ bool handleEvent(Event event) {
   }
 
   if (event.type == "pointerup") {
-    image_cache.load(url2).then(handleImageLoad);
+    image_cache.load(url2).first.then(handleImageLoad);
     return true;
   }
 
@@ -69,7 +69,7 @@ bool handleEvent(Event event) {
 }
 
 void main() {
-  image_cache.load(url1).then(handleImageLoad);
+  image_cache.load(url1).first.then(handleImageLoad);
   view.setEventCallback(handleEvent);
   view.setFrameCallback(beginFrame);
 }
diff --git a/examples/rendering/align_items.dart b/examples/rendering/align_items.dart
index c8f6b24d04..817857d8da 100644
--- a/examples/rendering/align_items.dart
+++ b/examples/rendering/align_items.dart
@@ -18,25 +18,25 @@ void main() {
 
   for(FlexAlignItems alignItems in FlexAlignItems.values) {
     TextStyle style = const TextStyle(color: const Color(0xFF000000));
-    RenderParagraph paragraph = new RenderParagraph(new RenderStyled(style, [new RenderText("${alignItems}")]));
+    RenderParagraph paragraph = new RenderParagraph(new StyledTextSpan(style, [new PlainTextSpan("${alignItems}")]));
     table.add(new RenderPadding(child: paragraph, padding: new EdgeDims.only(top: 20.0)));
     var row = new RenderFlex(alignItems: alignItems, textBaseline: TextBaseline.alphabetic);
 
     style = new TextStyle(fontSize: 15.0, color: const Color(0xFF000000));
     row.add(new RenderDecoratedBox(
       decoration: new BoxDecoration(backgroundColor: const Color(0x7FFFCCCC)),
-      child: new RenderParagraph(new RenderStyled(style, [new RenderText('foo foo foo')]))
+      child: new RenderParagraph(new StyledTextSpan(style, [new PlainTextSpan('foo foo foo')]))
     ));
     style = new TextStyle(fontSize: 10.0, color: const Color(0xFF000000));
     row.add(new RenderDecoratedBox(
       decoration: new BoxDecoration(backgroundColor: const Color(0x7FCCFFCC)),
-      child: new RenderParagraph(new RenderStyled(style, [new RenderText('foo foo foo')]))
+      child: new RenderParagraph(new StyledTextSpan(style, [new PlainTextSpan('foo foo foo')]))
     ));
     var subrow = new RenderFlex(alignItems: alignItems, textBaseline: TextBaseline.alphabetic);
     style = new TextStyle(fontSize: 25.0, color: const Color(0xFF000000));
     subrow.add(new RenderDecoratedBox(
       decoration: new BoxDecoration(backgroundColor: const Color(0x7FCCCCFF)),
-      child: new RenderParagraph(new RenderStyled(style, [new RenderText('foo foo foo foo')]))
+      child: new RenderParagraph(new StyledTextSpan(style, [new PlainTextSpan('foo foo foo foo')]))
     ));
     subrow.add(new RenderSolidColorBox(const Color(0x7FCCFFFF), desiredSize: new Size(30.0, 40.0)));
     row.add(subrow);
diff --git a/examples/rendering/baseline.dart b/examples/rendering/baseline.dart
index 527d9cd8b5..3d61016872 100644
--- a/examples/rendering/baseline.dart
+++ b/examples/rendering/baseline.dart
@@ -13,19 +13,19 @@ import 'package:sky/rendering/sky_binding.dart';
 
 RenderBox getBox(double lh) {
   RenderParagraph paragraph = new RenderParagraph(
-    new RenderStyled(
+    new StyledTextSpan(
       new TextStyle(
         color: const Color(0xFF0000A0)
       ),
       [
-        new RenderText('test'),
-        new RenderStyled(
+        new PlainTextSpan('test'),
+        new StyledTextSpan(
           new TextStyle(
             fontFamily: 'serif',
             fontSize: 50.0,
             height: lh
           ),
-          [new RenderText('مرحبا Hello')]
+          [new PlainTextSpan('مرحبا Hello')]
         )
       ]
     )
diff --git a/examples/rendering/interactive_flex.dart b/examples/rendering/interactive_flex.dart
index 2f1b97cef9..462ea0be2b 100644
--- a/examples/rendering/interactive_flex.dart
+++ b/examples/rendering/interactive_flex.dart
@@ -65,7 +65,7 @@ void main() {
 
   // Resizeable image
   image = new RenderImageGrow(null, new Size(100.0, null));
-  image_cache.load("https://www.dartlang.org/logos/dart-logo.png").then((Image dartLogo) {
+  image_cache.load("https://www.dartlang.org/logos/dart-logo.png").first.then((Image dartLogo) {
     image.image = dartLogo;
   });
 
@@ -84,9 +84,9 @@ porchetta bacon kevin meatball meatloaf pig beef ribs chicken. Brisket ribeye
 andouille leberkas capicola meatloaf. Chicken pig ball tip pork picanha bresaola
 alcatra. Pork pork belly alcatra, flank chuck drumstick biltong doner jowl.
 Pancetta meatball tongue tenderloin rump tail jowl boudin.""";
-  var text = new RenderStyled(
+  var text = new StyledTextSpan(
       new TextStyle(color:  const Color(0xFF009900)),
-      [new RenderText(meatyString)]);
+      [new PlainTextSpan(meatyString)]);
   padding = new RenderPadding(
       padding: const EdgeDims.all(10.0),
       child: new RenderParagraph(text));
diff --git a/examples/rendering/justify_content.dart b/examples/rendering/justify_content.dart
index 13e01d0cda..df3e1865b8 100644
--- a/examples/rendering/justify_content.dart
+++ b/examples/rendering/justify_content.dart
@@ -21,7 +21,7 @@ void main() {
   var table = new RenderFlex(direction: FlexDirection.vertical);
 
   void addRow(FlexJustifyContent justify) {
-    RenderParagraph paragraph = new RenderParagraph(new RenderStyled(style, [new RenderText("${justify}")]));
+    RenderParagraph paragraph = new RenderParagraph(new StyledTextSpan(style, [new PlainTextSpan("${justify}")]));
     table.add(new RenderPadding(child: paragraph, padding: new EdgeDims.only(top: 20.0)));
     var row = new RenderFlex(direction: FlexDirection.horizontal);
     row.add(new RenderSolidColorBox(const Color(0xFFFFCCCC), desiredSize: new Size(80.0, 60.0)));
diff --git a/examples/rendering/render_paragraph.dart b/examples/rendering/render_paragraph.dart
index 3227e90d82..58e390b3d2 100644
--- a/examples/rendering/render_paragraph.dart
+++ b/examples/rendering/render_paragraph.dart
@@ -32,9 +32,9 @@ andouille leberkas capicola meatloaf. Chicken pig ball tip pork picanha bresaola
 alcatra. Pork pork belly alcatra, flank chuck drumstick biltong doner jowl.
 Pancetta meatball tongue tenderloin rump tail jowl boudin.""";
 
-  var text = new RenderStyled(
+  var text = new StyledTextSpan(
       new TextStyle(color:  const Color(0xFF009900)),
-      [new RenderText(meatyString)]);
+      [new PlainTextSpan(meatyString)]);
   child = new RenderDecoratedBox(
     decoration: new BoxDecoration(backgroundColor: const Color(0xFFFFFFFF)),
     child: new RenderParagraph(text)
diff --git a/examples/rendering/touch_demo.dart b/examples/rendering/touch_demo.dart
index d94333bb0c..33d745fd4e 100644
--- a/examples/rendering/touch_demo.dart
+++ b/examples/rendering/touch_demo.dart
@@ -76,12 +76,12 @@ class RenderTouchDemo extends RenderBox {
         ..color = const Color(0xFFFFFFFF);
     canvas.drawRect(offset & size, white);
     for (Dot dot in dots.values)
-      dot.paint(canvas, offset);
+      dot.paint(context, offset);
   }
 }
 
 void main() {
-  var paragraph = new RenderParagraph(new RenderText("Touch me!"));
+  var paragraph = new RenderParagraph(new PlainTextSpan("Touch me!"));
   var stack = new RenderStack(children: [
     new RenderTouchDemo(),
     paragraph,
diff --git a/examples/widgets/progress_indicator.dart b/examples/widgets/progress_indicator.dart
index df06c452b8..5d8d1a3aed 100644
--- a/examples/widgets/progress_indicator.dart
+++ b/examples/widgets/progress_indicator.dart
@@ -20,12 +20,12 @@ import 'package:sky/widgets/transitions.dart';
 
 class ProgressIndicatorApp extends App {
 
-  AnimationPerformance valueAnimation;
+  ValueAnimation<double> valueAnimation;
   Direction valueAnimationDirection = Direction.forward;
 
   void initState() {
     super.initState();
-    valueAnimation = new AnimationPerformance()
+    valueAnimation = new ValueAnimation<double>()
       ..duration = const Duration(milliseconds: 1500)
       ..variable = new AnimatedValue<double>(
         0.0,
@@ -59,17 +59,17 @@ class ProgressIndicatorApp extends App {
         ),
         new LinearProgressIndicator(),
         new LinearProgressIndicator(),
-        new LinearProgressIndicator(value: valueAnimation.variable.value),
+        new LinearProgressIndicator(value: valueAnimation.value),
         new CircularProgressIndicator(),
         new SizedBox(
             width: 20.0,
             height: 20.0,
-            child: new CircularProgressIndicator(value: valueAnimation.variable.value)
+            child: new CircularProgressIndicator(value: valueAnimation.value)
         ),
         new SizedBox(
           width: 50.0,
           height: 30.0,
-          child: new CircularProgressIndicator(value: valueAnimation.variable.value)
+          child: new CircularProgressIndicator(value: valueAnimation.value)
         )
     ];
     return new Flex(