skills.rest
julianromli
julianromliCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

optimize

Diagnose and fix web UI performance issues across loading, rendering, and animations.

Updated Apr 13, 2026
Search Tags:#performance#optimize#web-performance#bundle-size#lcp#cls#fid
One-click install
npx skills add https://github.com/julianromli/dikara-portfolio --skill optimize-julianromli
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: optimize
Source: https://github.com/julianromli/dikara-portfolio/tree/main/.cursor/skills/skills/optimize
Command: npx skills add https://github.com/julianromli/dikara-portfolio --skill optimize-julianromli

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Diagnoses and fixes UI performance across loading speed, rendering, animations, images, and bundle size. Use when the user mentions slow, laggy, janky, performance, bundle size, load time, or wants a faster, smoother experience.

Core Features & Use Cases

  • Identify and fix performance bottlenecks in web applications (loading, rendering, animation, image handling, and network latency).
  • Propose a practical optimization plan covering images, JavaScript, CSS, fonts, code-splitting, and caching with measurable outcomes.
  • Use Case: A slow single-page or multi-page app can be accelerated by targeted optimizations and performance metrics.

Quick Start

Assess the current UI performance issue and begin implementing core optimizations.

Frequently Asked Questions about optimize

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

FAQPage Schema
How do I fix a slow web app and improve Core Web Vitals like LCP and CLS?▼

To fix a slow web app and improve Core Web Vitals like LCP and CLS, you must diagnose loading, rendering, and layout shift bottlenecks. This involves targeting images, JavaScript, CSS, and fonts to deliver a measurably faster, smoother user experience.

What is the best way to reduce JavaScript bundle size in a single-page application?▼

The best way to reduce JavaScript bundle size in a single-page application is implementing code-splitting and targeted caching strategies. Identifying heavy dependencies and optimizing script delivery yields a smaller payload and faster load times.

Why does my web UI feel janky during animations and how can I resolve it?▼

Your web UI feels janky during animations due to rendering bottlenecks blocking the main thread. Resolving jank requires identifying performance bottlenecks in rendering and animations to ensure smooth frame rates and a responsive interface.

Can I optimize loading performance for both static sites and progressive web apps?▼

Yes, you can optimize loading performance for both static sites and progressive web apps. Performance diagnostics apply across modern web app architectures by addressing network latency, image handling, and bundle size for measurable loading improvements.

How do I identify performance bottlenecks causing high FID scores?▼

To identify performance bottlenecks causing high FID scores, evaluate JavaScript execution and main thread blocking during loading. Pinpointing heavy script execution allows you to implement procedural optimizations that reduce input delay.

Related Skills

Explore More Software Engineering Skills→
ZainEldeen-Ashraf-Ibrahim-Ibrahim-SamakZainEldeen-Ashraf-Ibrahim-Ibrahim-Samak

optimize

Diagnose and fix UI performance issues using Core Web Vitals measurements.

Community
Advanced
HieubkavHieubkav

web-performance-audit

Measure Core Web Vitals and identify web performance bottlenecks.

Community
Advanced
xiaoliwanshuixiaoliwanshui
21

flutter-reducing-app-size

Analyze Flutter build sizes and prune unused assets and libraries.

Community
Intermediate
HollowvynHollowvyn

static-rendering

Pre-generate HTML at build time for non-personalized pages and dynamic routes.

Official
Intermediate