diff --git a/changelog/3.60/Animation.md b/changelog/3.60/Animation.md index 1590a739d1..23d021661e 100644 --- a/changelog/3.60/Animation.md +++ b/changelog/3.60/Animation.md @@ -24,4 +24,4 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). Return to the [Change Log index](CHANGELOG-v3.60.md). -📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser). +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/ArcadePhysics.md b/changelog/3.60/ArcadePhysics.md index 65834e2a02..ea5ec0098c 100644 --- a/changelog/3.60/ArcadePhysics.md +++ b/changelog/3.60/ArcadePhysics.md @@ -24,3 +24,5 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/BitmapTextGameObject.md b/changelog/3.60/BitmapTextGameObject.md index adac58d253..c0d5e2fafb 100644 --- a/changelog/3.60/BitmapTextGameObject.md +++ b/changelog/3.60/BitmapTextGameObject.md @@ -20,3 +20,5 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/Build.md b/changelog/3.60/Build.md index e76c3e7a9b..595d82feae 100644 --- a/changelog/3.60/Build.md +++ b/changelog/3.60/Build.md @@ -22,3 +22,5 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/CHANGELOG-v3.60.md b/changelog/3.60/CHANGELOG-v3.60.md index 795c836a91..069d2f0232 100644 --- a/changelog/3.60/CHANGELOG-v3.60.md +++ b/changelog/3.60/CHANGELOG-v3.60.md @@ -6,24 +6,24 @@ This should make it easier for you to browse the changes and find the informatio ## New Features -These are the headliner new features in this release: +These are the headliner features in this release: -* [Built-in Spector JS](Spector.md) for WebGL debugging on desktop and mobile -* New and improved [Video Game Object](VideoGameObject.md) -* New [Timeline Sequencer](Timeline.md) -* [ESM Module Support](ESMSupport.md) -* Built-in [Special FX](FX.md) including Bloom, Blur, Distort and more -* Support for [Spatial Audio](SpatialSound.md) -* New [Spine 4 Plugin](Spine4.md) +* 14 bundled [Special FX](FX.md) including Bloom, Blur, Distort and more +* Vastly improved [Mobile Rendering Performance](MobilePerformance.md) - our fastest release ever +* New [Timeline Sequencer](Timeline.md) for creating complex flows of events * New [Plane Game Object](PlaneGameObject.md) for perspective distortions * New [Nine Slice Game Object](NineSliceGameObject.md) for perfect UI scaling -* Support for [Compressed Textures](CompressedTextures.md) -* Brand new [Particle Emitter](ParticleEmitter.md) system with loads of new features +* [Built-in Spector JS](Spector.md) for WebGL debugging on desktop and mobile +* Brand new [Video Game Object](VideoGameObject.md) for videos and media streams +* Brand new [Particle Emitter](ParticleEmitter.md) with stacks of new features +* Support for [Spatial Audio](SpatialSound.md) and distance based volume +* New [Spine 4 Plugin](Spine4.md) * Upgraded to [Matter Physics v0.19](MatterPhysics.md) * New [Tween Manager](TweenManager.md) for better performance and memory management * New [Dynamic Textures](DynamicTextures.md) for rendering to textures at runtime -* Vastly improved [WebGL Renderer](WebGLRenderer.md) mobile performance and other updates and pipeline changes * New [TimeStep features and Timer Event Updates](Timestep.md) for enforcing fps rates and more +* Support for [Compressed Textures](CompressedTextures.md) +* [ESM Module Support](ESMSupport.md) ## System and Plugins @@ -34,6 +34,7 @@ Pick any of the following sections to see the breaking changes, new features, up * [Bitmap and Geometry Masks](Masks.md) * [Camera System](Camera.md) * [Canvas Renderer](CanvasRenderer.md) +* [WebGL Renderer](WebGLRenderer.md) * [Colors and Display](Colors.md) * [Game, Device and Game Config](Game.md) * [Geometry, Paths and Curves](Geometry.md) @@ -80,3 +81,5 @@ My thanks to the following for helping with the Phaser 3 Examples, Beta Testing, | @VanaMartin | @vforsh | @Vidminas | @x-wk | | @xmahle | @xuxucode | @YeloPartyHat | @ZekeLu | | FromChris | Golen | OmniOwl | and you ... | + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/Camera.md b/changelog/3.60/Camera.md index 9b52fdbc83..a01cd75a32 100644 --- a/changelog/3.60/Camera.md +++ b/changelog/3.60/Camera.md @@ -25,3 +25,5 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/CanvasRenderer.md b/changelog/3.60/CanvasRenderer.md index 0a58ff7af1..2b6363d603 100644 --- a/changelog/3.60/CanvasRenderer.md +++ b/changelog/3.60/CanvasRenderer.md @@ -2,8 +2,6 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). -## Canvas Renderer New Features - ## Canvas Renderer Updates * `BlitterCanvasRenderer` will now skip the `drawImage` call in canvas if the frame width or height are zero. @@ -20,3 +18,5 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/Colors.md b/changelog/3.60/Colors.md index d9a4b99582..67d095c53c 100644 --- a/changelog/3.60/Colors.md +++ b/changelog/3.60/Colors.md @@ -26,3 +26,5 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/CompressedTextures.md b/changelog/3.60/CompressedTextures.md index bec414e1f3..ca7e7247b7 100644 --- a/changelog/3.60/CompressedTextures.md +++ b/changelog/3.60/CompressedTextures.md @@ -21,3 +21,5 @@ Compressed Textures are loaded using the new `this.load.texture` method, which t --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/Container.md b/changelog/3.60/Container.md index 6e893461a4..07db6ec0b6 100644 --- a/changelog/3.60/Container.md +++ b/changelog/3.60/Container.md @@ -2,9 +2,6 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). -## Container New Features - - ## Container Updates * `Container.addHandler` will now call `GameObject.addedToScene`. @@ -22,3 +19,5 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/DynamicTextures.md b/changelog/3.60/DynamicTextures.md index 45753d6cb1..5d8d43279e 100644 --- a/changelog/3.60/DynamicTextures.md +++ b/changelog/3.60/DynamicTextures.md @@ -76,3 +76,5 @@ You should use a Render Texture if you need to display the texture in-game on a --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/ESMSupport.md b/changelog/3.60/ESMSupport.md index f765695d19..708ae5bc75 100644 --- a/changelog/3.60/ESMSupport.md +++ b/changelog/3.60/ESMSupport.md @@ -44,3 +44,5 @@ Because the Webpack feature is experimental we won't make the ESM version the de --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/FX.md b/changelog/3.60/FX.md index e08b89ac68..ce52793c6e 100644 --- a/changelog/3.60/FX.md +++ b/changelog/3.60/FX.md @@ -8,20 +8,20 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). We have decided to bundle a selection of highly flexible special effect shaders in to Phaser 3.60 and provide access to them via an easy to use set of API calls. The FX included are: -* Barrel - A nice pinch / bulge distortion effect. -* Bloom - Add bloom to any Game Object, with custom offset, blur strength, steps and color. -* Blur - 3 different levels of gaussian blur (low, medium and high) and custom distance and color. -* Bokeh / TiltShift - A bokeh and tiltshift effect, with intensity, contrast and distance settings. -* Circle - Add a circular ring around any Game Object, useful for masking / avatar frames, with custom color, width and background color. -* ColorMatrix - Add a ColorMatrix to any Game Object with access to all of its methods, such as `sepia`, `greyscale`, `lsd` and lots more. -* Displacement - Use a displacement texture, such as a noise texture, to drastically (or subtly!) alter the appearance of a Game Object. -* Glow - Add a smooth inner or outer glow, with custom distance, strength and color. -* Gradient - Draw a gradient between two colors across any Game Object, with optional 'chunky' mode for classic retro style games. -* Pixelate - Make any Game Object appear pixelated, to a varying degree. -* Shadow - Add a drop shadow behind a Game Object, with custom depth and color. -* Shine - Run a 'shine' effect across a Game Object, either additively or as part of a reveal. -* Vignette - Apply a vignette around a Game Object, with custom offset position, radius and color. -* Wipe - Set a Game Object to 'wipe' or 'reveal' with custom line width, direction and axis of the effect. +* **Barrel** - A nice pinch / bulge distortion effect. +* **Bloom** - Add bloom to any Game Object, with custom offset, blur strength, steps and color. +* **Blur** - 3 different levels of gaussian blur (low, medium and high) and custom distance and color. +* **Bokeh** / TiltShift - A bokeh and tiltshift effect, with intensity, contrast and distance settings. +* **Circle** - Add a circular ring around any Game Object, useful for masking / avatar frames, with custom color, width and background color. +* **ColorMatrix** - Add a ColorMatrix to any Game Object with access to all of its methods, such as `sepia`, `greyscale`, `lsd` and lots more. +* **Displacement** - Use a displacement texture, such as a noise texture, to drastically (or subtly!) alter the appearance of a Game Object. +* **Glow** - Add a smooth inner or outer glow, with custom distance, strength and color. +* **Gradient** - Draw a gradient between two colors across any Game Object, with optional 'chunky' mode for classic retro style games. +* **Pixelate** - Make any Game Object appear pixelated, to a varying degree. +* **Shadow** - Add a drop shadow behind a Game Object, with custom depth and color. +* **Shine** - Run a 'shine' effect across a Game Object, either additively or as part of a reveal. +* **Vignette** - Apply a vignette around a Game Object, with custom offset position, radius and color. +* **Wipe** - Set a Game Object to 'wipe' or 'reveal' with custom line width, direction and axis of the effect. What's more, the FX can be stacked up. You could add, for example, a `Barrel` followed by a `Blur` and then topped-off with a `Circle` effect. Just by adjusting the ordering you can achieve some incredible and unique effects, very quickly. @@ -128,3 +128,5 @@ Available to all Game Objects: --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/Game.md b/changelog/3.60/Game.md index 2c23167733..9ff249c77b 100644 --- a/changelog/3.60/Game.md +++ b/changelog/3.60/Game.md @@ -29,3 +29,5 @@ ArtemSiz) --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/GameObject.md b/changelog/3.60/GameObject.md index 1b4ccbcd49..b65ff81eb1 100644 --- a/changelog/3.60/GameObject.md +++ b/changelog/3.60/GameObject.md @@ -58,3 +58,5 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/Geometry.md b/changelog/3.60/Geometry.md index a93b945f64..369b522f15 100644 --- a/changelog/3.60/Geometry.md +++ b/changelog/3.60/Geometry.md @@ -30,3 +30,5 @@ The following are API-breaking, in that a new optional parameter has been insert --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/GraphicsGameObject.md b/changelog/3.60/GraphicsGameObject.md index 393a70caa6..a20f0b7912 100644 --- a/changelog/3.60/GraphicsGameObject.md +++ b/changelog/3.60/GraphicsGameObject.md @@ -7,11 +7,6 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). * The `Graphics.strokeRoundedRect` and `fillRoundedRect` methods can now accept negative values for the corner radius settings, in which case a concave corner is drawn instead (thanks @rexrainbow) * Earcut has been updated to version 2.2.4. This release improves performance by 10-15% and fixes 2 rare race conditions that could leave to infinite loops. Earcut is used internally by Graphics and Shape game objects when triangulating polygons for complex shapes. - -## Graphics Game Object Updates - - - ## Graphics Game Object Bug Fixes * `Graphics.strokeRoundedRect` would incorrectly draw the rectangle if you passed in a radius greater than half of the smaller side. This is now clamped internally (thanks @temajm) @@ -19,3 +14,5 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/Input.md b/changelog/3.60/Input.md index fdd1b58983..5b771f71f3 100644 --- a/changelog/3.60/Input.md +++ b/changelog/3.60/Input.md @@ -40,3 +40,5 @@ There are breaking changes from previous versions of Phaser. --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/Loader.md b/changelog/3.60/Loader.md index 87fc9d646b..f4157f86f0 100644 --- a/changelog/3.60/Loader.md +++ b/changelog/3.60/Loader.md @@ -27,3 +27,5 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/Masks.md b/changelog/3.60/Masks.md index 6d82b80013..9c79b25d94 100644 --- a/changelog/3.60/Masks.md +++ b/changelog/3.60/Masks.md @@ -33,3 +33,5 @@ There are breaking changes from previous versions of Phaser. --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/MatterPhysics.md b/changelog/3.60/MatterPhysics.md index 37c6c5b043..ccf62b3927 100644 --- a/changelog/3.60/MatterPhysics.md +++ b/changelog/3.60/MatterPhysics.md @@ -75,3 +75,5 @@ Because of the changes above, the following new methods are available to any Pha --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/Mesh.md b/changelog/3.60/Mesh.md index 3ea9ac46d9..32034fa95c 100644 --- a/changelog/3.60/Mesh.md +++ b/changelog/3.60/Mesh.md @@ -18,9 +18,8 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). * `Mesh.addVertices` will now throw a console warning if invalid vertices data is given to the method (thanks @omniowl) * `Mesh.addVerticesFromObj` will now throw a console warning if invalid vertices data is given to the method (thanks @omniowl) -## Mesh, Vertex and Face Bug Fixes - - --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/MobilePerformance.md b/changelog/3.60/MobilePerformance.md new file mode 100644 index 0000000000..4545d39914 --- /dev/null +++ b/changelog/3.60/MobilePerformance.md @@ -0,0 +1,51 @@ +# Phaser 3.60.0 Change Log + +Return to the [Change Log index](CHANGELOG-v3.60.md). + +## New Feature - Vastly Improved Mobile WebGL Performance + +We went right back to the drawing board with regard to the performance of Phaser 3.60 on mobile devices. After weeks of debugging and testing across a variety of hardware it led us to the conclusion that the renderer was being tripped up by the GPU blocking process that is `bufferSubData`. This, combined with the cost of the multi-texture shader we had, was utterly tanking mobile performance. + +So we changed the approach the WebGL Pipelines took with regard to handling textures and moved to a hybrid batch system, similar to the way it worked in 3.22 but with all of the improvements we had made since then. And lo and behold, things got real, real fast! + +The new v3.60 approach uses one single-bound texture and the new Mobile Pipeline and also does away with the enforced 16-texture limit. As a result, this stopped all of the sub-data buffering, removing the blocking process from the rendering step and also allowing for any number of textures internally. We got rid of lots of texture assignment and comparison code from the game step and the results speak for themselves: + +![Mobile Performance](images/perf1.png) + +In the chart above we tested a batching demo across multiple hardware devices and 3 different versions of Phaser. We kept adding to the test until it could no longer maintain 60fps in the browser. This gave us the maximum quantity of texture binds the device could handle for that version. + +As you can imagine, the higher the number, the better. + +For iOS hardware, the chart above speaks volumes. On an iPhone SE, for example, Phaser v3.24 could handle 5,248 texture binds at 60 fps. This dropped dramatically to just 192 texture binds under v3.50. But the 3.60 version? 15,104 texture binds at a rock solid 60 fps. + +**We saw a 187% increase from v3.24 and a 7,766% increase over v3.55.** That's a dramatic improvement, and I'm sure you can agree. + +It's important to understand what is being shown here. This isn't a test to see how many sprites we can draw. It's a test to see how many _texture binds_ and draw calls WebGL can handle under the new pipelines. The higher the number, the better. + +For example, in an actual game, you may have a sprite sheet for your player in one PNG and then another for some enemies in a different PNG. Those are 2 unique texture binds. They may contain hundreds of frames in total, but as far as WebGL is concerned, it's all part of the same underlying texture. As the renderer flows through the display list, it can see that a different texture is being used, so it binds and activates the new one, allowing the shader to draw the vertices using the correct texture. This is why using texture atlases is so important. The more on-screen objects that share an atlas, the less texture binds and draws that take place. + +With Phaser v3.50 we introduced multi-texture batching. This allowed us to batch together typically 16 unique textures and then draw them all in a single draw call. The total depends on the GPU and device, but the WebGL spec guarantees at least 8 unique textures and most GPUs allow for 16 or 32. The problem was that when we introduced this feature, it caused a lot of data buffering to take place, which on some GPUs, is a blocking process. You could see this most clearly on iOS, where the frame rate would tank with just a few textures being used. + +Previously, Phaser v3.24 (and earlier) took a different approach. Here, it would only ever bind 1 single texture (texture unit zero), and it would also batch together all of the vertex data. Using a series of internal arrays and objects allowed it to flow through bunches of 16 textures, activating them and drawing as required. This resulted in lots of draw calls but minimal data buffering. As it turns out, mobile GPUs really like this approach, whereas desktop does not. + +The new Multi Pipeline is faster on desktop as well, too: + +![Desktop Performance](images/perf2.png) + +Here we can see the same test on an M1 iMac and a Windows 11 PC running an NVIDIA RTX 3080 Ti, both powerful bits of kit but by no means 'cutting edge' any longer. On Chrome on the PC, you can see that v3.24 managed 14,336 textures at 60 fps. This improved to 32,000 under v3.55 but on v3.60 we get 35,072. The story is similar, although a lot slower (as always) in Firefox, which suffers from a less optimized WebGL implementation than Chrome. + +On the iMac, Phaser v3.24 rocked along nicely at 15,872 textures at 60 fps. Dropping to a paltry 2,560 under v3.55 and increasing to an astonishing 42,240 texture binds under v3.60. If you don't need to maintain 60 fps (i.e., for a much more static puzzle game), then you can push this even higher. M1s really are a beast. + +Desktop GPUs, in most cases, had a real improvement from v3.24 to v3.55. But the improvements in v3.60 push it even further, while also improving mobile speed no-end. That's a win-win for everyone. + +Will you ever actually need 42,240 unique texture swaps per frame for your game? Well, it's doubtful. You should really be using texture atlases and minimizing the amount of swapping going on. Yet it's nice to know that this power is there, under the hood, should you require it. + +Phaser will check to see if the device is iOS or Android and invoke the new Mobile Pipeline automatically. You can control this by using the game config. You can now also set the default WebGL Pipeline which all Game Objects will be assigned via the new config flag. If this value is set, it overrides the automatic mobile detection, allowing you to have much more fine-grained control over which devices are considered mobile or not. + +So, if you want thousands of sprites blasting around you game - go for it! + +--------------------------------------- + +Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/NineSliceGameObject.md b/changelog/3.60/NineSliceGameObject.md index c7b4f3eddf..4b57082444 100644 --- a/changelog/3.60/NineSliceGameObject.md +++ b/changelog/3.60/NineSliceGameObject.md @@ -63,3 +63,5 @@ As of Phaser 3.60 this Game Object is WebGL only. Please see the new examples an --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/ParticleEmitter.md b/changelog/3.60/ParticleEmitter.md index 50fdb1adb0..16c773a6f3 100644 --- a/changelog/3.60/ParticleEmitter.md +++ b/changelog/3.60/ParticleEmitter.md @@ -457,3 +457,5 @@ Another potentially breaking change is the removal of two internal private count --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/PlaneGameObject.md b/changelog/3.60/PlaneGameObject.md index 12b7c27c70..68827b3c01 100644 --- a/changelog/3.60/PlaneGameObject.md +++ b/changelog/3.60/PlaneGameObject.md @@ -21,3 +21,5 @@ As of Phaser 3.60 this Game Object is WebGL only. Please see the new examples an --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/ScaleManager.md b/changelog/3.60/ScaleManager.md index 4d25374d7e..5fd74d88d5 100644 --- a/changelog/3.60/ScaleManager.md +++ b/changelog/3.60/ScaleManager.md @@ -10,7 +10,6 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). * `ScaleManager.listeners` has been renamed to `domlisteners` to avoid conflicting with the EventEmitter listeners object. Fix #6260 (thanks @x-wk) - ## Scale Manager Bug Fixes * `ScaleManager.getParentBounds` will now also check to see if the canvas bounds have changed x or y position, and if so return `true`, causing the Scale Manager to refresh all of its internal cached values. This fixes an issue where the canvas may have changed position on the page, but not its width or height, so a refresh wasn't triggered. Fix #5884 (thanks @jameswilddev) @@ -19,3 +18,5 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/Scene.md b/changelog/3.60/Scene.md index e6239f2e1e..5ba4adb894 100644 --- a/changelog/3.60/Scene.md +++ b/changelog/3.60/Scene.md @@ -30,3 +30,5 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/Sound.md b/changelog/3.60/Sound.md index b2f54517e7..619ec9358d 100644 --- a/changelog/3.60/Sound.md +++ b/changelog/3.60/Sound.md @@ -26,3 +26,5 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/SpatialSound.md b/changelog/3.60/SpatialSound.md index d97b22ab5f..111af77cc8 100644 --- a/changelog/3.60/SpatialSound.md +++ b/changelog/3.60/SpatialSound.md @@ -50,3 +50,5 @@ This allows you to create a 3D sound environment in your game. The following new --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/Spector.md b/changelog/3.60/Spector.md index d5346973dd..337ca95fac 100644 --- a/changelog/3.60/Spector.md +++ b/changelog/3.60/Spector.md @@ -24,3 +24,5 @@ You can call the following functions from your game code to control Spector: --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/Spine3.md b/changelog/3.60/Spine3.md index ab595f36f9..5f955349a3 100644 --- a/changelog/3.60/Spine3.md +++ b/changelog/3.60/Spine3.md @@ -14,3 +14,5 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/Spine4.md b/changelog/3.60/Spine4.md index c0940e2d05..c03f321cd8 100644 --- a/changelog/3.60/Spine4.md +++ b/changelog/3.60/Spine4.md @@ -22,3 +22,5 @@ We will maintain both the Spine 3 and 4 plugins for the forseeable future. --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/TextGameObject.md b/changelog/3.60/TextGameObject.md index e79c16a80a..158b5c64c7 100644 --- a/changelog/3.60/TextGameObject.md +++ b/changelog/3.60/TextGameObject.md @@ -19,3 +19,5 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/TextureManager.md b/changelog/3.60/TextureManager.md index 7d5e2bc661..5e66683859 100644 --- a/changelog/3.60/TextureManager.md +++ b/changelog/3.60/TextureManager.md @@ -34,3 +34,5 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/Tilemap.md b/changelog/3.60/Tilemap.md index 1ac7fc6a13..35788c865d 100644 --- a/changelog/3.60/Tilemap.md +++ b/changelog/3.60/Tilemap.md @@ -49,3 +49,5 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/Timeline.md b/changelog/3.60/Timeline.md index cc606c6ac5..e55e3d3849 100644 --- a/changelog/3.60/Timeline.md +++ b/changelog/3.60/Timeline.md @@ -71,3 +71,5 @@ There are lots of options available to you via the configuration object. See the --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/Timestep.md b/changelog/3.60/Timestep.md index 78fff3f69b..4ac5690504 100644 --- a/changelog/3.60/Timestep.md +++ b/changelog/3.60/Timestep.md @@ -41,3 +41,5 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/TweenManager.md b/changelog/3.60/TweenManager.md index db5a886661..871afa3605 100644 --- a/changelog/3.60/TweenManager.md +++ b/changelog/3.60/TweenManager.md @@ -67,3 +67,5 @@ The following are further updates within the Tween system: --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/Utils.md b/changelog/3.60/Utils.md index 9e3d563ab4..d65fe7a28c 100644 --- a/changelog/3.60/Utils.md +++ b/changelog/3.60/Utils.md @@ -34,3 +34,5 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/VideoGameObject.md b/changelog/3.60/VideoGameObject.md index 055d5faecd..e2f0a1b3ea 100644 --- a/changelog/3.60/VideoGameObject.md +++ b/changelog/3.60/VideoGameObject.md @@ -8,8 +8,6 @@ The Video Game Object has been fully recoded in v3.60. Previously, it had issues ![Video Game Object](images/videogameobject.png) -### New Features: - * The Video Game Object now has a much better method of handling user-interaction unlocking. We can detect for input locking by seeing if the Play Promise fails. If it does, we use the `retryInterval` and then try to play the video again. This continues until input is unlocked. This can happen via a tap, click or key press. The Video Game Object itself never needs to listen for this, it just needs to wait for a success Play Promise resolution. * Use the new `VIDEO_LOCKED` event to know if the video is playback locked due to needing input. * Previously, the Video Game Object would use the `preUpdate` method to check how far along the video was and then update the source texture. This is now all handled by the Request Video Frame callback, which is only invoked when a video frame is ready. This makes the Video Game Object much more efficient as it will only ever update the source texture when a new frame is decoded by the browser. @@ -22,7 +20,7 @@ The Video Game Object has been fully recoded in v3.60. Previously, it had issues * `Video.loadURL` has a new optional parameter `crossOrigin`. This allows you to specify a cross origin request type when loading the video cross-domain (thanks @rmartell) * The `Video` config will now detect for `x-m4v` playback support for video formats and store it in the `Video.m4v` property. This is used automatically by the `VideoFile` file loader. Fix #5719 (thanks @patrickkeenan) -### Breaking Changes: +## Video Game Object Breaking Changes * There `loadEvent` parameter when loading a video has been removed. * There 'asBlob' parameter when loading a video has been removed. @@ -56,7 +54,7 @@ this.load.video('wormhole', 'wormhole.mp4', true); * The `VIDEO_TIMEOUT` event has been removed. * The `Video.removeVideoElementOnDestroy` property has been removed. The Video Element is now always removed when the Video Game Object is destroyed. -### New Methods: +### Video Game Object New Methods * `Video.load` is a new method that loads a video from the Video Cache, ready for playback with the `Video.play` method. * `Video.addLoadEventHandlers` is a new method that adds the loader specific event handlers to the video element. @@ -68,7 +66,7 @@ this.load.video('wormhole', 'wormhole.mp4', true); * `Video.playError` is a new internal method that is called automatically if the playback Promise errors. * `Video.stalledHandler` is a new method that is called if a video stalls, for whatever reason. -### New Properties: +### Video Game Object New Properties * `Video.frameReady` is a new property that lets you know if the texture has been created and populated with the first frame of the video, or not. * `Video.isStalled` is a new read-only property that lets you know if the video is currently stalled or not. This is useful for detecting if the video is buffering or not. @@ -77,7 +75,7 @@ this.load.video('wormhole', 'wormhole.mp4', true); * `Video.cacheKey` is a new property that contains the key of the curreng video if it came from the Video Cache, otherwise it's empty. * `Video.isSeeking` is a new read-only property that lets you know if the video is currently seeking or not. -### Fixed Bugs: +## Video Game Object Bug Fixes * Video RTC was not reliably working. Fix #6130 (thanks @mshopf) * If you switched tabs, then return to your game, a completed video would start playing again. It now remains stopped. Fix #5873 (thanks @marcusx2) @@ -90,3 +88,5 @@ this.load.video('wormhole', 'wormhole.mp4', true); --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/WebGLRenderer.md b/changelog/3.60/WebGLRenderer.md index 609885600b..0bfc92d9f1 100644 --- a/changelog/3.60/WebGLRenderer.md +++ b/changelog/3.60/WebGLRenderer.md @@ -2,10 +2,6 @@ Return to the [Change Log index](CHANGELOG-v3.60.md). -## New Feature - Vastly Improved Mobile Performance and WebGL Pipeline Changes - -TODO - ## WebGL Renderer Updates Due to all of the changes with how WebGL texture batching works a lot of mostly internal methods and properties have been removed. This is the complete list: @@ -113,3 +109,5 @@ In order to add clarity in the codebase we have created a new `PostPipeline` Com --------------------------------------- Return to the [Change Log index](CHANGELOG-v3.60.md). + +📖 Read the [Phaser 3 API Docs](https://newdocs.phaser.io/) 💻 Browse 2000+ [Code Examples](https://labs.phaser.io) 🤝 Join the awesome [Phaser Discord](https://discord.gg/phaser) diff --git a/changelog/3.60/images/perf1.png b/changelog/3.60/images/perf1.png new file mode 100644 index 0000000000..6cea3abb36 Binary files /dev/null and b/changelog/3.60/images/perf1.png differ diff --git a/changelog/3.60/images/perf2.png b/changelog/3.60/images/perf2.png new file mode 100644 index 0000000000..8d5452f13e Binary files /dev/null and b/changelog/3.60/images/perf2.png differ