mirror of
https://github.com/magnus919/agent-skills.git
synced 2026-09-13 04:26:28 +03:00
Magnus HedemarkandGitHub
c7c4d3b74f
Engineering: backend-engineering, frontend-engineering, data-engineering, ml-engineering, platform-engineering, qa-methodology Executive: go-to-market, legal-strategy, operational-design, org-design, product-strategy ml-engineering: added missing training-infrastructure.md reference qa-methodology: added test-data-management, performance-testing, security-testing references All frontmatter converted to agent-skills convention. Source: https://github.com/magnus919/hermes-profiles
1.4 KiB
1.4 KiB
Client-Side Performance
Core Web Vitals Targets
| Metric | Good | Needs improvement | Poor |
|---|---|---|---|
| LCP (Largest Contentful Paint) | ≤ 2.5s | 2.5s - 4.0s | > 4.0s |
| FID (First Input Delay) / INP | ≤ 100ms | 100ms - 300ms | > 300ms |
| CLS (Cumulative Layout Shift) | ≤ 0.1 | 0.1 - 0.25 | > 0.25 |
Bundle Optimization
| Technique | Impact | Effort |
|---|---|---|
| Code splitting by route | High | Low (built-in with most frameworks) |
| Dynamic imports for heavy components | Medium | Low |
| Tree shaking unused exports | Medium | Low (enabled by default in bundlers) |
| Import cost awareness | Medium | Medium (lint rules, CI checks) |
| Image optimization (format, sizing, lazy loading) | High | Medium |
| Dependency audit (remove unused, find lighter alternatives) | Medium | High |
Render Optimization
| Pattern | When to use | Mechanism |
|---|---|---|
| Memoization | Pure components that re-render often | React.memo, useMemo, useCallback |
| Virtualization | Long lists (1000+ items) | react-window, react-virtuoso |
| Debouncing | High-frequency events (search input, scroll) | Debounce by 300-500ms |
| Throttling | Rate-limited updates (resize, scroll position) | Throttle by 100-200ms |
| Progressive hydration | Heavy interactive content below the fold | Lazy hydrate on visibility |