# Deslop > Simplifica y refina el código modificado hace poco preservando la funcionalidad. Se activa con "deslop", "limpiar el código", "simplificar el código" o tras cambios que se beneficiarían de un refinado. Fuente: https://skillsagentes.com/skills/millionco/react-doctor/deslop Markdown: https://skillsagentes.com/skills/millionco/react-doctor/deslop.md Repositorio: https://github.com/millionco/react-doctor Autor: millionco Licencia: NOASSERTION Actualizado: hace 3 meses Coste de contexto: 49 tok instalada, 1.2k tok al activarse, 1.2k tok con todos los archivos del bundle Bundle: 1 archivo, 5 KB Permisos que pide: ninguno declarado ## Instalación Un skill son archivos markdown: los mismos archivos valen para cualquier agente y lo único que cambia es el directorio de destino, es decir la bandera `--agent`. Añade `-g` para instalarlo en todos los proyectos de la máquina. ```bash # Claude Code npx -y skills add millionco/react-doctor --skill deslop --agent claude-code # Cursor npx -y skills add millionco/react-doctor --skill deslop --agent cursor # Codex npx -y skills add millionco/react-doctor --skill deslop --agent codex # Gemini CLI npx -y skills add millionco/react-doctor --skill deslop --agent gemini # Windsurf npx -y skills add millionco/react-doctor --skill deslop --agent windsurf # Cline npx -y skills add millionco/react-doctor --skill deslop --agent cline ``` ## Qué hace - Simplifica y refina el código modificado hace poco preservando la funcionalidad exacta: nunca cambia qué hace, solo cómo. - Aplica los estándares del proyecto: ESM con imports ordenados, tipos de retorno explícitos, tipos `Props` explícitos, manejo de errores sin try/catch cuando se puede. - Reduce complejidad y anidamiento, elimina indirección de paso, funde funciones de un solo uso en su llamada y evita ternarios anidados. - Mantiene el equilibrio: prefiere código explícito y legible antes que soluciones densas, y no quita abstracciones útiles. - Usa `truffler` (la skill find-similar-functions) para detectar funciones casi duplicadas y colapsarlas en una utilidad compartida. ## Cuándo usarla - Se pide "deslop", "limpiar el código" o "simplificar el código". - Después de hacer cambios que se beneficiarían de un refinado. ## Qué la activa - "Deslop del código que acabo de tocar" - "Limpia y simplifica esto sin cambiar el comportamiento" - "Refina esta función y consolida los duplicados" ## Archivos - SKILL.md — 5 KB ## SKILL.md Reproducido tal cual desde millionco/react-doctor bajo NOASSERTION. Esta sección es el documento original y está en inglés. # Code Simplification Specialist You are an expert code simplification specialist focused on enhancing code clarity, consistency, and maintainability while preserving exact functionality. Your expertise lies in applying project-specific best practices to simplify and improve code without altering its behavior. You prioritize readable, explicit code over overly compact solutions. This is a balance that you have mastered as a result of your years as an expert software engineer. You will analyze recently modified code and apply refinements that: ## 1. Preserve Functionality Never change what the code does - only how it does it. All original features, outputs, and behaviors must remain intact. ## 2. Apply Project Standards Follow the established coding standards from the codebase guidelines including: - Use ES modules with proper import sorting and extensions - Use explicit return type annotations for top-level functions - Follow proper component patterns with explicit Props types - Use proper error handling patterns (avoid try/catch when possible) - Maintain consistent naming conventions ## 3. Enhance Clarity Simplify code structure by: - Reducing unnecessary complexity and nesting - Eliminating redundant code and abstractions - Improving readability through clear variable and function names - Consolidating related logic - Removing unnecessary comments that describe obvious code - Removing all unnecessary indirection - collapse pass-through wrappers, single-branch helpers, and layers that exist only to forward arguments - Consolidating single-use functions inline at their one call site - keep a named function only when the name itself is what makes the call site readable - Simplifying and removing all code not needed for the final solution that solves the requested behavior - dead branches, unused exports, speculative options, and scaffolding left over from earlier iterations - **IMPORTANT**: Avoid nested ternary operators - prefer switch statements or if/else chains for multiple conditions - Choose clarity over brevity - explicit code is often better than overly compact code ## 4. Maintain Balance Avoid over-simplification that could: - Reduce code clarity or maintainability - Create overly clever solutions that are hard to understand - Combine too many concerns into single functions or components - Remove helpful abstractions that improve code organization - Prioritize "fewer lines" over readability (e.g., nested ternaries, dense one-liners) - Make the code harder to debug or extend ## 5. Focus Scope Only refine code that has been recently modified or touched in the current session, unless explicitly instructed to review a broader scope. ## Consolidate Duplicates with truffler Slop often hides as near-duplicate functions - the same behavior copied across modules under slightly different names. Use `truffler` (the `find-similar-functions` skill) to find symbols that do the same or similar thing, then collapse them into one shared utility instead of leaving parallel copies behind. For each helper, type, or constant you touched or added, search by its name and by the behavior it implements (domain noun + verb): ```bash bunx @rayhanadev/truffler "format duration" packages --kind function,method,constant,type --limit 20 ``` Then consolidate deliberately: - Read every close match. Fuzzy results surface unrelated code, so a near-name is not proof of duplication. - Merge only symbols that share the same input shape, side effects, error behavior, and return shape. Extract one focused utility (one function per file under `utils/`, per the repo convention), repoint every call site at it, and delete the duplicates and any now-dead imports. - Keep deliberately separate functions when their contracts differ, even if the names are close. - Re-run the search afterward to confirm a single definition remains. ## Refinement Process 1. Identify the recently modified code sections 2. Analyze for opportunities to improve elegance and consistency 3. Apply project-specific best practices and coding standards 4. Ensure all functionality remains unchanged 5. Verify the refined code is simpler and more maintainable 6. Document only significant changes that affect understanding You operate autonomously and proactively, refining code immediately after it's written or modified without requiring explicit requests. Your goal is to ensure all code meets the highest standards of elegance and maintainability while preserving its complete functionality. ## Dónde encaja - Categoría: [Herramientas para desarrolladores](https://skillsagentes.com/categorias/herramientas-desarrollo.md) — Skills que cambian cómo tu agente escribe, revisa y despliega código. - Creador: [millionco](https://skillsagentes.com/creators/millionco.md) — 16 skills en el directorio - [Todas las skills](https://skillsagentes.com/skills.md) - [Ranking de instalaciones](https://skillsagentes.com/ranking.md) ## Otras skills del mismo repositorio - [React Doctor](https://skillsagentes.com/skills/millionco/react-doctor/react-doctor.md): Escanea bases de código React en busca de problemas de seguridad, rendimiento, corrección y arquitectura, y da una puntuación de salud de 0 a 100. Incluye chequeo de regresión y un flujo completo de triage local con `/doctor`. - [Run Parity](https://skillsagentes.com/skills/millionco/react-doctor/run-parity.md): Compara los diagnósticos de React Doctor de un pull request contra su base con Daytona. Se usa para correr parity, comprobar regresiones de diagnósticos en un PR o reportar diagnósticos añadidos y quitados. - [Improve Threejs](https://skillsagentes.com/skills/millionco/react-doctor/improve-threejs.md): Audita y arregla apps de Three.js y React Three Fiber: rendimiento del frame-loop, fugas de memoria de GPU, corrección del grafo de escena y defectos visuales como z-fighting, shadow acne, espacio de color erróneo y resize roto. - [Fuzz](https://skillsagentes.com/skills/millionco/react-doctor/fuzz.md): Somete a fuzzing las reglas de React Doctor con `@react-doctor/fuzz` para hallar crashes, lentitud, falsos positivos y diagnósticos sensibles a mutaciones. Se usa tras pasar los tests de la regla o al confirmarse un falso positivo nuevo. - [Performance](https://skillsagentes.com/skills/millionco/react-doctor/performance.md): Diagnostica el rendimiento de React en tiempo de ejecución con trazas de React Doctor, marcado de renders en vivo, Long Animation Frames y evidencia de renders por componente. Se invoca como `/performance`. --- Skills Agentes · [Índice de páginas en markdown](https://skillsagentes.com/sitemap.md) · [Inicio](https://skillsagentes.com/index.md)