@lightningjs/blits 2.11.0 → 2.13.0

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # Changelog
 
+## 2.13.0
+
+_13 oct 2026_
+
+- Bumped renderer to 3.7.0
+
+
+## 2.12.0
+
+_8 oct 2026_
+
+- Added support for rich text using _bb-code_-style formatting
+- Capped default number of webworkers at 2 for faster App startup time
+- Added selective instantiation of _only_ the relevant text renders based on the registered fonts
+- Bumped renderer to 3.6.0 with latest rich text enhancements
+
 ## 2.11.0
 
 _28 sep 2026_

package/index.d.ts

@@ -1224,8 +1224,9 @@ declare module '@lightningjs/blits' {
     * Maximum number of web workers to spin up simultaneously for offloading functionality such
     * as image loading to separate threads (when supported by the browser)
     *
-    * If not specified defaults to the number of logical processers available as reported by
-    * `navigator.hardwareConcurrency` (or 2 if `navigator.hardwareConcurrency` is not supported)
+    * If not specified defaults to the number of logical processers available on the device, as reported by
+    * `navigator.hardwareConcurrency`, with a maximum of 2. If `navigator.hardwareConcurrency` is
+    * not supported the default value will be 2
     */
     webWorkersLimit?: number
     /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lightningjs/blits",
-  "version": "2.11.0",
+  "version": "2.13.0",
   "description": "Blits: The Lightning 3 App Development Framework",
   "bin": "bin/index.js",
   "exports": {
@@ -95,7 +95,7 @@
     "tape": "^5.9.0"
   },
   "dependencies": {
-    "@lightningjs/renderer": "3.5.1",
+    "@lightningjs/renderer": "^3.7.0",
     "magic-string": "^1.4.1"
   },
   "repository": {

package/src/components/Circle.js

@@ -26,6 +26,7 @@ export default () =>
         const validAttributes = [
           'parent',
           'rotation',
+          'rich',
           'w',
           'h',
           'x',

package/src/components/FPScounter.js

@@ -28,6 +28,7 @@ export const FPScounter = Blits.Component('FPScounter', {
       const validAttributes = [
         'parent',
         'rotation',
+        'rich',
         'w',
         'h',
         'x',

package/src/components/RouterView.js

@@ -38,6 +38,7 @@ export default () =>
           const validAttributes = [
             'parent',
             'rotation',
+            'rich',
             'w',
             'h',
             'x',

package/src/engines/L3/element.js

@@ -240,6 +240,9 @@ const propsTransformer = {
   set rotation(v) {
     this.props['rotation'] = v * (Math.PI / 180)
   },
+  set rich(v) {
+    this.props['richText'] = v
+  },
   set w(v) {
     const parsed = parsePercentage.call(this, v, 'w')
     this.props['w'] = parsed

package/src/engines/L3/fontLoader.js

@@ -17,23 +17,27 @@
 
 import Settings from '../../settings.js'
 import { renderer } from './launch.js'
-
-const fontTypeMapping = {
-  sdf: 'sdf',
-  msdf: 'sdf',
-  canvas: 'canvas',
-  web: 'canvas',
-}
+import { resolveFontEngineType } from './fontTypes.js'
 
 export default () => {
   const stage = renderer.stage
+  const renderMode = Settings.get('renderMode', 'webgl')
 
   const fonts = Settings.get('fonts', [])
   for (let i = 0; i < fonts.length; i++) {
     const font = fonts[i]
-    const type = fontTypeMapping[font.type] || 'sdf'
+    const type = resolveFontEngineType(font.type)
 
     if (type === 'sdf') {
+      // The SDF text renderer is not compatible with the Canvas core renderer
+      // (no `sdf` font handler is registered), so skip these fonts instead of
+      // throwing in `stage.loadFont`.
+      if (renderMode === 'canvas') {
+        console.warn(
+          `Blits: Skipping SDF font "${font.family}" because SDF fonts are not supported with renderMode "canvas".`
+        )
+        continue
+      }
       stage.loadFont('sdf', {
         fontFamily: font.family,
         atlasUrl: font.png || (font.file && font.file.replace(/\.[^.]+$/, `.${font.type}.png`)),

package/src/engines/L3/fontTypes.js

@@ -0,0 +1,62 @@
+/*
+ * Copyright 2023 Comcast Cable Communications Management, LLC
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * Maps a Blits font `type` (as declared in `settings.fonts`) to the
+ * renderer font-engine type (`sdf` or `canvas`).
+ *
+ * Kept in a shared module so `launch.js` (font-engine selection) and
+ * `fontLoader.js` (font loading) always agree on the mapping.
+ */
+const fontTypeMapping = {
+  sdf: 'sdf',
+  msdf: 'sdf',
+  canvas: 'canvas',
+  web: 'canvas',
+}
+
+/**
+ * Resolve a Blits font type to a renderer font-engine type.
+ * Unknown (or missing) types default to `sdf`, matching fontLoader behavior.
+ *
+ * @param {string} [type] - The font type declared in settings (web, msdf, sdf)
+ * @returns {'sdf'|'canvas'}
+ */
+export const resolveFontEngineType = (type) => fontTypeMapping[type] || 'sdf'
+
+/**
+ * Scan the configured fonts and report which font-engine types are required.
+ *
+ * @param {Array<{ type?: string }>} [fonts] - Fonts declared in settings
+ * @returns {{ hasSdfFont: boolean, hasCanvasFont: boolean }}
+ */
+export const getRequiredFontEngines = (fonts = []) => {
+  let hasSdfFont = false
+  let hasCanvasFont = false
+
+  const len = Array.isArray(fonts) ? fonts.length : 0
+  for (let i = 0; i < len; i++) {
+    if (resolveFontEngineType(fonts[i] && fonts[i].type) === 'sdf') {
+      hasSdfFont = true
+    } else {
+      hasCanvasFont = true
+    }
+    if (hasSdfFont === true && hasCanvasFont === true) break
+  }
+
+  return { hasSdfFont, hasCanvasFont }
+}

package/src/engines/L3/launch.js

@@ -25,6 +25,7 @@ import { SCREEN_RESOLUTIONS, RENDER_QUALITIES } from '../../constants.js'
 import colors from '../../lib/colors/colors.js'
 import fontLoader from './fontLoader.js'
 import shaderLoader from './shaderLoader.js'
+import { getRequiredFontEngines } from './fontTypes.js'
 import { platform } from '../../platform.js'
 
 /** @type {RendererMain|{}} */
@@ -37,11 +38,22 @@ const renderEngine = (settings) => {
   if (renderMode === 'canvas') return CanvasCoreRenderer
 }
 
-const textRenderEngines = (settings) => {
+export const textRenderEngines = (settings) => {
   const renderMode = 'renderMode' in settings ? settings.renderMode : 'webgl'
 
-  if (renderMode === 'webgl') return [SdfTextRenderer, CanvasTextRenderer]
+  // SDF text rendering is not compatible with the Canvas core renderer
   if (renderMode === 'canvas') return [CanvasTextRenderer]
+
+  if (renderMode === 'webgl') {
+    // Only register the font engines actually required by the configured
+    // fonts, so unused text renderers are never initialized.
+    const { hasSdfFont, hasCanvasFont } = getRequiredFontEngines(settings.fonts)
+    if (hasSdfFont === true && hasCanvasFont === true) return [SdfTextRenderer, CanvasTextRenderer]
+    if (hasSdfFont === true) return [SdfTextRenderer]
+    // Canvas-only fonts, or no fonts declared at all (system/default fonts
+    // render via the Canvas engine, which can render any font family).
+    return [CanvasTextRenderer]
+  }
 }
 
 const textureMemorySettings = (settings) => {
@@ -93,7 +105,9 @@ export default (App, target, settings = {}) => {
           SCREEN_RESOLUTIONS[screenHeight] ||
           1,
         numImageWorkers:
-          'webWorkersLimit' in settings ? settings.webWorkersLimit : hardwareConcurrency || 2,
+          'webWorkersLimit' in settings
+            ? settings.webWorkersLimit
+            : Math.min(hardwareConcurrency || 2, 2),
         clearColor: (settings.canvasColor && colors.normalize(settings.canvasColor)) || 0x00000000,
         inspector: settings.inspector === true ? Inspector : undefined,
         boundsMargin: settings.viewportMargin || 0,