From cfbe754299230e76c208fbb499e72ca1d8298325 Mon Sep 17 00:00:00 2001 From: dev Date: Sun, 24 May 2026 22:35:39 +0200 Subject: [PATCH] docs(pendientes): add performance bottleneck analysis for docs site MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit User reported slow web load + Chrome `[Violation] 'setTimeout' handler took 78ms`. Profiled the critical path of `/uix/*` layout and documented 4 ranked bottlenecks as **diferir** (deferred to pre-release polish since UIX is still in framework-dev phase): 1. 744 KB render-blocking CSS — entire eidos recipe catalog `@import`-ed in one bundle for every uix page. 2. `ActiveEidos.create({ applyDom: true })` re-generates the foundation CSS at runtime, duplicating the bundled stylesheet. Likely source of the 78ms violation. 3. 28 sema modules + 71 lang files eagerly imported at layout boot. 4. 100+ sidebar links with `data-sveltekit-preload-{code,data}="hover"` flooding the network on rail mouseover. Each entry documents the file:lines, why it's expensive, and the recommended architectural fix. Ordered cost-to-impact for when polish sprint starts. Also includes the pre-existing Soma/Popover audit deferral notes that were sitting uncommitted in the working tree. Co-Authored-By: Claude Opus 4.7 (1M context) --- src/uix/PENDIENTES.md | 30 ++++++++++++++++++++++++++++++ 1 file changed, 30 insertions(+) diff --git a/src/uix/PENDIENTES.md b/src/uix/PENDIENTES.md index 432775bfc..99608ba74 100644 --- a/src/uix/PENDIENTES.md +++ b/src/uix/PENDIENTES.md @@ -36,6 +36,14 @@ una pasada larga el mismo día. El contrato canónico es: | Tests browser del flujo completo (Playwright): inline/modal, kind chip, range state machine, snapshot/cancel, click-outside, Escape | **implementar** — alta cobertura para flujos que ahora dependen de state machine. | | Sema event al bloquear click cuando `mode='modal'` | **diferir** — útil para screen reader feedback. No bloquea. | +## Soma / Popover — bloqueo detectado durante Words + +| Item | Disposición | +| --- | --- | +| Auditar `Popover` como componente propio antes de usarlo para `Words.ToolPopover` | **implementar** — el trigger emite `present` en la traza, pero el estado `open` no queda reflejado de forma fiable en DOM y `Content` puede no montarse. En la demo de `Words`, abrir el editor de link desde el `BubbleMenu` produce `TypeError: Cannot read properties of undefined (reading 'wrapperProps')` en `src/uix/soma/components/popover/popover-provider.svelte.ts`. No es una adaptación específica de `Words`; es deuda de `Soma/Popover` y debe resolverse con su propia demo, tests y audit visual. | +| Revisar `Portal` sólo si la auditoría de `Popover` lo confirma | **diferir** — no modificar `internal/Portal` como efecto lateral de `Words`; aislar primero si el fallo está en trigger/provider/presence/portal. | +| Añadir test browser o harness Svelte para click real de `Popover.Trigger` → `Content` visible | **implementar** — los tests unitarios del provider no cubren el flujo renderizado con `Trigger`, `Portal`, `Content`, `bind:open` y atributos morfo en DOM. | + ## Tooltip (warnings pendientes del audit) | Item | Disposición | @@ -74,6 +82,28 @@ remedia. No se hace barrido proactivo de nada que ya esté PASS. | **Audit D-7.4** — el array de chips de cada control (size, variant, color) enumera el tipo completo declarado en `types.ts` | **hecho** (`scripts/component-audit.ts`). Parsea `{PascalName}{Prop}` exacto, resuelve alias canónicos (`ControlVariant`, `SelectionVariant`, `ChipVariant`, `MarkerVariant`, `TabsVariant`, `ColorRole`+narrowings) vía `SHARED_VARIANT_VOCAB`. | | Nuevo: audit que verifique que ninguna Part Eidos consulta `provider.opts.{boolean}Button.current` (composición pura) | **diferir** — chequeo defensivo, low value. | +## Web · performance del docs site + +Diagnóstico (2026-05-24): el usuario reporta carga lenta + Chrome marca +`[Violation] 'setTimeout' handler took 78ms`. Profiling identifica 4 +cuellos de botella reales, ordenados por impacto. Como UIX está en fase +de desarrollo del framework, todos quedan como **diferir** hasta entrar +en pasada de polish; documentados aquí para no perder el rastro. + +| Item | Disposición | +| --- | --- | +| **CSS layout 744 KB render-blocking**: `src/uix/eidos/index.css` `@import`-ea 70+ recipes + `generated/base.css` (213 KB) — total 944 KB. Cada `/uix/*` descarga + parsea todo antes del first paint, la mayoría para componentes que la página no usa. | **diferir** — fix arquitectónico: dejar foundation global (~250 KB: `base.css` + `archetypes.css` + `events.css`) y mover cada recipe `XComponent.css` a un `import` dentro del `.svelte` correspondiente para que Vite lo code-splittee con el JS. Esto requiere migrar la convención del foundation eidos. | +| **`ActiveEidos.create({ applyDom: true })` re-genera todo en runtime**: `apply()` (`src/uix/eidos/active-eidos.svelte.ts:361-389`) corre `renderStaticCss()` + `renderThemeCss()` sincrónicamente, itera `THEME_BASE_RECIPE_TOKENS` (2.884 líneas) + color×scale×role×alpha (>1k declaraciones), inyecta 3 `