Example showing alternate async measurement solution

client/layout/ViewLayout.dart

-// Copyright (c) 2011, the Dart project authors.  Please see the AUTHORS file
+// Copyright (c) 2012, the Dart project authors.  Please see the AUTHORS file
 // for details. All rights reserved. Use of this source code is governed by a
 // BSD-style license that can be found in the LICENSE file.
 
 /** The interface that the layout algorithms use to talk to the view. */
 interface Positionable {
   ViewLayout get layout();
 
   /** Gets our custom CSS properties, as provided by the CSS preprocessor. */
   Map<String, String> get customStyle();
 
   /** Gets the root DOM used for layout. */
   Element get node();
 
   /** Gets the collection of child views. */
   Collection<Positionable> get childViews();
 
   /** Causes a view to layout its children. */
   void doLayout();
 }
 
 
 /**
  * Caches the layout parameters that were specified in CSS during a layout
  * computation. These values are immutable during a layout.
  */
 class LayoutParams {
   // TODO(jmesserly): should be const, but there's a bug in DartC preventing us
   // from calling "window." in an initializer. See b/5332777
-  Future<CSSStyleDeclaration> style;
+  CSSStyleDeclaration style;
 
   int get layer() => 0;
 
   LayoutParams(Element node) {
     style = node.computedStyle;
   }
 }
 
 // TODO(jmesserly): enums would really help here
 class Dimension {
@@ skipping 23 matching lines @@
  * Abstract base class for View layout. Tracks relevant layout state.
  * This code was inspired by code in Android's View.java; it's needed for the
  * rest of the layout system.
  */
 class ViewLayout {
   /**
    * The layout parameters associated with this view and used by the parent
    * to determine how this view should be laid out.
    */
   LayoutParams layoutParams;
-  Future<ElementRect> _cachedViewRect;
+  int _currentWidth;
+  int _currentHeight;
 
   /** The view that this layout belongs to. */
   final Positionable view;
 
   /**
    * To get a perforant positioning model on top of the DOM, we read all
    * properties in the first pass while computing positions. Then we have a
    * second pass that actually moves everything.
    */
   int _measuredLeft, _measuredTop, _measuredWidth, _measuredHeight;
@@ skipping 10 matching lines @@
       return new GridLayout(view);
     } else {
       return new ViewLayout(view);
     }
   }
 
   static bool hasCustomLayout(Positionable view) {
     return view.customStyle['display'] == "-dart-grid";
   }
 
-  CSSStyleDeclaration get _style() => layoutParams.style.value;
+  CSSStyleDeclaration get _style() => layoutParams.style;
 
   void cacheExistingBrowserLayout() {
-    _cachedViewRect = view.node.rect;
+    assert(window.inMeasurementFrame);
+    final rect = view.node.rect.offset;
+    _currentWidth = rect.width;
+    _currentHeight = rect.height;
   }
 
-  int get currentWidth() {
-    return _cachedViewRect.value.offset.width;
-  }
-
-  int get currentHeight() {
-    return _cachedViewRect.value.offset.height;
-  }
+  int get currentWidth() => _currentWidth;
+  int get currentHeight() => _currentHeight;
 
   int get borderLeftWidth() => _toPixels(_style.borderLeftWidth);
   int get borderTopWidth() => _toPixels(_style.borderTopWidth);
   int get borderRightWidth() => _toPixels(_style.borderRightWidth);
   int get borderBottomWidth() => _toPixels(_style.borderBottomWidth);
   int get borderWidth() => borderLeftWidth + borderRightWidth;
   int get borderHeight() => borderTopWidth + borderBottomWidth;
 
   /** Implements the custom layout computation. */
-  void measureLayout(Future<Size> size, Completer<bool> changed) {
+  bool measureLayout(int width, int height) {
   }
 
   /**
    * Positions the view within its parent container.
    * Also performs a layout of its children.
    */
   void setBounds(int left, int top, int width, int height) {
     assert(width >= 0 && height >= 0);
 
     _measuredLeft = left;
     _measuredTop = top;
 
     // Note: we need to save the client height
     _measuredWidth = width - borderWidth;
     _measuredHeight = height - borderHeight;
-    final completer = new Completer<Size>();
-    completer.complete(new Size(_measuredWidth, _measuredHeight));
-    measureLayout(completer.future, null);
+    measureLayout(_measuredWidth, _measuredHeight);
   }
 
   /** Applies the layout to the node. */
   void applyLayout() {
+    assert(!window.inMeasurementFrame);
     if (_measuredLeft != null) {
       // TODO(jmesserly): benchmark the performance of this DOM interaction
       final style = view.node.style;
       style.position = 'absolute';
       style.left = '${_measuredLeft}px';
       style.top = '${_measuredTop}px';
       style.width = '${_measuredWidth}px';
       style.height = '${_measuredHeight}px';
       style.zIndex = '${layoutParams.layer}';
 
@@ skipping 21 matching lines @@
                      [ContentSizeMode mode = null]) {
     switch (dimension) {
       case Dimension.WIDTH:
         return measureWidth(parent, mode);
       case Dimension.HEIGHT:
         return measureHeight(parent, mode);
     }
   }
 
   int measureWidth(ViewLayout parent, ContentSizeMode mode) {
-    final style = layoutParams.style.value;
+    final style = layoutParams.style;
     switch (mode) {
       case ContentSizeMode.MIN:
         return _styleToPixels(
             style.minWidth, currentWidth, parent.currentWidth);
 
       case ContentSizeMode.MAX:
         return _styleToPixels(
             style.maxWidth, currentWidth, parent.currentWidth);
     }
   }
 
   int measureHeight(ViewLayout parent, ContentSizeMode mode) {
-    final style = layoutParams.style.value;
+    final style = layoutParams.style;
     switch (mode) {
       case ContentSizeMode.MIN:
         return _styleToPixels(
             style.minHeight, currentHeight, parent.currentHeight);
 
       case ContentSizeMode.MAX:
         return _styleToPixels(
             style.maxHeight, currentHeight, parent.currentHeight);
     }
   }
@@ skipping 13 matching lines @@
       // For an unset max-content size, use the actual size
       return size;
     }
     if (style.endsWith('%')) {
       num percent = Math.parseDouble(style.substring(0, style.length - 1));
       return ((percent / 100) * parentSize).toInt();
     }
     return _toPixels(style);
   }
 }