ahmad-ubaidillah/modern-web-performance
aizen-gate/skills-reference/.agent/skills/modern-web-performance/SKILL.md
High-Performance Web Engineering.
development
Updated Mar 27, 2026
$ install --global
skillsauthnpx skillsauth add ahmad-ubaidillah/aizen-gate modern-web-performanceInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Mar 30, 2026, 10:02 AM63.0s1 file scanned
SKILL.md
- name:
- modern-web-performance
- description:
- High-Performance Web Engineering.
- category:
- performance
- version:
- 4.1.0-fractal
- layer:
- master-skill
⚡ High-Performance Web Engineering
Source: Vercel Best Practices / Anthony Fu (Antfu) Engineering Standards
This skill focuses on "Elite-Level" web development: speed, zero-config DX, and scalable architecture.
🚀 1. The Vercel Way (Modern Stack)
- Edge-First Thinking: Prioritize logic that runs on the Edge (Middleware, Edge Functions) to reduce TTFB.
- Incremental Static Regeneration (ISR): Update static content without a full rebuild.
- Server Component Patterns: Minimize client-side JS. Use
use serversparingly and only where needed.
🛠️ 2. Antfu-Grade Developer Experience (DX)
- Zero-Config Philosophy: Use modern tools like
Vite,Vitest, andESLint (flat config)to minimize boilerplate. - Composable Logic: Build small, single-responsibility functions (Vue Composables or React Hooks) that are highly unit-testable.
- Type-Safety Everywhere: No
any. Use Zod for runtime validation and strict TS configs.
📦 3. Monorepo & Scalability
- Turborepo Master: Manage multi-package projects with intelligent caching and parallel execution.
- Shared UI Libraries: Split the UI into a separate package within the monorepo for reuse across Web/Mobile.
- Package Modernization: Migrate from CJS to ESM. Ensure
package.jsonexports are correctly defined.
🧪 4. Performance Auditing
- Core Web Vitals: Monitor LCP, FID, and CLS. Chasing "100" on PageSpeed Insights is the goal.
- Bundle Analysis: Use tools to find and remove "heavy" dependencies.
- Preload/Prefetch Strategies: Optimize asset loading for critical paths.
Created by Antigravity Orchestrator - Powered by Elite Web Ecosystem Wisdom.
Related Skills
ahmad-ubaidillah/angular
development
VerifiedTrustedCommunity
Modern Angular (v20+) expert with deep knowledge of Signals, Standalone Components, Zoneless applications, SSR/Hydration, and reactive patterns.
SKILL.mdUpdated Mar 28, 2026
ahmad-ubaidillah/angular-ui-patterns
development
VerifiedTrustedCommunity
Modern Angular UI patterns for loading states, error handling, and data display. Use when building UI components, handling async data, or managing component states.
SKILL.mdUpdated Mar 28, 2026
ahmad-ubaidillah/angular-state-management
tools
VerifiedTrustedCommunity
Master modern Angular state management with Signals, NgRx, and RxJS. Use when setting up global state, managing component stores, choosing between state solutions, or migrating from legacy patterns.
SKILL.mdUpdated Mar 28, 2026
ahmad-ubaidillah/angular-migration
development
VerifiedTrustedCommunity
Migrate from AngularJS to Angular using hybrid mode, incremental component rewriting, and dependency injection updates. Use when upgrading AngularJS applications, planning framework migrations, or ...
SKILL.mdUpdated Mar 28, 2026