Cómo usar esta herramienta para desarrolladores
- Pega el componente.
- Pulsa Inspeccionar.
- Revisa el resumen de estructura.
- Prioriza las señales de seguridad y mantenibilidad indicadas.
Inspector Angular
Resume señales técnicas de un componente Angular para una revisión rápida: imports, clase, selector, tamaño, bindings, eventos, directivas, uso de standalone y algunos patrones que merecen atención, como innerHTML o suscripciones directas. No ejecuta el framework; produce un informe estático que ayuda a decidir dónde mirar primero durante un code review.
Datos de entrada
Código a inspeccionarEspacio publicitario
Qué hace esta herramienta para desarrolladores
Combina métricas y reglas de diagnóstico sin modificar el código. Está orientado a triage, no a una auditoría completa.
Cuenta imports, líneas, bindings, eventos y directivas; identifica standalone y busca patrones como innerHTML, subscribe(), setInterval y console.log.
Una señal no implica necesariamente un error: debe interpretarse con el contexto del componente y del proyecto.
Ejemplo
[innerHTML] detectado → revisar origen/sanitización
.subscribe( detectado → revisar ciclo de vida de la suscripción
Casos de uso
- Preparar code reviews.
- Comparar complejidad superficial entre componentes.
- Localizar rápidamente patrones que necesitan contexto.
Consejos para obtener resultados fiables
- Prueba primero con un fragmento pequeño y representativo.
- Revisa el resultado antes de sustituir código en producción.
- Conserva una copia del archivo original si vas a aplicar cambios masivos.
- Usa Ctrl/Cmd + Enter para ejecutar el análisis desde el teclado.
Detalles del procesamiento
Las métricas se calculan localmente y las señales se describen con recomendaciones concretas.
No analiza templates externos, flujo de datos real, tipos ni dependencias resueltas por Angular.
Preguntas frecuentes
¿El inspector sustituye ESLint o Angular ESLint?
No. Ofrece un diagnóstico local y limitado para revisión rápida.
¿Por qué marca [innerHTML] como señal?
Porque el riesgo depende del origen del contenido y de la sanitización aplicada; merece una revisión explícita.
¿Detecta suscripciones RxJS?
Busca llamadas .subscribe( como señal textual, pero no puede determinar automáticamente si existe una fuga.
¿Analiza componentes standalone?
Sí. Indica si encuentra standalone: true en los metadatos.
¿La puntuación representa seguridad real?
No se muestra una puntuación global porque las señales necesitan contexto y no deben convertirse en una garantía de seguridad.
Herramientas relacionadas para desarrolladores
Señales inspeccionadas
| Señal | Motivo |
|---|---|
| [innerHTML] | Revisar contenido dinámico |
| .subscribe( | Revisar ciclo de vida |
Explorar la categoría
Consulta más utilidades de frameworks frontend para revisar, transformar y depurar código relacionado.
Ver Frameworks frontend