WindsurfTypeScriptPerformance
React Three Fiber Performance Rules for Windsurf
SEO-ready Windsurf rules for React Three Fiber performance with copy-paste instructions, testing guardrails, and production-safe patterns.
.windsurfrules
# React Three Fiber Performance Rules for Windsurf Place this in `.windsurfrules` so Windsurf follows these conventions consistently. ## Core standards - Keep all generated code production-ready and strongly typed where applicable. - Prefer small focused files and functions over large mixed-responsibility modules. - Match existing project conventions before introducing new patterns. - Include meaningful tests for business-critical behavior. - Never ship placeholder TODO logic in production paths. ## Performance conventions - Use explicit naming for modules, services, and handlers. - Add boundary validation for external inputs and API payloads. - Keep side effects isolated and observable with logs/metrics. - Favor predictable dependency boundaries and clear ownership. - Document trade-offs for non-obvious implementation choices. ## React Three Fiber guidance - Follow canonical React Three Fiber project layout and idioms. - Optimize for readability first, then measure before optimization. - Keep configuration centralized and environment-safe. - Ensure lint/type/test checks pass before merging. - For typescript, avoid hidden magic and implicit behavior. ## Testing checklist - Unit tests for pure logic and edge cases. - Integration tests for external dependencies. - Regression tests for bug fixes. - Deterministic test data and stable assertions. ## Security & reliability checklist - Validate and sanitize all user-controlled inputs. - Avoid leaking secrets in logs or error responses. - Fail safely with clear, actionable error messages. - Add retries/timeouts only where idempotency is guaranteed. ## AI generation behavior - Generate minimal diffs rather than full rewrites. - Explain risky changes before applying them.
How to use with Windsurf
Create a `.windsurfrules` file in your project root. Windsurf's Cascade AI applies these rules automatically.
#windsurf#typescript#r3f#performance#ai-coding-rules
Related Rules
TypeScript Cursor Rules
CursorTypeScript
Cursor rules for TypeScript: enforce strict mode, eliminate any types, and write type-safe code with these .cursorrules configurations.
Code Style
typescript · strictCopy Ready
TypeScript Windsurf Rules
WindsurfTypeScript
Windsurf rules for TypeScript: strict type safety, functional patterns, and modern TypeScript conventions.
Code Style
typescript · windsurfCopy Ready
React Windsurf Rules
WindsurfReact
Windsurf rules for React: modern patterns, performance, and scalable React architecture.
Architecture
react · windsurfCopy Ready
Go Windsurf Rules
WindsurfGo
Windsurf rules for Go: hexagonal architecture, clean code, observability, and production Go patterns.
Architecture
go · windsurfCopy Ready