Reduce memory and CPU resources on offline interstitial while idle.

components/neterror/resources/offline.js

Index: components/neterror/resources/offline.js
diff --git a/components/neterror/resources/offline.js b/components/neterror/resources/offline.js
index 32ecc66372a30ca8c700f2c523d6623b2a254ddb..88bc5d314008a5aa05f3a12e720fdba1cc2fc02d 100644
--- a/components/neterror/resources/offline.js
+++ b/components/neterror/resources/offline.js
@@ -114,6 +114,7 @@ Runner.config = {
   INITIAL_JUMP_VELOCITY: 12,
   INVERT_FADE_DURATION: 12000,
   INVERT_DISTANCE: 700,
+  MAX_BLINK_COUNT: 3,
   MAX_CLOUDS: 6,
   MAX_OBSTACLE_LENGTH: 3,
   MAX_OBSTACLE_DUPLICATION: 2,
@@ -587,7 +588,8 @@ Runner.prototype = {
       }
     }
 
-    if (!this.crashed) {
+    if (this.activated || (!this.activated &&
+        this.tRex.blinkCount < Runner.config.MAX_BLINK_COUNT)) {
       this.tRex.update(deltaTime);
       this.raq();

[mmenke, 2016/08/15 19:23:32]

Would you mind renaming this method?  "raq" does not say to me "If this method
is called, continues animating".  Maybe scheduleNextUpdate?

[mmenke, 2016/08/15 19:52:27]

Or if you rename update to draw, scheduleNextDraw

[edwardjung, 2016/08/16 21:06:19]

Updated. It's shorthand for requestAnimationFrame Animation Queue but guess that
pretty obscure for most people not using requestAnimationFrame. 

     }
@@ -666,6 +668,7 @@ Runner.prototype = {
         if (!this.activated) {
           this.loadSounds();
           this.activated = true;
+          this.update();

[mmenke, 2016/08/15 19:23:32]

Think this is worth a comment.  Or could call this.raq instead.

[edwardjung, 2016/08/16 21:06:20]

Done.

           if (window.errorPageController) {
             errorPageController.trackEasterEgg();
           }

[mmenke, 2016/08/15 19:23:32]

Should we return early here, or is the game deliberately started with a jump
this first time only?  (i.e., not after "crashing"?)

[edwardjung, 2016/08/16 21:06:20]

This is deliberate, we start on a jump and sound effect. Added a comment. 

@@ -1488,6 +1491,7 @@ function Trex(canvas, spritePos) {
   this.currentFrame = 0;
   this.currentAnimFrames = [];
   this.blinkDelay = 0;
+  this.blinkCount = 0;
   this.animStartTime = 0;
   this.timer = 0;
   this.msPerFrame = 1000 / FPS;
@@ -1600,7 +1604,6 @@ Trex.prototype = {
    * Sets the t-rex to blink at random intervals.
    */
   init: function() {
-    this.blinkDelay = this.setBlinkDelay();
     this.groundYPos = Runner.defaultDimensions.HEIGHT - this.config.HEIGHT -

[mmenke, 2016/08/15 19:23:32]

So does the first blink happen instantly now?

[edwardjung, 2016/08/16 21:06:19]

No, this was a duplicate as the blink delay is already being set in the update
method when I set the state to waiting.

         Runner.config.BOTTOM_PAD;
     this.yPos = this.groundYPos;
@@ -1729,6 +1732,7 @@ Trex.prototype = {
         // Set new random delay to blink.
         this.setBlinkDelay();
         this.animStartTime = time;
+        this.blinkCount++;
       }
     }
   },