diff --git a/CHANGELOG.md b/CHANGELOG.md index ea4dddb42..a946dabca 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -53,6 +53,7 @@ There is a third game config property called `pixelArt`. If set to `true` it's t * `ScenePlugin.wake` (and the corresponding methods in Scene Systems and the Scene Manager) now has a new optional `data` argument, which is passed to the target Scene and emitted in its 'wake' event. * `ScenePlugin.setActive` now has a new optional `data` argument, which is passed to the target Scene and emitted in its 'pause' or 'resume' events. * `TileSprite.tileScaleX` and `tileScaleY` are two new properties that allow you to control the scale of the texture within the Tile Sprite. This impacts the way the repeating texture is scaled, and is independent to scaling the Tile Sprite itself. It works in both Canvas and WebGL mode. +* You can now set the WebGL batch size in the Game Config via the property `batchSize`. The default is 2000 before the batch will flush, which is a happy average between desktop and mobile. If targeting desktop specifically, you may wish to increase this value to reduce draw calls. ### Updates diff --git a/src/boot/Config.js b/src/boot/Config.js index 7211a1756..471096b78 100644 --- a/src/boot/Config.js +++ b/src/boot/Config.js @@ -94,6 +94,7 @@ var ValueToColor = require('../display/color/ValueToColor'); * @property {boolean} [render.preserveDrawingBuffer=false] - [description] * @property {boolean} [render.failIfMajorPerformanceCaveat=false] - [description] * @property {string} [render.powerPreference='default'] - "high-performance", "low-power" or "default" + * @property {integer} [render.batchSize=2000] - The default WebGL batch size. * @property {(string|number)} [backgroundColor=0x000000] - [description] * @property {object} [callbacks] - [description] * @property {BootCallback} [callbacks.preBoot=NOOP] - [description] @@ -355,7 +356,7 @@ var Config = new Class({ this.transparent = GetValue(renderConfig, 'transparent', false); /** - * @const {boolean} Phaser.Boot.Config#zoclearBeforeRenderom - [description] + * @const {boolean} Phaser.Boot.Config#clearBeforeRender - [description] */ this.clearBeforeRender = GetValue(renderConfig, 'clearBeforeRender', true); @@ -379,6 +380,11 @@ var Config = new Class({ */ this.powerPreference = GetValue(renderConfig, 'powerPreference', 'default'); + /** + * @const {integer} Phaser.Boot.Config#batchSize - The default WebGL Batch size. + */ + this.batchSize = GetValue(renderConfig, 'batchSize', 2000); + var bgc = GetValue(config, 'backgroundColor', 0); /** diff --git a/src/renderer/webgl/WebGLRenderer.js b/src/renderer/webgl/WebGLRenderer.js index 9f3c043b5..069eb7d91 100644 --- a/src/renderer/webgl/WebGLRenderer.js +++ b/src/renderer/webgl/WebGLRenderer.js @@ -39,7 +39,7 @@ var TextureTintPipeline = require('./pipelines/TextureTintPipeline'); * any context change that happens for WebGL rendering inside of Phaser. This means * if raw webgl functions are called outside the WebGLRenderer of the Phaser WebGL * rendering ecosystem they might pollute the current WebGLRenderingContext state producing - * unexpected behaviour. It's recommended that WebGL interaction is done through + * unexpected behavior. It's recommended that WebGL interaction is done through * WebGLRenderer and/or WebGLPipeline. * * @class WebGLRenderer @@ -87,7 +87,8 @@ var WebGLRenderer = new Class({ autoResize: gameConfig.autoResize, roundPixels: gameConfig.roundPixels, maxTextures: gameConfig.maxTextures, - maxTextureSize: gameConfig.maxTextureSize + maxTextureSize: gameConfig.maxTextureSize, + batchSize: gameConfig.batchSize }; /** @@ -442,7 +443,7 @@ var WebGLRenderer = new Class({ this.gl = gl; - // Set it back into the Game, so devs can access it from there too + // Set it back into the Game, so developers can access it from there too this.game.context = gl; for (var i = 0; i <= 16; i++) diff --git a/src/renderer/webgl/pipelines/TextureTintPipeline.js b/src/renderer/webgl/pipelines/TextureTintPipeline.js index 89c08b474..4142e0e5c 100644 --- a/src/renderer/webgl/pipelines/TextureTintPipeline.js +++ b/src/renderer/webgl/pipelines/TextureTintPipeline.js @@ -46,21 +46,19 @@ var TextureTintPipeline = new Class({ function TextureTintPipeline (config) { + var rendererConfig = config.renderer.config; + + // Vertex Size = attribute size added together (2 + 2 + 1 + 4) + WebGLPipeline.call(this, { game: config.game, renderer: config.renderer, gl: config.renderer.gl, - topology: (config.topology ? config.topology : config.renderer.gl.TRIANGLES), - vertShader: (config.vertShader ? config.vertShader : ShaderSourceVS), - fragShader: (config.fragShader ? config.fragShader : ShaderSourceFS), - vertexCapacity: (config.vertexCapacity ? config.vertexCapacity : 6 * 2000), - - vertexSize: (config.vertexSize ? config.vertexSize : - Float32Array.BYTES_PER_ELEMENT * 2 + - Float32Array.BYTES_PER_ELEMENT * 2 + - Float32Array.BYTES_PER_ELEMENT * 1 + - Uint8Array.BYTES_PER_ELEMENT * 4 - ), + topology: config.renderer.gl.TRIANGLES, + vertShader: ShaderSourceVS, + fragShader: ShaderSourceFS, + vertexCapacity: 6 * rendererConfig.batchSize, + vertexSize: Float32Array.BYTES_PER_ELEMENT * 5 + Uint8Array.BYTES_PER_ELEMENT * 4, attributes: [ { @@ -117,10 +115,9 @@ var TextureTintPipeline = new Class({ * * @name Phaser.Renderer.WebGL.Pipelines.TextureTintPipeline#maxQuads * @type {integer} - * @default 2000 * @since 3.0.0 */ - this.maxQuads = 2000; + this.maxQuads = rendererConfig.batchSize; /** * Collection of batch information