Skip to content

perf(cards): load each card's visual editor only when it is opened - #1216

Merged
tempus2016 merged 1 commit into
mainfrom
perf/lazy-locales-editors
Nov 4, 2026
Merged

tempus2016 merged 1 commit into
mainfrom
perf/lazy-locales-editors

Conversation

@tempus2016

Copy link
Copy Markdown
Owner

perf(cards): load each card's visual editor only when it is opened

Every dashboard used to download and parse all 30 card editors (about
190 KB of JavaScript) even though nobody opens an editor on a normal
visit. Each editor now lives in www/editors/-editor.js and the
card's getConfigElement() imports it on demand, carrying the card's
?v= version so an update still busts the cache, while the editor
strings load alongside it.

perf(locales): load only the strings each screen needs, and let the browser cache them

A dashboard used to download two whole translation catalogues on every
load (the user's language plus English, about 600 KB) with a URL that
changed each time, so the browser could never cache them. Each language
is now split into three bundles: the cards' strings, the card editors'
and the admin panel's. A dashboard fetches just its language's cards
bundle (about 70 KB), a card editor adds the editor bundle, and the
admin panel adds its own. The URLs carry the integration version, so
the browser keeps them until the next update.

The bundles are generated from the existing locales/.json files
by scripts/split_locales.py and committed, with missing wording filled
from the fallback language at build time, so translators still edit one
file per language. The admin panel now also redraws when its strings
arrive or the language changes, instead of waiting for its next update.

ci(locales): keep the split locale bundles in step with their sources

The Data files check now fails when a locale bundle is stale, and a
pre-commit hook (which pre-commit.ci also runs) regenerates them, so a
translator's pull request gets the bundles rebuilt for them. The
contributing guide and the Localization page say which files to edit.

Testing

  • Unit and frontend tests for this change are included in the diff; the whole batch passes the full suite.
  • Checked on the dev Home Assistant instance as part of the v7.7.1 pre-release gate (desktop and 360/375/393/768 phone/tablet widths).

@github-actions github-actions Bot added documentation Improvements or additions to documentation ci CI, workflows, and tooling cards Lovelace cards / frontend (www/*.js) translations i18n / locale strings tests Test suite labels Nov 4, 2026
@tempus2016
tempus2016 merged commit ed2fef0 into main Nov 4, 2026
20 checks passed
@tempus2016
tempus2016 deleted the perf/lazy-locales-editors branch November 4, 2026 09:57
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

cards Lovelace cards / frontend (www/*.js) ci CI, workflows, and tooling documentation Improvements or additions to documentation tests Test suite translations i18n / locale strings

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant