Add an INP-specific measurement workflow covering field data via CrUX Vis,
DevTools interaction tracing, and mid-range Android device testing. Extend
the web-vitals snippet with the attribution build to surface inputDelay,
processingDuration, and presentationDelay. Add a checklist item for
deferring non-critical work out of event handlers to avoid delaying
interaction response.
- Add width/height to <source> elements for correct aspect-ratio in art direction.
- Use realistic 'sizes' attributes in hero image examples.
- Remove 'decoding=sync' from hero images to avoid blocking the main thread.
- Align TTFB 'good' threshold with web.dev standards (800ms).
- Distinguish synthetic (Lighthouse) vs RUM (web-vitals) measurement approaches,
clarifying when each is appropriate: synthetic for CI regression detection,
RUM to validate real user impact.
- Expand TTFB diagnosis from a single vague hint into a decision tree that breaks
down each component (DNS, TCP/TLS, server processing) with specific next steps.
Mirrors the tree in the skill and adds a dedicated checklist section.
- Fix image optimization example: the previous "GOOD" example applied loading="lazy"
without distinguishing the LCP hero image from below-the-fold images. Hero images
must never be lazy-loaded. New example separates both cases explicitly.
- Add art direction + resolution switching to the hero image example using <picture>
with media queries for mobile/desktop crops and srcset for density variants.
Mobile-first: <img src> fallback points to the mobile version.
Covers AVIF → WebP → JPG format cascade and fetchpriority="high" for LCP.
- Correct the date-fns tree-shaking example: modern bundlers (Vite, webpack 5+)
handle named imports automatically. The "BAD" pattern was not actually bad,
and following it could lead to unnecessary micro-optimizations. Real gains
come from dynamic imports and route-level code splitting, which the example
now illustrates instead.
Update all SKILL.md descriptions to lead with what the skill does
(third person) followed by trigger conditions, per Anthropic's
skill authoring docs. All original trigger conditions preserved.
Update description max chars to match Anthropic spec (1024).
Retain workflow-summary warning in skill-anatomy.md to prevent
agents from following descriptions instead of reading full skills.
Add Table of Contents to reference files longer than 100 lines so
Claude can see the full scope of available information even when
previewing with partial reads.
Joan Leon