Sprite optimisations.

Author: photonstorm

README.md

@@ -83,12 +83,14 @@ Version 1.0.7 (in progress in the dev branch)
 * Change: We've removed the scrollFactor property from all Game Objects. Sorry, but the new Camera system doesn't work with it and it caused all kinds of issues anyway. We will sort out a replacement for it at a later date.
 * Change: World now extends Phaser.Group. As a result we've updated GameObjectFactory and other classes that linked to it. If you have anywhere in your code that used to reference world.group you can just remove 'group' from that. So before, world.group.add() is now just world.add().
 * Change: The Camera has been completely revamped. Rather than adjusting the position of all display objects (bad) it now just shifts the position of the single world container (good!), this is much quicker and also stops the game objects positions from self-adjusting all the time, allowing for them to be properly nested with other containers.
-* New: Direction constants have been added to Sprites and adjust based on body motion. Access them via 
+* New: Direction constants have been added to Sprites and adjust based on body motion.
 * World.randomX/Y now returns values anywhere in the world.bounds range (if set, otherwise 0), including negative values.
+* Fixed a bug in the Sprite transform cache check that caused the skew/scale cache to get constantly invalidated - now only updates as needed, significant performance increase!
+* Brand new Sprite.update loop handler. Combined with the transform cache fix and further optimisations this is now much quicker to execute.
+* Made Sprite.body optional and added in checks, so you can safely null the Sprite body object if using your own physics system and not impact rendering.
 
 
 * TODO: addMarker hh:mm:ss:ms
-* TODO: Direction constants
 
 Version 1.0.6 (September 24th 2013)
 

examples/world/move around world.php

@@ -15,7 +15,7 @@ function preload() {
 
         game.stage.backgroundColor = '#007236';
 
-        game.load.image('mushroom', 'assets/sprites/mushroom.png');
+        game.load.image('mushroom', 'assets/sprites/mushroom2.png');
         game.load.image('phaser', 'assets/sprites/sonic_havok_sanity.png');
 
     }
