optimize

Diagnose and fix web performance bottlenecks using Core Web Vitals and bundle-size metrics.

142|31|Updated Jul 13, 2017
One-click install
npx skills add https://github.com/microlinkhq/www --skill optimize-microlinkhq
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: optimize
Source: https://github.com/microlinkhq/www/tree/main/.agents/skills/optimize
Command: npx skills add https://github.com/microlinkhq/www --skill optimize-microlinkhq

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It helps identify and remove performance bottlenecks so users experience faster loading, smoother rendering, and more responsive interactions instead of slow, janky behavior.

Core Features & Use Cases

  • Performance measurement & diagnosis: Uses Core Web Vitals, load time, bundle size, runtime performance, and network waterfall to find what is slowing the page down.
  • Targeted optimization plan: Provides concrete strategies for loading, rendering, animations, and framework-level performance improvements.
  • Verification with real metrics: Emphasizes measuring before/after, testing on real devices and slow connections, and preventing regressions.

Quick Start

Run the optimize skill focusing on your main slow area, such as loading performance, and then re-measure Core Web Vitals and bundle size to confirm the improvement.

Frequently Asked Questions about optimize

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I fix slow web page loading and improve Core Web Vitals?

Fix slow web page loading by diagnosing bottlenecks in Core Web Vitals, bundle size, and network waterfalls, then applying targeted optimizations like image delivery and code splitting to improve loading performance.

What causes janky rendering and animation issues in web applications?

Janky rendering and animation issues stem from layout thrashing, large DOM sizes, and inefficient rendering patterns that block the main thread, requiring runtime profiling to identify and resolve performance bottlenecks.

How do I reduce JavaScript bundle size for frontend applications?

Reduce JavaScript bundle size by implementing code splitting, lazy loading, and analyzing bundle payloads to identify heavy dependencies before applying performance-safe rendering patterns to prevent regressions.

What is the best way to optimize images for web performance?

The best way to optimize images for web performance involves using CDN optimization and modern formats to reduce delivery payloads, systematically measuring load times before and after to verify improvements on real devices.

Do I need to measure performance before and after optimizing my web app?

Yes, measuring performance before and after optimizing your web app is required to verify that fixes for loading, rendering, and bundle-size bottlenecks actually prevent regressions and improve Core Web Vitals.

How do I diagnose frontend performance bottlenecks on slow connections?

Diagnose frontend performance bottlenecks on slow connections by profiling network waterfalls, runtime performance, and DOM layout efficiency, then testing remediation strategies on real devices to confirm improvements.