display/render texture starfield

 
// var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update });
var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update });

function preload() {

    game.load.image('star', 'assets/sprites/bullet.png');

}

var star;
var texture1;
var texture2;
var texture3;
var stars = [];

function create() {

    //  This is the sprite that will be drawn to the texture
    //  Note that we 'make' it, not 'add' it, as we don't want it on the display list
    star = game.make.sprite(0, 0, 'star');

    //  For this effect we'll create a vertical scrolling starfield with 300 stars split across 3 layers.
    //  This will use only 3 textures / sprites in total.
    texture1 = game.add.renderTexture(800, 600, 'texture1');
    texture2 = game.add.renderTexture(800, 600, 'texture2');
    texture3 = game.add.renderTexture(800, 600, 'texture3');
    
    game.add.sprite(0, 0, texture1);
    game.add.sprite(0, 0, texture2);
    game.add.sprite(0, 0, texture3);

    var t = texture1;
    var s = 4;

    //  100 sprites per layer
    for (var i = 0; i < 300; i++)
    {
        if (i == 100)
        {
            //  With each 100 stars we ramp up the speed a little and swap to the next texture
            s = 6;
            t = texture2;
        }
        else if (i == 200)
        {
            s = 7;
            t = texture3;
        }

        stars.push( { x: game.world.randomX, y: game.world.randomY, speed: s, texture: t });
    }

}

function update() {

    for (var i = 0; i < 300; i++)
    {
        //  Update the stars y position based on its speed
        stars[i].y += stars[i].speed;

        if (stars[i].y > 600)
        {
            //  Off the bottom of the screen? Then wrap around to the top
            stars[i].x = game.world.randomX;
            stars[i].y = -32;
        }

        if (i == 0 || i == 100 || i == 200)
        {
            //  If it's the first star of the layer then we clear the texture
            stars[i].texture.renderXY(star, stars[i].x, stars[i].y, true);
        }
        else
        {
            //  Otherwise just draw the star sprite where we need it
            stars[i].texture.renderXY(star, stars[i].x, stars[i].y, false);
        }
    }

}