At the start of this week I spent some time finally putting Phaser CE on to the main Phaser web site. For too long it had been absent from the downloads section, but I fixed all that, and now CE releases are as prominently featured as v2 ones were. I've also merged all the latest CE pull requests in, and will prepare a 2.7.4 release early next week. I meant to do it this week, but ran out of time, so if you've got anything you'd like included, get your PRs in!

Phaser 3 BitmapText

It may feel a bit strange to harp on about something as 'basic' as Bitmap Text, after all I've talked about it before, and you're probably wondering why on earth it's worth mentioning again. I think the reason is because it's a great example of how v2 has transitioned to v3, and it has also consumed a lot of my time this week too :)

For a while now I've wanted you to be able to create more interesting text effects easily. In v2 each character of a Bitmap Text is actually its own Sprite object, which introduces a massive amount of un-necessary overhead. In v3 we use a brand new rendering system that avoids this, but more importantly it allows us to offer you more flexibility. For example there is a new method called 'setDisplayCallback'. It lets you define a callback that is invoked when every character in the Bitmap Text is rendered. The callback is an object containing details of the character, such as the index and charCode, and position, rotation and scale values. You can modify the object in your callback and then return it. So if you adjust the x/y coordinates for example, it'll render that character at the new position.

This opens up a whole raft of new possibilities. For example take a look at this Wibble Text Labs Example. Pretty neat huh? and extremely simple to do. You can also do things selectively based on the text index, so if you take the previous wibble effect, but only run it on a few characters, you get this Selective Wibble Effect instead,

Smaller is better

The v3 API surface is significantly smaller than v2. We've got rid of a lot of cruft, moved loads of old methods into helper utility functions, rather than hanging them off the Game Object, and we've been carefully evaluating what should be kept.

To me the changes to Bitmap Text are a perfect example of how you can now do an awful lot more, but with a lot less code (both internally in Phaser, and in your code too). The aim is to make sure that the features we include and expose are game related. I.e. they'll help you make better games.

Graphics Ahoy!

The (badly looped) animated gif above is a demonstration of the new Graphics renderer that Felipe has been busy integrating into v3 this week. He had done a lot of work on it previously, but this week was all about getting that code into v3 for real. It has been a challenge, but he's made massive progress and the results speak for themselves.

The example shown above can be found here. That's a lot more Graphics shapes than Phaser 2 is capable of, believe me!

He also created this Graphics stress test, so if you fancy seeing how it runs click the following image:

Now I appreciate you're not likely to ever need that many Graphics stars in a single game scene. Yet that isn't the point of this test - the point was to push the new Graphics rendering as hard as we could, to ensure that it won't become a major bottleneck in your games. I'm honestly fed-up of telling people they should really avoid using Graphics in Phaser 2 because it hammers performance, our new system at least ensures that isn't the case. Use them, and use them as much as you like!

Felipe has some more work to finish off ensuring the Graphics renderer works with the new Camera system, but everything you can see so far is all available in the current build in our repo. All of the examples are in the Phaser 3 Examples repo, and all the source in the main Phaser repo. We are building all of this live, public, and in the open.

Phaser 3 Mailing List and Developers Guide

If you're interested in helping evolve the shape of Phaser 3, then please join the Phaser 3 Google Group. Discussions this week have included varying render loops. The group is for anyone who wishes to help shape what the Phaser 3 API and feature-set will contain.

The Phaser 3 Developers Guide is available. Essential reading for anyone who'd like to help build Phaser 3.