recycle Stage layers

optimizes backgrounds and pen trails frame rate

HISTORY.md

@@ -4,11 +4,13 @@
 * **New Features:**
 * **Notable Changes:**
 * **Notable Fixes:**
+    * optimized backgrounds and pen trails frame rate
 * **Translation Updates:**
 
 ### 2019-10-28
 * new dev version
 * morphic: enable recycling and deep copying canvas elements
+* objects, maps: recycle Stage layers - optimizes backgrounds and pen trails frame rate
 
 ## v5.2.3:
 * **Notable Changes:*

snap.html

@@ -8,7 +8,7 @@
         <script type="text/javascript" src="src/widgets.js?version=2019-10-16"></script>
         <script type="text/javascript" src="src/blocks.js?version=2019-10-25"></script>
         <script type="text/javascript" src="src/threads.js?version=2019-10-25"></script>
-        <script type="text/javascript" src="src/objects.js?version=2019-10-25"></script>
+        <script type="text/javascript" src="src/objects.js?version=2019-10-28"></script>
         <script type="text/javascript" src="src/gui.js?version=2019-10-28"></script>
         <script type="text/javascript" src="src/paint.js?version=2019-06-27"></script>
         <script type="text/javascript" src="src/lists.js?version=2019-10-23"></script>
@@ -17,7 +17,7 @@
         <script type="text/javascript" src="src/symbols.js?version=2019-06-27"></script>
         <script type="text/javascript" src="src/sketch.js?version=2019-10-09"></script>
         <script type="text/javascript" src="src/video.js?version=2019-06-27"></script>
-        <script type="text/javascript" src="src/maps.js?version=2019-06-27"></script>
+        <script type="text/javascript" src="src/maps.js?version=2019-10-28"></script>
         <script type="text/javascript" src="src/xml.js?version=2019-06-27"></script>
         <script type="text/javascript" src="src/store.js?version=2019-08-08"></script>
         <script type="text/javascript" src="src/locale.js?version=2019-10-25"></script>

src/maps.js

@@ -38,7 +38,7 @@
 
 // Global stuff ////////////////////////////////////////////////////////
 
-modules.maps = '2019-June-06';
+modules.maps = '2019-October-28';
 
 // WorldMap /////////////////////////////////////////////////////////////
 
@@ -287,7 +287,7 @@ WorldMap.prototype.render = function () {
         }
     }
 
-    this.canvas = newCanvas(this.extent, true);
+    this.canvas = newCanvas(this.extent, true, this.canvas);
     ctx = this.canvas.getContext('2d');
     for (x = 0; x < tileGrid.x; x += 1) {
         for (y = 0; y < tileGrid.y; y += 1) {

src/objects.js

@@ -84,7 +84,7 @@ BlockEditorMorph, BlockDialogMorph, PrototypeHatBlockMorph,  BooleanSlotMorph,
 localize, TableMorph, TableFrameMorph, normalizeCanvas, VectorPaintEditorMorph,
 HandleMorph, AlignmentMorph, Process, XML_Element, WorldMap*/
 
-modules.objects = '2019-October-25';
+modules.objects = '2019-October-28';
 
 var SpriteMorph;
 var StageMorph;
@@ -7447,10 +7447,12 @@ StageMorph.prototype.setScale = function (number) {
 // StageMorph rendering
 
 StageMorph.prototype.drawNew = function () {
-    var ctx;
-    StageMorph.uber.drawNew.call(this);
+    this.image = newCanvas(this.extent(), true, this.image);
+    var ctx = this.image.getContext('2d');
+    ctx.save();
+    ctx.fillStyle = this.color.toString();
+    ctx.fillRect(0, 0, this.width(), this.height());
     if (this.costume) {
-        ctx = this.image.getContext('2d');
         ctx.scale(this.scale, this.scale);
         ctx.drawImage(
             this.costume.contents,
@@ -7459,6 +7461,7 @@ StageMorph.prototype.drawNew = function () {
         );
         this.image = this.applyGraphicsEffects(this.image);
     }
+    ctx.restore();
     this.version = Date.now(); // for observer optimization
 };
 
@@ -7555,7 +7558,7 @@ StageMorph.prototype.drawOn = function (aCanvas, aRect) {
 
 StageMorph.prototype.clearPenTrails = function () {
     this.cachedPenTrailsMorph = null;
-    this.trailsCanvas = newCanvas(this.dimensions);
+    this.trailsCanvas = newCanvas(this.dimensions, null, this.trailsCanvas);
     this.changed();
 };