From 7bf7caf56b5dfb8307ffa3ebca17f12ad6c7ca5d Mon Sep 17 00:00:00 2001 From: Jens Date: Sun, 23 Aug 2026 15:07:55 +0200 Subject: [PATCH] Werk de frontend-documentatie bij De README noemde App.tsx nog de orchestrator; die rol ligt sinds de splitsing bij WorkbenchApp.tsx. Verder twee secties toegevoegd over wat er veranderd is: de werkstanden en het leidende designsysteem, en de laadstrategie met de verzoekdeler en het laden per werkblad. Co-Authored-By: Claude Opus 5 --- frontend/README.md | 46 +++++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 45 insertions(+), 1 deletion(-) diff --git a/frontend/README.md b/frontend/README.md index a0dee06c..3236de6e 100644 --- a/frontend/README.md +++ b/frontend/README.md @@ -160,7 +160,9 @@ font dependency. ## Current component boundaries -`App.tsx` remains the shared workspace orchestrator, while focused surfaces +`App.tsx` only decides which of the two shells to show: the landing page or the +workbench. `WorkbenchApp.tsx` is the shared workspace orchestrator and is loaded +lazily, so the sign-in screen does not pay for the map engine. Focused surfaces and pure map helpers are kept outside it: - `components/overview/OverviewWorkspace.tsx` owns status, source freshness, @@ -836,3 +838,45 @@ The audit covers 390x844, 1366x768 and 2560x1080, every top-level workspace, keyboard operation of the analysis period, skip-link focus, delayed bootstrap truthfulness and visible coverage timing. The enforced limits are documented in `docs/UX_PERFORMANCE_BUDGETS.md`. + +## Visual audit follow-through + +The workbench runs dark by default; the landing page stays light. A toggle in +the top bar switches between them and remembers the choice per browser. The +operating system preference is deliberately ignored: browsers report `light` by +default even when the user never chose, which would put almost everyone in the +wrong mode. + +`styles/geointel-system.css` is loaded last and leads. Thirteen tokens were +called on 87 lines without ever being defined, so those colour declarations fell +back to inheritance; they now resolve. Shape and elevation went back onto the +scale, and the weight scale has four steps that are each actually loaded — the +stylesheets previously declared nine weights while two faces were available, and +`font-synthesis-weight: none` meant everything from 650 to 850 rendered as 600. + +Real `!important` went from 47 to 1, verified by comparing computed styles +between production builds. The remaining one is documented where it stands. +Fifteen of the removed ones sat in the second-screen block: that window is +opened with `window.open('')` and never fetched the linked stylesheet, so they +were overriding something that never arrived. `SecondaryDisplay.tsx` now inlines +the rules and adopts the already-loaded font faces. + +Contrast is measured with a gradient-aware checker across six workspaces in both +modes; the threshold is WCAG AA. + +## Loading strategy + +The workbench is a separate chunk behind `React.lazy`. The sign-in screen loads +344 kB over the wire instead of 1.46 MB. + +`apiGet` shares concurrent and closely-following identical requests for 300 ms. +This collapses the start-up cascade, where two effects asked for the same areas +and datasets about ninety milliseconds apart. The table is cleared on sign-in, +sign-out and session expiry, because signing out does not reload the page. + +Each workspace loads its own data when it is first opened rather than everything +up front. Start-up went from 27 requests to 16. + +Source images for the web assets live in `design-assets/`, not in `public/`. +Everything in `public/` is copied verbatim into `dist/`, so 8.1 MB of unused PNG +masters shipped with every build.