diff --git a/debug/tests/add_remove_layers.html b/debug/tests/add_remove_layers.html
index f89e5f9e..b6a10e49 100644
--- a/debug/tests/add_remove_layers.html
+++ b/debug/tests/add_remove_layers.html
@@ -8,73 +8,8 @@
     <link rel="stylesheet" href="../../dist/leaflet.css" />
 
     <link rel="stylesheet" href="../css/screen.css" />
-    <script type='text/javascript' src='http://code.jquery.com/jquery-1.8.0.js'></script>
-
-    <script>
-        L_PREFER_CANVAS = true;
-        $(document).ready(function() {
-            var map;
-            var myLayerGroup = new L.LayerGroup();
-
-            initmap();
-
-
-            function initmap() {
-
-                // set up the map
-                map = new L.Map('map');
-
-                // create the tile layer with correct attribution
-                var osmUrl = 'http://a.tile.openstreetmap.org/{z}/{x}/{y}.png';
-                var osmAttrib = 'Map data © OpenStreetMap contributors';
-                var osm = new L.TileLayer(osmUrl, { minZoom: 1, maxZoom: 17, attribution: osmAttrib, detectRetina: true });
-                map.addLayer(osm);
-                map.fitBounds(new L.LatLngBounds([51,7],[51,7]));
-                drawTestLine();
-
-
-            };
-
-            function drawTestLine() {
-                var lat = 51;
-                var long = 7;
-                for (var i = 0; i < 50; i++) {
-
-                    var myCircle = new L.Circle(new L.LatLng(lat, long),3);
-                    myCircle.on('click',
-                        function (e) {
-                            popup = new L.Popup();
-                            popup.setLatLng(this.getLatLng());
-
-                            var popuptxt = "Hello!";
-                            alert("I am the click function");
-                                    popup.setContent(popuptxt);
-
-                                    map.openPopup(popup);
-
-
-                        });
-                    myLayerGroup.addLayer(myCircle);
-                        lat = lat + 0.0001;
-                        long = long + 0.0001;
-
-                }
-
-            map.addLayer(myLayerGroup);
-
-            };
-
-            $("#b1").click(function() {
-              map.addLayer(myLayerGroup);
-            });
-
-            $("#b2").click(function() {
-              map.removeLayer(myLayerGroup);
-            });
-
-        });
-    </script>
 
+    <script type="text/javascript" src="../../build/deps.js"></script>
     <script src="../leaflet-include.js"></script>
 </head>
 <body>
@@ -83,5 +18,54 @@
         <button type="button" id="b1"> Add Layer</button>
         <button type="button" id="b2"> Remove Layer</button>
     </div>
+    <script>
+        var map;
+        var myLayerGroup = new L.LayerGroup();
+
+        // set up the map
+        map = new L.Map('map', {preferCanvas: true});
+
+        // create the tile layer with correct attribution
+        var osmUrl = 'http://a.tile.openstreetmap.org/{z}/{x}/{y}.png';
+        var osmAttrib = 'Map data © OpenStreetMap contributors';
+        var osm = new L.TileLayer(osmUrl, { minZoom: 1, maxZoom: 17, attribution: osmAttrib, detectRetina: true });
+        map.addLayer(osm);
+        map.fitBounds(new L.LatLngBounds([51,7],[51,7]));
+        drawTestLine();
+
+        function drawTestLine() {
+            var lat = 51;
+            var long = 7;
+            for (var i = 0; i < 50; i++) {
+
+                var myCircle = new L.Circle(new L.LatLng(lat, long),3);
+                myCircle.on('click',
+                    function (e) {
+                        popup = new L.Popup();
+                        popup.setLatLng(this.getLatLng());
+
+                        var popuptxt = "Hello!";
+                        alert("I am the click function");
+                                popup.setContent(popuptxt);
+
+                                map.openPopup(popup);
+
+
+                    });
+                myLayerGroup.addLayer(myCircle);
+                    lat = lat + 0.0001;
+                    long = long + 0.0001;
+
+            }
+            map.addLayer(myLayerGroup);
+        };
+
+        L.DomEvent.on(L.DomUtil.get('b1'), 'click', function () {
+          map.addLayer(myLayerGroup);
+        });
+        L.DomEvent.on(L.DomUtil.get('b2'), 'click', function () {
+          map.removeLayer(myLayerGroup);
+        });
+    </script>
 </body>
 </html>
diff --git a/debug/tests/canvasloop.html b/debug/tests/canvasloop.html
index d8a2ed41..6e64c908 100644
--- a/debug/tests/canvasloop.html
+++ b/debug/tests/canvasloop.html
@@ -1,9 +1,6 @@
 <html>
     <head>
     <link rel="stylesheet" href="../../dist/leaflet.css" />
-    <script>
-        L_PREFER_CANVAS = true;
-    </script>
     <link rel="stylesheet" href="../css/screen.css" />
 
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
@@ -20,7 +17,8 @@
             //Init a map, and attempt a locate.
             var map = L.map('map', {
                 center: [39.84, -96.591],
-                zoom: 4
+                zoom: 4,
+                preferCanvas: true
             }).locate();
 
             L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
diff --git a/debug/tests/click_on_canvas.html b/debug/tests/click_on_canvas.html
index ac9b21f4..6b20a623 100644
--- a/debug/tests/click_on_canvas.html
+++ b/debug/tests/click_on_canvas.html
@@ -11,7 +11,6 @@
     <script type='text/javascript' src='http://code.jquery.com/jquery-1.8.0.js'></script>
 
     <script>
-        L_PREFER_CANVAS = true;
         $(document).ready(function() {
             var osmUrl = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
                 osmAttrib = '&copy; <a href="http://openstreetmap.org/copyright">OpenStreetMap</a> contributors',
@@ -22,7 +21,8 @@
                 maxZoom: 19,
                 center: [51.505, -0.09],
                 zoom: 9,
-                layers: [osm]
+                layers: [osm],
+                preferCanvas: true
             });
 
             var polygons = new L.FeatureGroup();
diff --git a/debug/tests/click_on_canvas_broken.html b/debug/tests/click_on_canvas_broken.html
deleted file mode 100644
index dbce2bed..00000000
--- a/debug/tests/click_on_canvas_broken.html
+++ /dev/null
@@ -1,49 +0,0 @@
-<!DOCTYPE html>
-<html>
-<head>
-    <title>Leaflet debug page</title>
-
-    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
-
-    <link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.4.5/leaflet.css" />
-    <link rel="stylesheet" href="../css/screen.css" />
-    <script type='text/javascript' src='http://code.jquery.com/jquery-1.8.0.js'></script>
-
-    <script>
-        L_PREFER_CANVAS = true;
-        $(document).ready(function() {
-            var map = L.map('map', {
-                minZoom: 1,
-                maxZoom: 19,
-                center: [51.505, -0.09],
-                zoom: 9
-            });
-
-            var polygons = new L.FeatureGroup();
-            var points = [[51.505, -0.01], [51.505, -0.09], [51.55, -0.09]];
-
-            polygons.addLayer(
-            new L.Polyline(
-            points, {
-                weight: 2,
-                opacity: 1,
-                smoothFactor: 1,
-                color: 'red'
-            }));
-
-            polygons.on('click', function(m) {
-                // m.layer is the clicked polygon here
-                //m.layer.bindPopup('hello!').openPopup();
-                console.log(m.layer)
-            });
-
-            polygons.addTo(map);
-        });
-    </script>
-
-    <script src="http://cdn.leafletjs.com/leaflet-0.4.5/leaflet.js"></script>
-</head>
-<body>
-    <div id="map"></div>
-</body>
-</html>
diff --git a/debug/vector/vector-canvas.html b/debug/vector/vector-canvas.html
index 430ed130..c1749115 100644
--- a/debug/vector/vector-canvas.html
+++ b/debug/vector/vector-canvas.html
@@ -7,9 +7,6 @@
 
 	<link rel="stylesheet" href="../css/screen.css" />
 
-	<script>
-		L_PREFER_CANVAS = true; // experimental
-	</script>
 	<script type="text/javascript" src="../../build/deps.js"></script>
 	<script src="../leaflet-include.js"></script>
 </head>
@@ -32,7 +29,7 @@
 		var canvas = L.canvas();
 		var path = new L.Polyline(latlngs, {renderer: canvas});
 
-		var map = new L.Map('map', {layers: [osm]});
+		var map = new L.Map('map', {layers: [osm], preferCanvas: true});
 
 		var group = new L.LayerGroup();
 
diff --git a/src/layer/vector/Renderer.js b/src/layer/vector/Renderer.js
index dfb8f624..1c0ac5cd 100644
--- a/src/layer/vector/Renderer.js
+++ b/src/layer/vector/Renderer.js
@@ -86,7 +86,7 @@ L.Map.include({
 		var renderer = layer.options.renderer || this._getPaneRenderer(layer.options.pane) || this.options.renderer || this._renderer;
 
 		if (!renderer) {
-			renderer = this._renderer = window.L_PREFER_CANVAS ? L.canvas() : L.svg();
+			renderer = this._renderer = (this.options.preferCanvas && L.canvas()) || L.svg();
 		}
 
 		if (!this.hasLayer(renderer)) {
