Frontend performance and code quality improvements

Performance: cache getBoundingClientRect in card-glare and drag-drop,
build adjacency Maps for O(1) graph BFS, batch WebGL uniform uploads,
cache matchMedia/search text in card-sections, use Map in graph-layout.

Code quality: extract shared FPS chart factory (chart-utils.js) and
FilterListManager (filter-list.js), replace 14-way CSS editor dispatch
with type handler registry, move state to state.js, fix layer violation
in api.js, add i18n for hardcoded strings, sync 53 missing locale keys,
add HTTP error logging in DataCache.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

server/src/wled_controller/static/js/features/targets.js

@@ -31,6 +31,7 @@ import { IconSelect } from '../core/icon-select.js';
 import * as P from '../core/icon-paths.js';
 import { wrapCard } from '../core/card-colors.js';
 import { TagInput, renderTagChips } from '../core/tag-input.js';
+import { createFpsSparkline } from '../core/chart-utils.js';
 import { CardSection } from '../core/card-sections.js';
 import { TreeNav } from '../core/tree-nav.js';
 import { updateSubTabHash, updateTabBadge } from './tabs.js';
@@ -68,52 +69,7 @@ function _pushTargetFps(targetId, actual, current) {
 }
 
 function _createTargetFpsChart(canvasId, actualHistory, currentHistory, fpsTarget, maxHwFps) {
-    const canvas = document.getElementById(canvasId);
-    if (!canvas) return null;
-    const labels = actualHistory.map(() => '');
-    const datasets = [
-        {
-            data: [...actualHistory],
-            borderColor: '#2196F3',
-            backgroundColor: 'rgba(33,150,243,0.12)',
-            borderWidth: 1.5,
-            tension: 0.3,
-            fill: true,
-            pointRadius: 0,
-        },
-        {
-            data: [...currentHistory],
-            borderColor: '#4CAF50',
-            borderWidth: 1.5,
-            tension: 0.3,
-            fill: false,
-            pointRadius: 0,
-        },
-    ];
-    // Flat line showing hardware max FPS
-    if (maxHwFps && maxHwFps < fpsTarget * 1.15) {
-        datasets.push({
-            data: actualHistory.map(() => maxHwFps),
-            borderColor: 'rgba(255,152,0,0.5)',
-            borderWidth: 1,
-            borderDash: [4, 3],
-            pointRadius: 0,
-            fill: false,
-        });
-    }
-    return new Chart(canvas, {
-        type: 'line',
-        data: { labels, datasets },
-        options: {
-            responsive: true, maintainAspectRatio: false,
-            animation: false,
-            plugins: { legend: { display: false }, tooltip: { display: false } },
-            scales: {
-                x: { display: false },
-                y: { display: false, min: 0, max: fpsTarget * 1.15 },
-            },
-        },
-    });
+    return createFpsSparkline(canvasId, actualHistory, currentHistory, fpsTarget, { maxHwFps });
 }
 
 function _updateTargetFpsChart(targetId, fpsTarget) {