Removed dirty checking, minor optimizations (#135)

* Removed dirty checking, minor optimizations

An update will now only be queued through requestAnimationFrame whenever
changes occurred. This means that absolutely no code is running when the
page is idling (helpful for power saving and scalability). Care was
taken to first read from the DOM and afterwards update it in the new
scroll handler to prevent any possible layout thrashing as described here:

http://wilsonpage.co.uk/preventing-layout-thrashing/

lastWidth, lastHeight and all sensor properties are only updated
once every frame.

* Run callbacks only if size changed between two frames

An element may change its size multiple times during a frame. Do not
emit events anymore if its size returned to its previous size since the
last update. This means that events occurring in between two frames -
which are never visible to the user - may be skipped.

* Reset sensors always

Sensors need to be reset even if the element's size returned to its
original dimensions.

* Fix performance regression

Resetting within the requestAnimationFrame handler lead to bad
performance. This was noticeable in the performance demo where this
version fares about as good as older versions.

* Avoid initial resize event

* Code simplification

src/ResizeSensor.js

@@ -143,10 +143,13 @@
             var expand = element.resizeSensor.childNodes[0];
             var expandChild = expand.childNodes[0];
             var shrink = element.resizeSensor.childNodes[1];
+            var dirty, rafId, newWidth, newHeight;
+            var lastWidth = element.offsetWidth;
+            var lastHeight = element.offsetHeight;
 
             var reset = function() {
-                expandChild.style.width  = 100000 + 'px';
-                expandChild.style.height = 100000 + 'px';
+                expandChild.style.width = '100000px';
+                expandChild.style.height = '100000px';
 
                 expand.scrollLeft = 100000;
                 expand.scrollTop = 100000;
@@ -156,31 +159,30 @@
             };
 
             reset();
-            var dirty = false;
 
-            var dirtyChecking = function() {
-                if (!element.resizedAttached) return;
+            var onResized = function() {
+                rafId = 0;
 
-                if (dirty) {
+                if (!dirty) return;
+
+                lastWidth = newWidth;
+                lastHeight = newHeight;
+
+                if (element.resizedAttached) {
                     element.resizedAttached.call();
-                    dirty = false;
                 }
-
-                requestAnimationFrame(dirtyChecking);
             };
 
-            requestAnimationFrame(dirtyChecking);
-            var lastWidth, lastHeight;
-            var cachedWidth, cachedHeight; //useful to not query offsetWidth twice
-
             var onScroll = function() {
-              if ((cachedWidth = element.offsetWidth) != lastWidth || (cachedHeight = element.offsetHeight) != lastHeight) {
-                  dirty = true;
+                newWidth = element.offsetWidth;
+                newHeight = element.offsetHeight;
+                dirty = newWidth != lastWidth || newHeight != lastHeight;
+
+                if (dirty && !rafId) {
+                    rafId = requestAnimationFrame(onResized);
+                }
 
-                  lastWidth = cachedWidth;
-                  lastHeight = cachedHeight;
-              }
-              reset();
+                reset();
             };
 
             var addEvent = function(el, name, cb) {