Optimization with image loading

build/framer.js

@@ -1,7 +1,7 @@
-// Framer v2.0.0b1-36-g3ad0dc0 (c) 2013 Koen Bok
+// Framer v2.0.0b1-38-ged0c03b (c) 2013 Koen Bok
 // https://github.com/koenbok/Framer
 
-window.FramerVersion = "v2.0.0b1-36-g3ad0dc0";
+window.FramerVersion = "v2.0.0b1-38-ged0c03b";
 
 
 (function(){var require = function (file, cwd) {
@@ -4552,23 +4552,27 @@ require.define("/src/views/imageview.coffee",function(require,module,exports,__d
         return this._image;
       },
       set: function(value) {
-        var loader,
+        var loader, _ref, _ref1,
           _this = this;
 
         if (this._image === value) {
           return this.emit("load", loader);
         }
         this._image = value;
-        loader = new Image();
-        loader.name = this.image;
-        loader.src = this.image;
-        loader.onload = function() {
-          _this.style["background-image"] = "url('" + _this.image + "')";
-          return _this.emit("load", loader);
-        };
-        return loader.onerror = function() {
-          return _this.emit("error", loader);
-        };
+        if ((_ref = this.events) != null ? _ref.hasOwnProperty("load" || ((_ref1 = this.events) != null ? _ref1.hasOwnProperty("error") : void 0)) : void 0) {
+          loader = new Image();
+          loader.name = this.image;
+          loader.src = this.image;
+          loader.onload = function() {
+            _this.style["background-image"] = "url('" + _this.image + "')";
+            return _this.emit("load", loader);
+          };
+          return loader.onerror = function() {
+            return _this.emit("error", loader);
+          };
+        } else {
+          return this.style["background-image"] = "url('" + this.image + "')";
+        }
       }
     });
 

src/views/imageview.coffee

@@ -25,13 +25,21 @@ class exports.ImageView extends View
 
 			@_image = value
 
-			loader = new Image()
-			loader.name = @image
-			loader.src = @image
+			# As an optimization, we will only use a loader
+			# if something is explicitly listening to the load event
 
-			loader.onload = =>
-				@style["background-image"] = "url('#{@image}')"
-				@emit "load", loader
+			if @events?.hasOwnProperty "load" or @events?.hasOwnProperty "error"
 
-			loader.onerror = =>
-				@emit "error", loader
+				loader = new Image()
+				loader.name = @image
+				loader.src = @image
+
+				loader.onload = =>
+					@style["background-image"] = "url('#{@image}')"
+					@emit "load", loader
+
+				loader.onerror = =>
+					@emit "error", loader
+
+			else
+				@style["background-image"] = "url('#{@image}')"

template/framer.js

@@ -1,7 +1,7 @@
-// Framer v2.0.0b1-36-g3ad0dc0 (c) 2013 Koen Bok
+// Framer v2.0.0b1-38-ged0c03b (c) 2013 Koen Bok
 // https://github.com/koenbok/Framer
 
-window.FramerVersion = "v2.0.0b1-36-g3ad0dc0";
+window.FramerVersion = "v2.0.0b1-38-ged0c03b";
 
 
 (function(){var require = function (file, cwd) {
@@ -4552,23 +4552,27 @@ require.define("/src/views/imageview.coffee",function(require,module,exports,__d
         return this._image;
       },
       set: function(value) {
-        var loader,
+        var loader, _ref, _ref1,
           _this = this;
 
         if (this._image === value) {
           return this.emit("load", loader);
         }
         this._image = value;
-        loader = new Image();
-        loader.name = this.image;
-        loader.src = this.image;
-        loader.onload = function() {
-          _this.style["background-image"] = "url('" + _this.image + "')";
-          return _this.emit("load", loader);
-        };
-        return loader.onerror = function() {
-          return _this.emit("error", loader);
-        };
+        if ((_ref = this.events) != null ? _ref.hasOwnProperty("load" || ((_ref1 = this.events) != null ? _ref1.hasOwnProperty("error") : void 0)) : void 0) {
+          loader = new Image();
+          loader.name = this.image;
+          loader.src = this.image;
+          loader.onload = function() {
+            _this.style["background-image"] = "url('" + _this.image + "')";
+            return _this.emit("load", loader);
+          };
+          return loader.onerror = function() {
+            return _this.emit("error", loader);
+          };
+        } else {
+          return this.style["background-image"] = "url('" + this.image + "')";
+        }
       }
     });