games made with phaserphaser.io/images/newsletter/pdf/issue66.pdf · kick the rat fend off the rats...
TRANSCRIPT
Welcome to Issue 66 of Phaser World
Happy Friday everyone! Some weeks are just better than others when it comesto new releases, and this week is absolutely no exception. There are somequality games, excellent tutorials (the top-down shooter one is especially good),some great new plugins, and a massive Phaser 3 Development update, withplenty of links and demos for you to run. It's been a good week indeed :)
Until the next issue, keep on coding. Drop me a line if you've got any news you'dlike featured (you can just reply to this email) or grab me on the Phaser Slack orDiscord channels.
Games made with Phaser
Bowling Masters
Game of the Week See how many strikes you can get in this fun 3Dbowling game, with bomb pins, stars, bubbles and
other challenges to complete.
My Swashbuckle Adventure
Staff Pick Create your very own Swashbuckler, explore yourisland and play fun mini-games to win jewels and
make one of the naughty pirates walk the plank.
Wildwood Run
See how far you can run and leap across the woods,while avoiding the hedgehogs, wasps and all thingsspiky.
Kick the Rat
Fend off the rats using your mad kung-fu skills! Attackleft and right, and power-up the special move.
Bird Zap
Zap the birds as they fly across the screen, avoidingthe big eagles and chaining lots together formaximum points!
Phaser News & TutorialsTopdown Layers Tutorial
In this tutorial you'll learn how to create a 2.5D top-down game, with multiple layers, moving and collisiondetection.
Phaser Scrollable Component
This new component allows you to simulate verticaland horizontal scrolling to a Phaser.Group, with lots ofconfiguration options to set.
Phaser Manifest Loader
The Phaser Manifest Loader lets you easily loadassets that have been compressed and fingerprintedby webpack.
String Avoider Update Part 2
In the second of the tutorial series, the String Avoidergame is optimized for mobile devices.
String Avoider Update Part 3
In part 3 of the String Avoider series, the scissorspower-up is added to the game.
Patreon Updates
Thank you and welcome to the following awesome people who joined the PhaserPatron this week: Jack Parnell, Nagesh Pobbathi and Niklas.
Patreon is a way to donate money towards the Phaser project on a monthlybasis. This money is used entirely to fund development costs. You can alsomake one-off donations via PayPal. Donations receive discounts, forum badges,private technical support, and the eternal gratitude of the Phaser team :)
Development Progress
Ok, so last weeks Development Progress entry was a little depressing. We hadworked like titans, and had little to show for it. I likened it to the ascent of MountDoom in Lord of the Rings. Using the same analogy, this week has been thecomplete reverse. It honestly feels like we've shot up Mount Doom, can see aBeta 1 shaped peak in sight, and even smacked a few Orcs around for goodmeasure.
It has been a good week indeed.
At the end of last week we knew we needed to revisit the very core of Phaser, themain game loop, and how transforms were applied to Game Objects. And westarted the week by doing just that. It was painful, meticulous work. We wouldliterally make one small change, then re-profile it, checking FPS counts anddeopts as we went.
We tried all kinds of things, and in the end two factors won out above all: avoidbranching, and avoid conditionals. Branching is the process of leaving onefunction, to visit another (even if for a short while). Conditionals are your everyday 'if' statements and the like. For example it became clear that in our transformclass we had a check in place to see if rotation was equal to zero or not. If it isyou can avoid a Math.cos and Math.sin calculation on the transform matrix. Sowe figured it made sense to do that. Except after profiling, a lot, it transpired thatmaking the check was most costly than doing the math in the first place. We
removed it, we gained a few FPS. And thus the process carried on and on likethis, for several days. In the end we got to a place where we had a brand newgame loop implemented, a new way of handling transforms, and both the blitterand sprite renderers updated to use them.
Phaser 3 has support for a variety of different batches within the renderer. Forexample we've a dedicated Blitter Batch. A Blitter game object is basically aninsanely fast way of transferring textures, or bits of them (think atlas frames) tothe GPU at super fast rates. There's no blend modes, special effects or evenalpha support, it's just a pure, raw texture transfer. But that doesn't mean youcan't do a lot with it. It's also a great starting point, or template batch, for anyonewanting to extend Phaser 3 with their own batch types.
Phaser 3 Blitter DemoI put together a small test, which we've been using as part of the performanceprofiling process, and I'm happy to share it with you.
First of all: if you want to see the FPS rate you'll have to enable it in Chrome DevTools. We'll build support for displaying it into v3, but right now use the dev tools.
Click here for the Blitter Test.
Click to add more fruit and veg to the demo. We've tweaked it a little today, so itnow uses a more controlled batch size, but in tests we're seeing well over200,000 objects being rendered at a smooth 60 fps.
It will vary dramatically based on your GPU and device of course. For exampleon my desktop PC with an NVIDIA GeForce 680 I can happily push 400,000objects and still keep it around 30fps. 500,000 runs at 20fps and 600,000 at 10fps.I didn't go any higher, because 10fps isn't really a playable game. Even so, that'shalf a freaking million objects rendering at 20fps!
Someone on the Slack channel asked about tweening, so I combined a variationof the above test along with TweenMax and created Tween Test 1. Again, I canhappily render 50,000 objects which are all being tweened, before it no longermaintains a steady 60fps. Of course TweenMax is doing the heavy lifting for thetweens, but it still helps massively to have a renderer that can eat 50k objects forbreakfast.
Phaser 3 Transform DemoThe Blitter tests are all good and well, but blitter objects are very limited, and weneeded to test Sprites too. The difference of course is that every Sprite has itsown unique transform, so it can scale, rotate and translate, both on its own, andunder the influence of parent transformations.
Felipe put together a demo showing the new transform system in action,combining sprites with a little inverse kinematic fun.
Click here for the IK Transform demo.
We also stress tested the Sprite Renderer. Numbers of course will not be as highas with the Blitter test, because each individual sprite can, and is doing, so muchmore. But they're still incredibly good. There is a small demo here - open devtools and click, when you release it'll console.log the number of sprites currentlybeing rendered.
We'll publish more demos for you next week to play with. However by way ofcomparison: Phaser v2 can only handle 10,000 sprites before it can't reach 60fpsany more (again, on my GPU), whereas v3 can handle 80,000 at a rock solid60fps (it can go higher, but the frame rate dips). That's a huge increase!
So when I say it's been a good week, I really mean it :) It finally feels like we'restanding on a rock solid base. All the elements are there, the game loop is tight,and from this point out it's about putting back in features from v2, and testing, andperformance checking as we go.
A number of you have been asking how you can help with v3 - and the simpleanswer is keep on reading! Join the mailing list or slack if you like (devs on theretend to get to see this stuff first), but please look out for Beta 1. As soon as itdrops you're welcome to rip it to pieces, create whatever the heck you can with it,and drop your feedback on us.
I'm very much looking forward to see what next week will bring us :)
Phaser 3 Mailing List and Developers GuideIf you're interested in helping evolve the shape of Phaser 3, then please join thePhaser 3 Google Group. Discussions this week have included varying renderloops. The group is for anyone who wishes to help shape what the Phaser 3 APIand feature-set will contain.
The Phaser 3 Developers Guide is available. Essential reading for anyone who'dlike to help build Phaser 3.
Geek Links
The Sea of Thieves is a new pirate ship game currently in development, and ohwow - does it look gorgeous! In this video you can see a few teams go up againsteach other, but if you only take away one thing from it, it has to be the incrediblewave effects on the ocean. Stunning stuff!
This is a really interesting article about disc-rot, the process when CD and DVDsstart to naturally break down. It's also slightly worrying for retro game collectorslike me!
It's not often you'll find me linking to Unity from this newsletter :) but just beforeChristmas they released these beautiful sprite sheets full of explosions andsmoke effects. They're royalty free, and truly lovely! You can convert the TGAsequences into PNGs easily.
Phaser ReleasesThe current version of Phaser CE is 2.7.3 released on January 9th 2017.
Phaser 3.0.0 is in active development in the GitHub v3 folder.
Please help support Phaser development
Have some news you'd like published? Email [email protected] or tweet us.
Missed an issue? Check out the Back Issues page.
©2017 Photon Storm Ltd | Unit 4 Old Fleece Chambers, Lydney, GL15 5RA, UK
Web Version Preferences Forward Unsubscribe