@@ -30,7 +30,7 @@ function create() {
 
         for (var i = 0; i < 100; i++)
         {
-            // var s = game.add.sprite(game.world.randomX, game.world.randomY, 'mushroom');
+            var s = game.add.sprite(game.world.randomX, game.world.randomY, 'mushroom');
             // console.log(s.x, s.y);
         }
 
@@ -43,7 +43,7 @@ function create() {
 
     function update() {
 
-                // d.angle++;
+        d.angle += 1;
 
         if (cursors.up.isDown)
         {
@@ -96,6 +96,7 @@ function update() {
     function render() {
 
         game.debug.renderCameraInfo(game.camera, 32, 32);
+        game.debug.renderSpriteInfo(d, 32, 200);
         // game.debug.renderWorldTransformInfo(d, 32, 200);
         // game.debug.renderLocalTransformInfo(d, 32, 400);
         game.debug.renderSpriteCorners(d, false, true);

src/gameobjects/Sprite.js

@@ -198,9 +198,6 @@ Phaser.Sprite = function (game, x, y, key, frame) {
         //  Input specific transform cache
         i01: -1, i10: -1, idi: -1,
 
-        //  World transform cache
-        w01: -1, w10: -1,
-
         //  Bounds check
         left: null, right: null, top: null, bottom: null, 
 
@@ -338,15 +335,11 @@ Phaser.Sprite.prototype.preUpdate = function() {
     this.prevX = this.x;
     this.prevY = this.y;
 
-    if (this.worldTransform[2] != this._cache.a02 || this.worldTransform[5] != this._cache.a12 || this.worldTransform[0] != this._cache.a00 || this.worldTransform[1] != this._cache.a01 || this.worldTransform[3] != this._cache.a10 || this.worldTransform[4] != this._cache.a11)
-    {
-        this.updateCache();
-    }
+    this.updateCache();
 
     //  Re-run the camera visibility check
-    if (this._cache.dirty || this._cache.first)
+    if (this._cache.dirty)
     {
-        this._cache.first = false;
         this._cache.cameraVisible = Phaser.Rectangle.intersects(this.game.world.camera.screenView, this.bounds, 0);
 
         if (this.autoCull == true)
@@ -356,7 +349,10 @@ Phaser.Sprite.prototype.preUpdate = function() {
         }
 
         //  Update our physics bounds
-        this.body.updateBounds(this.center.x, this.center.y, this._cache.scaleX, this._cache.scaleY);
+        if (this.body)
+        {
+            this.body.updateBounds(this.center.x, this.center.y, this._cache.scaleX, this._cache.scaleY);
+        }
     }
 
     if (this.body)
@@ -372,38 +368,30 @@ Phaser.Sprite.prototype.updateCache = function() {
     //  |b d ty|
     //  |0 0  1|
 
-    //  Only update the values we need
-    // if (this.worldTransform[0] != this._cache.a00 || this.worldTransform[1] != this._cache.w01 || this.worldTransform[3] != this._cache.w10 || this.worldTransform[4] != this._cache.a11)
-    if (this.worldTransform[1] != this._cache.w01 || this.worldTransform[3] != this._cache.w10)
+    if (this.worldTransform[1] != this._cache.i01 || this.worldTransform[3] != this._cache.i10)
     {
-        //  Non-modified
-        this._cache.w01 = this.worldTransform[1];  //  skewY          c
-        this._cache.w10 = this.worldTransform[3];  //  skewX          b
-
         this._cache.a00 = this.worldTransform[0];  //  scaleX         a
         this._cache.a01 = this.worldTransform[1];  //  skewY          c
-        this._cache.i01 = this.worldTransform[1];  //  skewY          c
         this._cache.a10 = this.worldTransform[3];  //  skewX          b
-        this._cache.i10 = this.worldTransform[3];  //  skewX          b
         this._cache.a11 = this.worldTransform[4];  //  scaleY         d
 
+        this._cache.i01 = this.worldTransform[1];  //  skewY          c (remains non-modified for input checks)
+        this._cache.i10 = this.worldTransform[3];  //  skewX          b (remains non-modified for input checks)
+
         this._cache.scaleX = Math.sqrt((this._cache.a00 * this._cache.a00) + (this._cache.a01 * this._cache.a01)); // round this off a bit?
         this._cache.scaleY = Math.sqrt((this._cache.a10 * this._cache.a10) + (this._cache.a11 * this._cache.a11)); // round this off a bit?
 
         this._cache.a01 *= -1;
         this._cache.a10 *= -1;
 
         this._cache.dirty = true;
-        console.log('cache1');
-
     }
 
     if (this.worldTransform[2] != this._cache.a02 || this.worldTransform[5] != this._cache.a12)
     {
         this._cache.a02 = this.worldTransform[2];  //  translateX     tx
         this._cache.a12 = this.worldTransform[5];  //  translateY     ty
         this._cache.dirty = true;
-        console.log('cache2');
     }
 
     //  Frame updated?

src/math/Math.js

@@ -522,16 +522,21 @@ Phaser.Math = {
     wrap: function (value, min, max) {
 
         var range = max - min;
+
         if (range <= 0)
         {
             return 0;
         }
+
         var result = (value - min) % range;
+
         if (result < 0)
         {
             result += range;
         }
+        
         return result + min;
+
     },
 
     /**

src/utils/Debug.js

@@ -454,9 +454,9 @@ Phaser.Utils.Debug.prototype = {
         this.start(x, y, color);
 
         this.line('Sprite: ' + ' (' + sprite.width + ' x ' + sprite.height + ') anchor: ' + sprite.anchor.x + ' x ' + sprite.anchor.y);
-        this.line('x: ' + sprite.x.toFixed(1) + ' y: ' + sprite.y.toFixed(1) + ' rotation: ' + sprite.rotation.toFixed(1));
-        this.line('visible: ' + sprite.visible);
-        this.line('in camera: ' + sprite.inCamera);
+        this.line('x: ' + sprite.x.toFixed(1) + ' y: ' + sprite.y.toFixed(1));
+        this.line('angle: ' + sprite.angle + ' rotation: ' + sprite.rotation.toFixed(1));
+        this.line('visible: ' + sprite.visible + ' in camera: ' + sprite.inCamera);
         this.line('body x: ' + sprite.body.x.toFixed(1) + ' y: ' + sprite.body.y.toFixed(1));
 
         //  0 = scaleX
@@ -466,18 +466,17 @@ Phaser.Utils.Debug.prototype = {
         //  4 = scaleY
         //  5 = translateY
 
-
         // this.line('id: ' + sprite._id);
         // this.line('scale x: ' + sprite.worldTransform[0]);
         // this.line('scale y: ' + sprite.worldTransform[4]);
         // this.line('tx: ' + sprite.worldTransform[2]);
         // this.line('ty: ' + sprite.worldTransform[5]);
         // this.line('skew x: ' + sprite.worldTransform[3]);
         // this.line('skew y: ' + sprite.worldTransform[1]);
-        this.line('dx: ' + sprite.body.deltaX());
-        this.line('dy: ' + sprite.body.deltaY());
-        this.line('sdx: ' + sprite.deltaX());
-        this.line('sdy: ' + sprite.deltaY());
+        // this.line('dx: ' + sprite.body.deltaX());
+        // this.line('dy: ' + sprite.body.deltaY());
+        // this.line('sdx: ' + sprite.deltaX());
+        // this.line('sdy: ' + sprite.deltaY());
 
         // this.line('inCamera: ' + this.game.renderer.spriteRenderer.inCamera(this.game.camera, sprite));