Open Design embed: skin pipeline first-click ≤ 250ms

## Что это При первом открытии Rox Design embed pipeline сборки skin (token resolution → CSS generation → injection) должен завершиться так, чтобы первый visible paint был ≤ 250ms на референсном M2 MacBook Air. Сейчас pipeline исполняется sequentially: load embed → load skin → apply theme → first paint, что даёт ~700ms. Оптимизация: precompute skin при идле (background preload через `requestIdleCallback`), кэшировать сериализованный skin в IndexedDB ключом `:`, при первом открытии — synchronous read и инжект до `WebContentsView.show()`. На invalidate-событиях (изменение токенов, смена темы) — async rebuild без блокировки UI. Компоненты: `@rox-one/design-skin-builder`, `apps/electron/src/embed/SkinCache`. Performance budget tracked через `performance.mark` и отправляется в structured-log. ## Зачем 250ms — psychologically «instant» порог для open-actions. Сейчас 700ms ощущаются как «приложение задумалось», что роняет confidence в embed как в полноценной surface. Это PZD-83 цель и обязательное условие для GA. ## Источники вдохновения - [icantcodefyi/dot-matrix-animations](https://github.com/icantcodefyi/dot-matrix-animations) — agent-themed React loaders ~4KB для быстрой загрузки - [intentui/intentui](https://github.com/intentui/intentui) — React Aria + Tailwind primitives с fast skin pipeline - [google-labs-code/design.md](https://github.com/google-labs-code/design.md) — DESIGN.md spec format с precomputed skin ## 🔗 Linear - [PZD-447](https://linear.app/kuhjie/issue/PZD-447) — backing ticket

Please authenticate to join the conversation.

Upvoters
Status

In Review

Board
🌊

Frictionless UX

Date

About 19 hours ago

Author

agi

Subscribe to post

Get notified by email when there are changes.