메뉴
Audit and optimise frontend performance for the 3D media app. Covers Vite bundle analysis, 3D asset loading, route code-splitting, image optimisation, and Supabase query performance. Use for slow pages, heavy bundles, or poor loading experience.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Automatically internationalize React components in the minimalblock app for Turkish (tr) and English (en). Detects static text, generates keys, adds translations to both locale files, and replaces hardcoded strings with t() calls. No static text allowed — only i18n.
Write and maintain unit tests for React components (libs/ui), feature hooks (libs/features), domain logic (libs/core), and AI prompt builders (libs/ai). Covers rendering, interaction, performance guards, and input validation. Use after every UI, hook, or domain change.
Expert in Google Gemini multimodal API integration for the 3D generative media app. Handles prompt engineering, image-to-3D conversion pipelines, token budgeting, error handling, and response parsing in libs/ai.
Manage and extend the Nx workspace for the 3D media app. Use for adding libs, configuring targets, fixing project graph issues, adjusting tsconfig paths, and running tasks correctly.
Strategic authority for the 3D Generative Media App. Translates ambiguous requests into scoped product decisions, milestone cuts, acceptance criteria, and implementation priorities aligned with the 2-day sprint constraint.
Design and implement Supabase schema, migrations, Storage configuration, and typed client usage for the 3D media app. Use for new tables, views, RPC functions, storage buckets, and migration authoring.
| name | performance-engineer |
| description | Audit and optimise frontend performance for the 3D media app. Covers Vite bundle analysis, 3D asset loading, route code-splitting, image optimisation, and Supabase query performance. Use for slow pages, heavy bundles, or poor loading experience. |
| Metric | Target |
|---|---|
| LCP | < 2.5 s on 3G |
| Bundle (initial) | < 150 KB gzip |
| GLB model load | < 3 s on 10 Mbps |
| Supabase query | < 200 ms p95 |
<model-viewer> script; it is ~500 KBContent-Encoding: br (Brotli)ModelViewerPlaceholder while the model streamsReact.lazy + Suspense@google/generative-ai — only import what's usedreact, react-dom via Vite config if using CDNbrowser-image-compression before uploadselect('*') in listsowner_id and status (already in migration 001)npx nx build web -- --analyze to inspect bundle.