You can now set the maxLights value in the Game Config, which controls the total number of lights the Light2D shader can render in a single pass. The default is 10. Be careful about pushing this too far. More lights = less performance. Close phaserjs#4081

Author: photonstorm

CHANGELOG.md

@@ -4,6 +4,8 @@
 
 ### New Features
 
+* You can now set the `maxLights` value in the Game Config, which controls the total number of lights the Light2D shader can render in a single pass. The default is 10. Be careful about pushing this too far. More lights = less performance. Close #4081 (thanks @FrancescoNegri)
+
 ### Updates
 
 * `WebGLRenderer.deleteTexture` will check to see if the texture it is being asked to delete is the currently bound texture or not. If it is, it'll set the blank texture to be bound after deletion. This should stop `RENDER WARNING: there is no texture bound to the unit 0` errors if you destroy a Game Object, such as Text or TileSprite, from an async or timed process (thanks jamespierce)

src/boot/Config.js

@@ -95,6 +95,7 @@ var ValueToColor = require('../display/color/ValueToColor');
  * @property {boolean} [failIfMajorPerformanceCaveat=false] - Let the browser abort creating a WebGL context if it judges performance would be unacceptable.
  * @property {string} [powerPreference='default'] - "high-performance", "low-power" or "default". A hint to the browser on how much device power the game might use.
  * @property {integer} [batchSize=2000] - The default WebGL batch size.
+ * @property {integer} [maxLights=10] - The maximum number of lights allowed to be visible within range of a single Camera in the LightManager.
  */
 
 /**
@@ -529,6 +530,11 @@ var Config = new Class({
          */
         this.batchSize = GetValue(renderConfig, 'batchSize', 2000);
 
+        /**
+         * @const {integer} Phaser.Boot.Config#maxLights - The maximum number of lights allowed to be visible within range of a single Camera in the LightManager.
+         */
+        this.maxLights = GetValue(renderConfig, 'maxLights', 10);
+
         var bgc = GetValue(config, 'backgroundColor', 0);
 
         /**

src/gameobjects/lights/LightsManager.js

@@ -6,7 +6,6 @@
 
 var Class = require('../../utils/Class');
 var Light = require('./Light');
-var LightPipeline = require('../../renderer/webgl/pipelines/ForwardDiffuseLightPipeline');
 var Utils = require('../../renderer/webgl/Utils');
 
 /**
@@ -84,6 +83,17 @@ var LightsManager = new Class({
          * @since 3.0.0
          */
         this.active = false;
+
+        /**
+         * The maximum number of lights that a single Camera and the lights shader can process.
+         * Change this via the `maxLights` property in your game config, as it cannot be changed at runtime.
+         *
+         * @name Phaser.GameObjects.LightsManager#maxLights
+         * @type {integer}
+         * @readOnly
+         * @since 3.15.0
+         */
+        this.maxLights = -1;
     },
 
     /**
@@ -96,6 +106,11 @@ var LightsManager = new Class({
      */
     enable: function ()
     {
+        if (this.maxLights === -1)
+        {
+            this.maxLights = this.scene.sys.game.renderer.config.maxLights;
+        }
+
         this.active = true;
 
         return this;
@@ -142,14 +157,13 @@ var LightsManager = new Class({
 
         culledLights.length = 0;
 
-        for (var index = 0; index < length && culledLights.length < LightPipeline.LIGHT_COUNT; ++index)
+        for (var index = 0; index < length && culledLights.length < this.maxLights; index++)
         {
             var light = lights[index];
 
             cameraMatrix.transformPoint(light.x, light.y, point);
 
-            // We'll just use bounding spheres to test
-            // if lights should be rendered
+            //  We'll just use bounding spheres to test if lights should be rendered
             var dx = cameraCenterX - (point.x - (camera.scrollX * light.scrollFactorX * camera.zoom));
             var dy = cameraCenterY - (viewportHeight - (point.y - (camera.scrollY * light.scrollFactorY) * camera.zoom));
             var distance = Math.sqrt(dx * dx + dy * dy);

src/renderer/webgl/WebGLRenderer.js

@@ -89,7 +89,8 @@ var WebGLRenderer = new Class({
             roundPixels: gameConfig.roundPixels,
             maxTextures: gameConfig.maxTextures,
             maxTextureSize: gameConfig.maxTextureSize,
-            batchSize: gameConfig.batchSize
+            batchSize: gameConfig.batchSize,
+            maxLights: gameConfig.maxLights
         };
 
         /**
@@ -562,7 +563,7 @@ var WebGLRenderer = new Class({
 
         this.addPipeline('TextureTintPipeline', new TextureTintPipeline({ game: this.game, renderer: this }));
         this.addPipeline('BitmapMaskPipeline', new BitmapMaskPipeline({ game: this.game, renderer: this }));
-        this.addPipeline('Light2D', new ForwardDiffuseLightPipeline({ game: this.game, renderer: this }));
+        this.addPipeline('Light2D', new ForwardDiffuseLightPipeline({ game: this.game, renderer: this, maxLights: config.maxLights }));
 
         this.setBlendMode(CONST.BlendModes.NORMAL);
 

src/renderer/webgl/pipelines/ForwardDiffuseLightPipeline.js

@@ -33,6 +33,8 @@ var ForwardDiffuseLightPipeline = new Class({
 
     function ForwardDiffuseLightPipeline (config)
     {
+        LIGHT_COUNT = config.maxLights;
+
         config.fragShader = ShaderSourceFS.replace('%LIGHT_COUNT%', LIGHT_COUNT.toString());
 
         TextureTintPipeline.call(this, config);