Works with the AI Agents you already use
Claude Code
Cursor
Codex CLI
DeepSeek
Muse+22 moreClaude CodeCursorCodex CLIDeepSeekMuse
Dots
Manus
Grok
Grok Bot+18 agents3D Frontend Physics Performance Auditor
Audit and optimize 3D web apps for rendering performance, physics stability, and GPU memory efficiency.
$12
3D Frontend Physics Performance Auditor
Example session with this skill installed
Audit this R3F component. Users report frame drops when many instances are spawned. I have attached a performance CSV. [Source code and metrics provided]
- Read your context and instructions
- Compiled the 3d frontend physics
- Generated the data export
The audit of the InstanceCloud component and metrics.csv indicates the application is Not Ready for production due to critical main-thread blocking and GPU memory churn.
3D Performance Audit Report
| ID | Title | Domain | Severity | Root Cause |
|---|---|---|---|---|
| R-01 | Material Fragmentation | Rendering | High | Each instance creates a unique MeshStandardMaterial instead of sharing a reference. |
| P-01 | Variable Timestep Jitter | Physics | Medium | Rapier world.step() is coupled to the render delta without a fixed-step accumulator. |
| M-01 | Texture Leak | Memory | Critical | texture.dispose() is missing from the useEffect cleanup, causing GPU OOM on remounts. |
Diagnostic Evidence
- Frame Budget: p99 latency is 42ms (Target: 16.6ms). Scripting accounts for 65% of frame time.
- Draw Calls: 450 calls for identical geometry;
instancedMeshis defined but not utilized. - Memory: JS Heap is stable, but GPU memory increases by 120MB per "Respawn" event.
Recommended Fix (Rendering)
// Replace individual Mesh components with InstancedMesh
// File: src/components/InstanceCloud.js
const count = 1000;
const tempObject = new THREE.Object3D();
function Instances() {
const meshRef = useRef();
// Use a single material reference for all instances
const material = useMemo(() => new THREE.MeshStandardMaterial({ color: 'orange' }), []);
useFrame((state) => {
for (let i = 0; i < count; i++) {
tempObject.position.set(i * 2, 0, 0);
tempObject.updateMatrix();
meshRef.current.setMatrixAt(i, tempObject.matrix);
}
meshRef.current.instanceMatrix.needsUpdate = true;
});
return (
<instancedMesh ref={meshRef} args={[null, null, count]} material={material}>
<boxGeometry />
</instancedMesh>
);
}
Next steps
- Implement the
instancedMeshrefactor to consolidate 450 draw calls into 1. - Add a fixed-step accumulator to the physics loop to resolve tunneling.
- Verify GPU memory stability using the Chrome Task Manager during component unmounting.
metrics.csv
CSV · data export
Example file from a real run - the skill writes it into your workspace.
Connects securely to your tools. The creator never sees your data.
About this skill
Real-time 3D web applications often suffer from stuttering, memory leaks, and physics instability that are difficult to debug using standard web tools. This skill audits Three.js, Babylon.js, and WebGL scenes to identify rendering bottlenecks, physics engine overhead, and resource disposal failures.
What it does
- Performance Profiling analyzes frame-time percentiles, draw calls, and triangle counts to identify CPU vs GPU bottlenecks.
- Physics Optimization audits Rapier, Cannon.js, and Ammo.js configurations for timestep stability, solver iterations, and collision fidelity.
- Memory Leak Detection identifies unreclaimed GPU resources like geometries, textures, and shader programs during scene transitions.
- Framework-Specific Auditing checks React Three Fiber (R3F) for state churn in high-frequency loops and improper component reconciliation.
- Resource Lifecycle Review validates disposal logic for buffers, workers, and textures to prevent long-session crashes.
How it works
- Intake the 3D framework version, target devices, and available benchmark data or source code.
- Inspect the render loop and physics accumulator for common anti-patterns like per-frame object allocation or shader churn.
- Analyze supplied CSV benchmark traces using internal scripts to calculate frame budget misses and physics overhead.
- Deliver a prioritized audit report with evidence-based findings, implementation diffs, and verification steps.
Frameworks & tools
Supports Three.js, React Three Fiber, Babylon.js, PlayCanvas, and WebGPU. Physics support includes Rapier, cannon-es, and Ammo.js. Compatible with Spector.js captures and Chrome Performance traces.
Why this beats prompting it yourself
Generic LLMs often suggest optimizations that break physics determinism or use deprecated engine APIs. This skill enforces a "measure before optimizing" workflow and distinguishes between JS heap pressure and GPU memory limits.
Use cases
- Debugging FPS drops and jank in browser-based games or 3D configurators.
- Reducing battery drain and thermal throttling for mobile WebGL experiences.
- Stabilizing physics simulations experiencing tunneling or jitter.
- Auditing R3F applications for unnecessary re-renders in the
useFramehook.
Known limitations
Cannot execute live browser profilers or run binaries. Requires user-supplied traces for quantitative analysis. FPS estimations from draw calls are not supported.
Find more skills like this on the Claude Skills Marketplace, the Codex Skills Marketplace and the Gemini Skills Marketplace, or browse Claude Skills for Game Development.
Cannot execute live browser profilers. Requires user-supplied traces for quantitative analysis. FPS estimations from draw-call counts are excluded to avoid false precision.
How to use
- 1
Connect your agent to the Agensi MCP
Copy the prompt and paste it into Claude, ChatGPT, Cursor or any agent that supports MCP. It sets up the connection for you. Manual setup
- 2
Sign in to Agensi
Your agent shows a sign-in link. Sign in and click Allow.
- 3
Ask for what you need
Your agent loads this skill and uses it on your task. It always asks before buying a skill.
Reviews
No reviews yet
Be one of the first to try it. Every listed skill goes through the trust checks below.
Security scanned
Checked by our 8-point scan before listing
Fresh listing
Recently published to Agensi
Money-back guarantee
Doesn't do what its page promises? You get your money back.
Trust & safety
Security scan
Security scan passed 3 days ago
- Software
Python