diff --git a/demo/index.html b/demo/index.html
index c2fc3e9..632d45a 100644
--- a/demo/index.html
+++ b/demo/index.html
@@ -116,6 +116,11 @@
           $scope.remove = function(item) {
             $scope.data.splice($scope.data.indexOf(item), 1);
           };
+          
+          $scope.$on('td.tileview.layout', function() {
+            console.log('layout');
+            console.trace();
+          });
         }]);
     </script>
     <script type="text/ng-template" id="SimpleCell">
diff --git a/dist/tileview.js b/dist/tileview.js
index a7ccae9..323b148 100644
--- a/dist/tileview.js
+++ b/dist/tileview.js
@@ -102,7 +102,7 @@
                         if (options === currentOptions || options.alignHorizontal !== currentOptions.alignHorizontal) {
                             handleAlignHorizontalChange();
                         }
-                        layout();
+                        layout(true);
                         if (options === currentOptions || options.tileSize.width !== currentOptions.tileSize.width || options.tileSize.height !== currentOptions.tileSize.height) {
                             handleTileSizeChange();
                         }
@@ -110,7 +110,7 @@
                     var sizeDimension, orthogonalDimension;
                     scope.$watchCollection('items', function () {
                         lastScrollPosition = Number.NEGATIVE_INFINITY;
-                        layout();
+                        layout(true);
                     });
                     scope.$on('td.tileview.resize', resize);
                     angular.element($window).on('resize', onResize);
