dev-performance-performance-basics
About
This skill provides core R3F/Three.js performance optimization principles for developers when FPS drops below 60. It explains the critical 16ms budget for 60 FPS and offers actionable strategies like canvas configuration and draw call reduction. Use it to diagnose performance issues and implement essential rendering optimizations.
Quick Install
Claude Code
Recommendednpx skills add majiayu000/claude-skill-registry -a claude-code/plugin add https://github.com/majiayu000/claude-skill-registrygit clone https://github.com/majiayu000/claude-skill-registry.git ~/.claude/skills/dev-performance-performance-basicsCopy and paste this command in Claude Code to install this skill
GitHub Repository
Frequently asked questions
What is the dev-performance-performance-basics skill?
dev-performance-performance-basics is a Claude Skill by majiayu000. Skills package instructions and resources that Claude loads on demand, so Claude can perform dev-performance-performance-basics-related tasks without extra prompting.
How do I install dev-performance-performance-basics?
Use the install commands on this page: add dev-performance-performance-basics to Claude Code as a plugin, or clone its repository into your skills directory, then restart Claude so it picks up the skill.
What category does dev-performance-performance-basics belong to?
dev-performance-performance-basics is in the performance category, tagged general.
Is dev-performance-performance-basics free to use?
Yes. dev-performance-performance-basics is listed on AIMCP and free to install. It runs inside Claude, so no separate service account is required to use the skill itself.
Related Skills
This skill provides comprehensive performance profiling to measure, analyze, and optimize application performance across CPU, memory, I/O, and network dimensions. It helps developers identify bottlenecks, perform root cause analysis, and implement optimizations using tools like perf, Instruments, and clinic.js. Use it when you need systematic performance improvement through baseline measurement, detection, and optimization phases.
This Claude Skill provides comprehensive performance analysis and bottleneck detection for Claude Flow swarms. It identifies optimization opportunities through profiling and benchmarking, delivering actionable recommendations. Use it when you need to analyze and improve the performance of your active workflows.
This skill provides comprehensive performance profiling to detect bottlenecks and optimize applications across CPU, memory, I/O, and network dimensions. It establishes baselines, identifies hot paths, and offers root cause analysis using platform-specific tools like perf and Instruments. Use it when you need to systematically measure and improve your application's performance.
This skill provides Level of Detail (LOD) techniques for React Three Fiber (R3F) to optimize performance by reducing model complexity based on camera distance. It's used when complex 3D models cause FPS drops, especially in large scenes or on mobile devices. The implementation uses the `@react-three/drei` `Detailed` component to swap between high, medium, low, and billboard versions of a model at defined distance thresholds.