@@ -249,8 +249,7 @@
                     function resize(withDigest) {
                         var newComponentSize = container[0].getBoundingClientRect();
                         if (newComponentSize.width !== componentWidth || newComponentSize.height !== componentHeight) {
-                            layout();
-                            if (withDigest === true) {
+                            if (layout(false) && withDigest === true) {
                                 forEachElement(function (el) { return el.scope().$digest(); });
                             }
                         }
@@ -258,22 +257,34 @@
                     function onResize() {
                         resize(true);
                     }
+                    function measure() {
+                        var rect = container[0].getBoundingClientRect();
+                        componentWidth = rect.width;
+                        componentHeight = rect.height;
+                        var itemWidth = scope.options.tileSize.width;
+                        var width = rect.width;
+                        var size = rect[sizeDimension];
+                        var newItemsPerRow = (scope.options.alignHorizontal) ? 1 : Math.floor(width / itemWidth);
+                        var newCachedRowCount = Math.ceil(size / scope.options.tileSize[sizeDimension]) + scope.options.overflow * 2;
+                        var changes = newItemsPerRow !== itemsPerRow || newCachedRowCount !== cachedRowCount;
+                        itemsPerRow = newItemsPerRow;
+                        cachedRowCount = newCachedRowCount;
+                        rowCount = Math.ceil(scope.items.length / itemsPerRow);
+                        return changes;
+                    }
                     var componentWidth = 0, componentHeight = 0;
-                    function layout() {
+                    function layout(alwaysLayout) {
                         if (linkFunction !== undefined && scope.items !== undefined && sizeDimension !== undefined) {
-                            var rect = container[0].getBoundingClientRect();
-                            componentWidth = rect.width;
-                            componentHeight = rect.height;
-                            var itemWidth = scope.options.tileSize.width;
-                            var width = container[0].getBoundingClientRect().width;
-                            var size = rect[sizeDimension];
-                            itemsPerRow = (scope.options.alignHorizontal) ? 1 : Math.floor(width / itemWidth);
-                            rowCount = Math.ceil(scope.items.length / itemsPerRow);
-                            cachedRowCount = Math.ceil(size / scope.options.tileSize[sizeDimension]) + scope.options.overflow * 2;
-                            createElements(cachedRowCount);
-                            itemContainer.css(sizeDimension, rowCount * scope.options.tileSize[sizeDimension] + 'px');
-                            itemContainer.css(orthogonalDimension, '100%');
+                            if (measure() || alwaysLayout) {
+                                createElements(cachedRowCount);
+                                itemContainer.css(sizeDimension, rowCount * scope.options.tileSize[sizeDimension] + 'px');
+                                itemContainer.css(orthogonalDimension, '100%');
+                                //setPlaceholder();
+                                scope.$parent.$broadcast('td.tileview.layout');
+                                return true;
+                            }
                         }
+                        return false;
                     }
                     function update() {
                         animationFrameRequested = false;
diff --git a/src/tileview.ts b/src/tileview.ts
index 236dc36..0fdf226 100644
--- a/src/tileview.ts
+++ b/src/tileview.ts
@@ -73,14 +73,14 @@ declare const angular: any;
         let cachedRowCount;
 
         let virtualRows = [];
-        
+
         function handleTileSizeChange() {
           forEachElement((el, i) => {
             el.css('width', scope.options.tileSize.width + 'px');
             el.css('height', scope.options.tileSize.height + 'px');
           });
         }
-        
+
         function handleTemplateUrlChange() {
           const template = $templateCache.get(scope.options.templateUrl);
           if (template !== undefined) {
@@ -90,7 +90,7 @@ declare const angular: any;
             console.error('Template url not found: ' + scope.options.templateUrl);
           }
         }
-        
+
         function handleAlignHorizontalChange() {
           if (scope.options.alignHorizontal) {
             sizeDimension = 'width';
@@ -109,14 +109,14 @@ declare const angular: any;
           options.overflow = def(options.overflow, 2);
           options.debounce = def(options.debounce, 0);
           options.afterScrollDelay = def(options.afterScrollDelay, 100);
-          
+
           if (options === currentOptions || options.templateUrl !== currentOptions.templateUrl) {
             handleTemplateUrlChange();
           }
           if (options === currentOptions || options.alignHorizontal !== currentOptions.alignHorizontal) {
             handleAlignHorizontalChange();
           }
-          layout();
+          layout(true);
           if (options === currentOptions || options.tileSize.width !== currentOptions.tileSize.width || options.tileSize.height !== currentOptions.tileSize.height) {
             handleTileSizeChange();
           }
@@ -125,7 +125,7 @@ declare const angular: any;
         var sizeDimension, orthogonalDimension;
         scope.$watchCollection('items', () => {
           lastScrollPosition = Number.NEGATIVE_INFINITY;
-          layout();
+          layout(true);
         });
         scope.$on('td.tileview.resize', resize);
 
@@ -226,7 +226,7 @@ declare const angular: any;
           itemContainer.append(row);
           return row;
         }
-        
+
         function removeRow() {
           itemContainer.children().eq(-1).remove();
         }
@@ -263,7 +263,7 @@ declare const angular: any;
         function createElements(numRows) {
           updateVisibleRows();
           const currentRowCount = itemContainer.children().length;
-          
+
           if (currentRowCount < numRows) {
             for (let i = currentRowCount; i < numRows; ++i) {
               addRow();
@@ -273,7 +273,7 @@ declare const angular: any;
               removeRow();
             }
           }
-          
+
           forEachRow(fillRow);
 
           virtualRows = [];
@@ -287,8 +287,7 @@ declare const angular: any;
         function resize(withDigest) {
           const newComponentSize = container[0].getBoundingClientRect();
           if (newComponentSize.width !== componentWidth || newComponentSize.height !== componentHeight) {
-            layout();
-            if (withDigest === true) {
+            if (layout(false) && withDigest === true) {
               forEachElement(el => el.scope().$digest());
             }
           }
@@ -298,26 +297,38 @@ declare const angular: any;
           resize(true);
         }
 
+        function measure() {
+          const rect = container[0].getBoundingClientRect();
+          componentWidth = rect.width;
+          componentHeight = rect.height;
+          const itemWidth = scope.options.tileSize.width;
+          const width = rect.width;
+          const size = rect[sizeDimension];
+
+          const newItemsPerRow = (scope.options.alignHorizontal) ? 1 : Math.floor(width / itemWidth);
+          const newCachedRowCount = Math.ceil(size / scope.options.tileSize[sizeDimension]) + scope.options.overflow * 2;
+
+          const changes = newItemsPerRow !== itemsPerRow || newCachedRowCount !== cachedRowCount;
+          itemsPerRow = newItemsPerRow;
+          cachedRowCount = newCachedRowCount;
+          rowCount = Math.ceil(scope.items.length / itemsPerRow);
+          return changes;
+        }
+
         let componentWidth = 0, componentHeight = 0;
-        function layout() {
+        function layout(alwaysLayout) {
           if (linkFunction !== undefined && scope.items !== undefined && sizeDimension !== undefined) {
-            const rect = container[0].getBoundingClientRect();
-            componentWidth = rect.width;
-            componentHeight = rect.height;
-            const itemWidth = scope.options.tileSize.width;
-            const width = container[0].getBoundingClientRect().width;
-            const size = rect[sizeDimension];
-
-            itemsPerRow = (scope.options.alignHorizontal) ? 1 : Math.floor(width / itemWidth);
-            rowCount = Math.ceil(scope.items.length / itemsPerRow);
-            cachedRowCount = Math.ceil(size / scope.options.tileSize[sizeDimension]) + scope.options.overflow * 2;
-
-            createElements(cachedRowCount);
-
-            itemContainer.css(sizeDimension, rowCount * scope.options.tileSize[sizeDimension] + 'px');
-            itemContainer.css(orthogonalDimension, '100%');
-            //setPlaceholder();
+            if (measure() || alwaysLayout) {
+              createElements(cachedRowCount);
+
+              itemContainer.css(sizeDimension, rowCount * scope.options.tileSize[sizeDimension] + 'px');
+              itemContainer.css(orthogonalDimension, '100%');
+              //setPlaceholder();
+              scope.$parent.$broadcast('td.tileview.layout');
+              return true;
+            }
           }
+          return false;
         }
 
         function update() {