CLRS Kit Españolclrs-kit-esp es una extensión para Visual Studio Code orientada al soporte de un lenguaje de programación tipo pseudocódigo, fuertemente inspirado en la sintaxis utilizada en el libro Introducción a Algoritmos (CLRS) 4.ª edición. 💻 Inicio rápido
RequisitoEs necesario tener Node.js instalado en el sistema. CLRS Kit Español lo utiliza como entorno de ejecución (Runtime) para correr el código JavaScript generado durante el proceso de transpilación. Comenzar a programarSi es tu primera vez con CLRS Kit Español, abre la guía interactiva para conocer las herramientas principales paso a paso:
Si ya comenzaste y quieres saber cuál es el siguiente paso recomendado según tu archivo o proyecto actual:
Licencia (GPL versión 2.0)Este proyecto es de código abierto y se distribuye bajo los términos de la licencia GPLv2. Puede ser modificado y distribuido libremente, siempre que se conserve el software resultante bajo la misma licencia. El código generado en JavaScript se distribuirá bajo su licencia correspondiente. RecomendadoRecursos opcionales que podrían mejorar tu experiencia con esta extensión. 📑 Índice
⌨️ Comandos para VS Code
⚙️ Estado actual (versión 2.0.4)Lenguaje de programación
Herramientas de edición integradas a VS Code
Herramientas de aprendizaje integradas a VS Code
📖 Filosofía del proyectoEl proyecto está diseñado bajo los siguientes principios:
En una época donde la construcción de código se delega cada vez más a la inteligencia artificial, el trabajo del humano evoluciona hacia la orquestación estratégica de la toma de decisiones guiada por el criterio y el ingenio. CLRS Kit Español busca hacer accesible, ejecutable y observable el razonamiento computacional, para que el estudiante no sólo escriba una solución, sino que pueda comprenderla, comprobarla, analizarla y justificarla. 🧮 Características del lenguajeComentariosCLRS admite comentarios de una sola línea mediante
Variables y tipos de datosLas variables en CLRS son dinámicas, débilmente tipadas y mutables. No existe una declaración separada de variables ni soporte para constantes. La primera asignación mediante
Las variables no pueden declararse sin un valor inicial. CLRS admite cuatro tipos básicos de valores:
Una variable puede cambiar el tipo de valor que almacena durante la ejecución.
Ámbito de las variablesLas variables pueden tener ámbito global o ámbito de función. Las estructuras
SalidaLa instrucción Puede utilizarse con:
EntradaLa instrucción Puede leer una o varias variables en una misma instrucción y determina automáticamente el tipo del valor introducido.
También es posible leer varios valores:
La instrucción Secuencias de escapeLas cadenas admiten las siguientes secuencias de escape:
Por ejemplo:
ArreglosLos arreglos en CLRS son dinámicos. Pueden inicializarse directamente mediante una lista de valores entre corchetes:
También pueden construirse o ampliarse asignando valores directamente a sus posiciones:
Su tamaño y estructura se determinan conforme se inicializan o utilizan nuevas posiciones. CLRS también admite arreglos multidimensionales mediante arreglos anidados:
También pueden construirse mediante índices:
Es posible asignar arreglos completos entre variables. La asignación copia el contenido correspondiente.
Estructuras selectivasCLRS dispone de una única estructura principal de selección: Puede combinarse con
También pueden encadenarse varias condiciones:
Los bloques de código se delimitan mediante indentación, por lo que debe mantenerse una estructura consistente. OperadoresCLRS incluye operadores similares a los utilizados en otros lenguajes de programación. Aritméticos
Relacionales
Lógicos
Por ejemplo:
Estructura iterativa ascendenteLa variante
Resultado:
Estructura iterativa descendenteLa variante
Resultado:
Estructura iterativa condicionalLa estructura
FuncionesLas funciones se definen mediante:
La convención utilizada en CLRS consiste en escribir los nombres de las funciones en mayúsculas, utilizando
Las funciones pueden recibir cualquier cantidad de parámetros.
La instrucción Llamadas a funcionesUna función se invoca utilizando su nombre y sus argumentos:
Las llamadas también pueden utilizarse directamente dentro de expresiones:
Después de una llamada no debe agregarse un bloque indentado, ya que este podría interpretarse como la definición de una función. Arreglos como parámetrosLas funciones pueden recibir arreglos. Para indicar que un parámetro es un arreglo se especifica su número de dimensiones:
Para arreglos de dos dimensiones:
Al realizar la llamada, únicamente se utiliza el identificador del arreglo:
Función principalUna función llamada
No es necesario invocarla explícitamente.
se ejecuta automáticamente como punto de inicio del programa. Ejemplo funcional de códigoAlgoritmo clásico de ordenamiento burbuja.
DiagnósticosLos errores causados por el código CLRS se muestran en español y conservan la ubicación obtenida del código fuente.
📚 Biblioteca estándar de CLRSLa biblioteca estándar de CLRS proporciona funciones integradas para el manejo operaciones matemáticas, cadenas, arreglos y archivos. Archivos
Matemáticas
Cadenas
Arreglos
Tipos
Errores
🎨 Biblioteca de interfaces gráficas CLRSLa biblioteca gráfica permite crear ventanas, controles y cuadros de diálogo desde un programa CLRS. Utiliza funciones de la biblioteca estándar y conserva la sintaxis habitual del lenguaje. Cada componente se identifica mediante una cadena única dentro del programa. Ese identificador permite modificar sus propiedades, consultar su estado y conectar funciones a sus eventos. Operaciones fundamentales
CreaciónCada componente se crea mediante una función de la biblioteca y se registra con un identificador único de tipo Cadena proporcionado por el programa. El identificador funciona como el nombre mediante el cual CLRS localiza y administra internamente el componente.
Las funciones de creación no retornan el componente ni su identificador. El ID ya se proporciona como argumento y debe ser único entre todos los componentes registrados durante la ejecución. Intentar crear otro componente con un identificador existente produce un error. Creación de ventanas y contenedores
Creación de controles
Las funciones de creación no retornan nada. El argumento Creación de cuadros de diálogo
PropiedadesLas propiedades se consultan y modifican mediante:
En las tablas siguientes:
Valores enumerados utilizados por las propiedadesAlgunas propiedades aceptan un conjunto cerrado de cadenas. Deben utilizarse exactamente los valores indicados.
Propiedades comunes de componentes visualesTodos los componentes visuales admiten las siguientes propiedades. No se aplican a
Propiedades específicas por componenteLas siguientes propiedades se agregan a las propiedades comunes anteriores. Ventanas
Texto y entradas
Botones
Controles numéricos y progreso
Selección, fecha e imagen
Contenedores
Listas y tablas
Las celdas de Para
Propiedades de cuadros de diálogoLos cuadros de diálogo no heredan las propiedades comunes de los componentes visuales. Cuadros de diálogo
Ejemplo de
Los índices de opciones, filas, columnas, botones y filtros comienzan en cero. Acciones específicas por componente
Acciones de cuadros de diálogo
EventosLos eventos permiten asociar una función CLRS a una acción o cambio que ocurre sobre un componente. La conexión se realiza mediante
Cuando ocurre el evento La función conectada recibe siempre primero el identificador del componente que originó el evento y, según el tipo de evento, puede recibir después información adicional como texto, valores, índices, coordenadas o teclas.
Eventos comunes de componentes visualesLos siguientes eventos pueden conectarse a cualquier componente visual. No se aplican a
Eventos específicos por componente
Los eventos Devolver Tema y apariencia
Si el programa no configura un tema, se conserva la apariencia normal de GTK. La biblioteca no expone CSS ni estilos arbitrarios. Tema incluido en WindowsLa distribución GTK utilizada por CLRS en Windows incluye Adwaita como tema base.
GTK también puede utilizar otros temas instalados en el sistema. Esto se aplica tanto a Windows como a otros sistemas operativos. La disponibilidad de cada tema y de sus variantes clara u oscura depende del propio tema y del entorno donde se ejecute el programa. Ejemplo funcional de códigoInterfaz gráfica de usuario para cambiar el mensaje en una etiqueta.
Ejecución y exportaciónLa GUI requiere Node.js 22, 24 o 26 y GTK 4.10 o superior. Al ejecutar por primera vez un programa gráfico, CLRS prepara automáticamente una instalación privada de En Windows, la distribución compatible de Generar código JavaScript crea el proyecto en Para preparar y ejecutar el proyecto:
Para construir un ejecutable:
La distribución se genera en La validación nativa se realizó en Windows x64 con Node 24 y GTK 4.22.4. Las demás configuraciones cuentan con pruebas automatizadas de compatibilidad y regresión, pero no están certificadas nativamente. 📊 Análisis algorítmicoCLRS Kit Español incluye herramientas para estudiar el comportamiento teórico de un algoritmo directamente desde el código fuente. El análisis se divide en dos partes:
🧮 Análisis de costoEl análisis de costo permite observar cuánto trabajo aporta cada parte de un algoritmo. Las expresiones se generan automáticamente a partir del Árbol de Sintaxis Abstracta (AST).
Por ejemplo:
El analizador puede reconocer que el cuerpo del ciclo se ejecuta aproximadamente IteracionesEl analizador intenta determinar cuántas veces se ejecuta cada ciclo. Ciclos
|
| Funcionalidad | Descripción |
|---|---|
| Informe por función | Muestra el costo, su simplificación y la conclusión asintótica. |
| Mejor caso | Analiza el escenario de menor trabajo cuando puede determinarse. |
| Peor caso | Analiza el escenario de mayor trabajo cuando puede determinarse. |
| CodeLens | Muestra Ver análisis de complejidad sobre las funciones. |
| Ir al código fuente | Permite regresar directamente a la declaración analizada. |
| Verificación | Explica qué evidencia respalda la conclusión obtenida. |
Interpretación de los resultados
El informe distingue diferentes tipos de conclusiones.
| Resultado | Significado |
|---|---|
| Θ(f(n)) | Se determinó una cota ajustada para el crecimiento. |
| O(f(n)) | Se determinó una cota superior. |
| Ω(f(n)) | Se determinó una cota inferior. |
| Bajo condiciones | El resultado depende de ciertas hipótesis sobre la entrada o el algoritmo. |
| Cota estructural conservadora | La conclusión se obtiene únicamente a partir de la estructura demostrable del código. |
| No determinado | No existe evidencia suficiente para justificar una complejidad. |
Cuando el resultado no puede justificarse, la interfaz muestra:
No determinado
Simplificación asintótica
El clasificador puede:
- eliminar constantes;
- ignorar coeficientes constantes;
- combinar productos;
- reconocer ciclos anidados;
- seleccionar términos dominantes;
- conservar diferentes variables cuando existen varias medidas de entrada.
Por ejemplo:
3n² + 5n + 8
se clasifica como:
O(n²)
Complejidad multivariable
Cuando un algoritmo depende de varias entradas independientes, el análisis puede conservar diferentes variables.
Por ejemplo:
PROCESAR(A[], B[])
puede producir una clasificación como:
O(n + m)
donde n representa el tamaño de A y m el tamaño de B.
Complejidades reconocidas
El analizador puede determinar automáticamente muchas familias comunes:
| Complejidad | Soporte | Ejemplo típico |
|---|---|---|
| O(1) | ✅ | Operaciones constantes |
| O(n) | ✅ | Recorrido de un arreglo |
| O(n²) | ✅ | Dos ciclos anidados |
| O(n³) | ✅ | Tres ciclos anidados |
| O(nᵏ) | ✅ | Número fijo de ciclos anidados |
| O(log n) | ✅ | División repetida del tamaño |
| O(n log n) | ✅ | Combinación de trabajo lineal y logarítmico |
| O(2ⁿ) | ✅ | Algunas recurrencias con ramificación constante |
| O(n!) | ✅ | Algunas recurrencias con ramificación variable |
| Recurrencias | ⚠️ Parcial | Depende de que la estructura pueda demostrarse |
Sumatorias y ciclos dependientes
El analizador también puede reconocer algunas sumatorias cuyo número de iteraciones depende del índice.
Por ejemplo:
para i = 1 hasta n
para j = 1 hasta n / i
escribir j
La suma:
n/1 + n/2 + n/3 + ... + n/n
puede clasificarse como:
O(n log n)
Cuando la forma de la sumatoria no puede demostrarse de manera segura, el resultado permanece como No determinado.
Funciones recursivas
Las funciones recursivas se estudian mediante sus relaciones de recurrencia.
El analizador puede reconocer reducciones como:
T(n - 1)
T(n / 2)
2T(n / 2)
T(√n)
y algunas estructuras más complejas.
Según el caso, puede utilizar métodos como:
| Método | Uso principal |
|---|---|
| Sustitución | Reducciones aditivas sencillas |
| Teorema Maestro | Subproblemas del mismo tamaño |
| Akra–Bazzi | Algunas particiones desiguales |
| Raíces características | Algunas recurrencias ramificadas |
| Productos factoriales | Recurrencias donde el número de llamadas depende de n |
Ejemplos que pueden reconocerse:
T(n) = T(n - 1) + O(1)
T(n) = 2T(n / 2) + O(n)
T(n) = T(√n) + O(1)
En el último caso puede obtenerse:
O(log log n)
cuando las condiciones necesarias pueden demostrarse.
Recursión mutua
El analizador también estudia grupos de funciones que se llaman entre sí.
A(n)
B(n - 1)
B(n)
A(n - 1)
Estas relaciones se analizan mediante el grafo de llamadas.
Si el sistema no puede demostrar una reducción válida, un caso base o una familia de recurrencia soportada, el resultado permanece como:
No determinado
Informe de complejidad
El botón Mostrar informe de complejidad algorítmica abre una vista dedicada al análisis de las funciones del documento.
Cada función puede mostrar:
- Función de costo
- Simplificación algebraica
- Conclusión asintótica
- Verificación del resultado
Las expresiones matemáticas se muestran mediante KaTeX.
Cuando intervienen varias funciones, el informe puede mostrar también la cadena de llamadas utilizada para obtener el resultado.
PRINCIPAL
↓
ORDENAR
↓
PARTICIONAR
Desde el informe es posible regresar a la declaración correspondiente mediante Ir al código fuente.
Mejor y peor caso
Cuando la estructura del algoritmo permite distinguir diferentes comportamientos, el informe presenta por separado:
Mejor caso
y
Peor caso
Cada resultado indica además si se trata de:
- una cota ajustada;
- una cota superior o inferior;
- un resultado condicionado;
- una cota conservadora;
- un resultado no determinado.
Alcance del análisis
El análisis es deliberadamente conservador.
Una complejidad sólo se presenta cuando existe evidencia suficiente para justificarla. Algunos algoritmos, ciclos o recurrencias pueden permanecer como No determinado si su comportamiento no puede demostrarse automáticamente.
El análisis automático no sustituye el razonamiento manual. Su objetivo es proporcionar una referencia visual y ayudar a comprender cómo el código se relaciona con su función de costo y su crecimiento asintótico.
🧪 Marco de pruebas funcionales
El marco de pruebas funcionales permite comprobar de forma repetible que un programa CLRS se comporta como esperas. Las suites aparecen en el panel Pruebas de VS Code y utilizan el mismo analizador, runtime y depurador que la ejecución normal del lenguaje.
Una prueba CLRS sigue una idea sencilla:
Para estas líneas de entrada, el programa debe producir estas líneas de salida.
Las pruebas de proyectos propios se escriben como datos declarativos en archivos *.clrs-tests.json. No necesitas programar funciones de prueba ni utilizar una biblioteca adicional: describes los casos y CLRS Kit se encarga de descubrirlos, ejecutarlos, compararlos y presentar sus resultados.
En BROKER.95 no es necesario crear estos archivos para resolver un contrato. Sus casos públicos se proyectan automáticamente en el mismo panel y CIPHER conserva el contexto pedagógico del ejercicio. El formato declarativo está disponible principalmente para programas y ejercicios propios, donde mantener las pruebas como código facilita revisarlas, compartirlas y versionarlas.
Relación entre el programa y la prueba
Considera el programa suma.clrs:
PRINCIPAL()
a = 0
b = 0
leer a
leer b
escribir a + b
Un caso con esta definición:
{
"input": ["5", "8"],
"expectedOutput": ["13"]
}
entrega 5 al primer leer, 8 al segundo y espera una línea 13 producida mediante escribir.
- Cada elemento de
inputrepresenta una línea de entrada, en el mismo orden en que el programa la consume. - Cada elemento de
expectedOutputrepresenta una línea completa de salida, en el mismo orden en que debería mostrarse. input: []significa que el caso no proporciona entrada.expectedOutput: []significa que el programa no debería producir salida.
Crear una suite desde cero
- Guarda el programa que quieres probar, por ejemplo
suma.clrs. - Crea junto a él un archivo cuyo nombre termine en
.clrs-tests.json, por ejemplosuma.clrs-tests.json. - Declara la identidad de la suite, el programa relativo y su arreglo de casos.
- Agrega primero un caso normal cuyo resultado puedas calcular con claridad.
- Añade casos límite y casos que recorran decisiones diferentes.
- Selecciona un comparador distinto de
exactúnicamente cuando el comportamiento esperado lo requiera. - Guarda el archivo. VS Code lo validará y CLRS Kit lo descubrirá automáticamente en el panel Pruebas.
- Ejecuta un caso, la suite completa o todas las pruebas del proyecto.
También puedes partir de Paleta de comandos → Crear suite de pruebas CLRS o generar un proyecto completo mediante Crear proyecto CLRS.
Estructura completa de una suite
{
"version": 1,
"id": "suite:suma",
"name": "Pruebas de suma",
"program": "./suma.clrs",
"cases": [
{
"id": "case:positivos",
"name": "Suma dos números positivos",
"input": ["5", "8"],
"expectedOutput": ["13"],
"comparison": "number",
"timeoutMs": 5000
},
{
"id": "case:ceros",
"name": "Conserva el cero",
"input": ["0", "0"],
"expectedOutput": ["0"],
"comparison": "number"
},
{
"id": "case:signos-distintos",
"name": "Combina valores positivos y negativos",
"input": ["-3", "7"],
"expectedOutput": ["4"],
"comparison": "number"
}
]
}
Una suite apunta a un programa y puede contener tantos casos independientes como necesites.
Campos de la suite
| Campo | Obligatorio | Descripción |
|---|---|---|
$schema |
No | Referencia opcional a un JSON Schema. Normalmente no es necesaria porque VS Code valida automáticamente los archivos *.clrs-tests.json. |
version |
Sí | Versión del formato declarativo. El valor vigente es 1. |
id |
Sí | Identificador técnico y estable de la suite, por ejemplo suite:suma. Debe comenzar con un carácter alfanumérico y puede utilizar letras, números, ., _, :, / o -. |
name |
Sí | Nombre legible que aparecerá como raíz de la suite en el panel Pruebas. |
program |
Sí | Ruta relativa desde la suite hasta el archivo .clrs que será ejecutado. |
cases |
Sí | Arreglo de casos pertenecientes a la suite. Puede estar vacío mientras preparas la definición. |
Los campos adicionales no reconocidos se rechazan para evitar errores silenciosos en una definición.
Campos de cada caso
| Campo | Obligatorio | Valor predeterminado | Descripción |
|---|---|---|---|
id |
Sí | - | Identificador único dentro de la suite, por ejemplo case:positivos. Conviene conservarlo estable aunque después cambies el nombre visible. |
name |
Sí | - | Descripción breve del comportamiento que comprueba el caso. |
input |
Sí | - | Arreglo de líneas entregadas a las instrucciones leer. Cada elemento debe ser una cadena sin saltos de línea internos. |
expectedOutput |
Sí | - | Arreglo de líneas que el programa debería producir mediante escribir. |
comparison |
No | exact |
Estrategia utilizada para comparar la salida obtenida con la esperada. |
timeoutMs |
No | 5000 |
Tiempo máximo del caso en milisegundos. Admite valores entre 1 y 60000. |
Elegir casos útiles
Una suite pequeña suele comenzar con tres tipos de casos:
- Caso normal: una entrada representativa del uso esperado.
- Caso límite: cero, colección vacía, un único elemento, valor mínimo o límite de una condición.
- Camino alternativo: una entrada que obligue a tomar otra rama de una decisión o a no entrar en un ciclo.
Por ejemplo, para una condición si edad >= 18, una suite útil debería comprobar al menos un valor mayor, uno menor y el límite exacto 18. Las pruebas deben basarse en lo que el programa promete hacer, no en los pasos internos concretos de una implementación actual.
Comparadores disponibles
Si omites comparison, se utiliza exact. Los demás comparadores permiten expresar con precisión qué diferencias son relevantes para el ejercicio.
| Comparador | Qué comprueba | Forma de expectedOutput |
|---|---|---|
exact |
Texto idéntico, incluidos espacios y saltos de línea. | ["Hola"] |
trimmed |
Texto igual después de ignorar espacios exteriores. | ["Hola"] |
normalized-whitespace |
Texto igual después de normalizar bloques de espacios, tabulaciones y saltos. | ["uno dos"] |
lines |
Las mismas líneas en el mismo orden; considera equivalentes los saltos LF y CRLF. | ["primera", "segunda"] |
unordered-lines |
Las mismas líneas en cualquier orden, conservando las repeticiones. | ["rojo", "verde"] |
number |
Un único número finito, sin texto adicional. | ["13"] |
number-tolerance |
Un número dentro de una tolerancia absoluta. | ["3.14 ± 0.01"] o ["3.14 +/- 0.01"] |
json |
Igualdad estructural de un valor JSON; el orden de las propiedades de un objeto no importa. | ["{\"a\":1,\"b\":2}"] |
array-ordered |
Igualdad estructural de un arreglo JSON respetando posiciones y duplicados. | ["[1,2,3]"] |
array-unordered |
Igualdad estructural de un arreglo JSON sin exigir orden, pero conservando duplicados. | ["[1,2,3]"] |
boolean |
Un valor lógico equivalente a true, false, VERDAD o FALSO. |
["VERDAD"] |
contains |
La salida contiene el fragmento esperado. | ["resultado: 13"] |
regex-safe |
La salida satisface una expresión regular lineal y acotada. | ["^item-\\d+$"] |
regex-safe está deliberadamente limitado: no admite grupos, alternancias, referencias internas ni más de un cuantificador. Para resultados estructurados conviene preferir json, array-ordered o array-unordered en lugar de comparar manualmente su representación textual.
Ejemplo de tolerancia numérica:
{
"id": "case:aproximacion",
"name": "Acepta una aproximación de pi",
"input": [],
"expectedOutput": ["3.1416 ± 0.001"],
"comparison": "number-tolerance"
}
Descubrimiento, ejecución y depuración
Después de guardar una suite válida:
- abre el panel Pruebas desde la barra de actividad de VS Code;
- localiza la suite y expande sus casos;
- utiliza Ejecutar sobre un caso para aislarlo o sobre la suite para comprobarlos todos;
- utiliza Depurar sobre un caso para iniciar el DAP con su entrada declarada;
- corrige el programa y vuelve a ejecutar sin modificar manualmente la entrada cada vez.
La depuración conserva puntos de interrupción, ejecución paso a paso, pila de llamadas y variables. Cada caso se ejecuta de forma independiente con su propia entrada, timeout y evidencia.
Resultados, divergencias y cobertura
Cuando una prueba falla, su resultado puede mostrar:
- entrada utilizada;
- salida esperada;
- salida obtenida;
- primera diferencia encontrada;
- explicación pedagógica determinista;
- ubicación relacionada en el código;
- duración y estado de ejecución.
La cobertura registra qué instrucciones, declaraciones y resultados de decisión fueron recorridos. VS Code puede mostrar la cobertura de un caso o la acumulada por varias pruebas, y el diagrama de flujo proyecta la misma evidencia como nodos ejecutados, parciales o no recorridos.
Una cobertura alta no demuestra por sí sola que el programa sea correcto: indica qué partes fueron ejecutadas y ayuda a descubrir caminos que todavía no poseen un caso representativo.
Si una suite no aparece
Comprueba que:
- el nombre termine exactamente en
.clrs-tests.json; programsea una ruta relativa hacia un archivo.clrsexistente;- todos los campos obligatorios estén presentes;
- los identificadores de suite y caso no estén repetidos;
inputyexpectedOutputsean arreglos de cadenas;- el formato de
expectedOutputsea válido para el comparador seleccionado.
🗺️ Generador de diagramas de flujo
El generador de diagramas de flujo convierte automáticamente el código CLRS en una representación visual del flujo del programa.
El diagrama se abre dentro de Visual Studio Code y permanece sincronizado con el archivo mientras trabajas.
Abrir el diagrama
Puedes abrirlo desde:
- Paleta de comandos →
Mostrar diagrama de flujo
El diagrama aparecerá en un panel junto al editor.
Sincronización con el código
El diagrama se actualiza automáticamente cuando modificas el archivo.
También se sincroniza con la posición del cursor:
- La instrucción actual se resalta en el diagrama.
- Al seleccionar un nodo, el editor puede llevarte a su línea correspondiente.
- No es necesario regenerar manualmente el diagrama después de cada cambio.
Esto permite utilizar el diagrama como una representación visual del código mientras programas.
Editar el código desde el diagrama
Las figuras y algunas flechas del diagrama pueden seleccionarse para modificar el código de una forma visual.
Al seleccionar una figura puedes:
- cambiar sus valores o expresiones;
- utilizar Ir para abrir su línea en el editor;
- eliminar la instrucción o el bloque que representa.
Al seleccionar una flecha compatible puedes insertar una nueva asignación, entrada, salida, decisión, ciclo, retorno o llamada a función en ese punto del flujo.
El botón ƒ permite agregar una función nueva al documento completo. Antes de aplicar cada cambio se comprueba que el código resultante continúe siendo válido, y las ediciones pueden deshacerse normalmente desde Visual Studio Code.
Diagramar sólo una parte del código
Si seleccionas un fragmento antes de abrir el generador, se crea un diagrama únicamente para esa selección.
Esto resulta útil para estudiar:
- una función;
- un ciclo;
- un condicional;
- una sección concreta de un programa grande.
El contenido seleccionado permanece como ámbito del diagrama durante esa sesión.
Elementos compatibles
El generador reconoce las principales estructuras de CLRS.
| Elemento | Soporte |
|---|---|
PRINCIPAL |
✅ |
| Funciones | ✅ |
| Llamadas a funciones | ✅ |
| Asignaciones | ✅ |
leer |
✅ |
escribir |
✅ |
si |
✅ |
sino si |
✅ |
sino |
✅ |
mientras |
✅ |
para |
✅ |
retornar |
✅ |
Las funciones se muestran como subgrafos independientes, facilitando la lectura de programas con varias funciones.
Apariencia
El diagrama puede adaptarse visualmente desde su barra de herramientas.
El tema predeterminado es VS Code, por lo que utiliza los colores del tema activo del editor.
Esto permite que el diagrama se adapte automáticamente a:
- temas claros;
- temas oscuros;
- temas de alto contraste.
También están disponibles otros estilos:
| Tema |
|---|
| VS Code |
| Clásico |
| Moderno |
| Pastel |
| Sobrio |
| Oscuro |
Los cambios se aplican inmediatamente.
Dirección del flujo
Puedes cambiar la orientación del diagrama.
| Dirección | Descripción |
|---|---|
| Vertical | Flujo de arriba hacia abajo |
| Horizontal | Flujo de izquierda a derecha |
La orientación se aplica tanto al flujo principal como a las funciones.
Navegación
El diagrama puede explorarse de forma interactiva.
Entre las acciones disponibles se encuentran:
- acercar y alejar con zoom;
- desplazar el diagrama;
- ajustar todo el contenido al panel;
- centrar el nodo actual;
- abrir una instrucción directamente en el editor;
- navegar entre nodos mediante teclado;
- consultar la línea y columna de una instrucción.
Esto facilita trabajar con diagramas grandes sin perder la referencia del código original.
Buscar nodos
El campo Buscar nodo… permite localizar contenido dentro del diagrama.
La búsqueda puede encontrar:
- texto de instrucciones;
- identificadores;
- tipos de nodo;
- referencias.
No distingue entre mayúsculas, minúsculas o tildes.
Controles disponibles:
| Acción | Control |
|---|---|
| Siguiente resultado | Enter o ↓ |
| Resultado anterior | Mayús + Enter o ↑ |
Las coincidencias se resaltan y la coincidencia activa se centra automáticamente.
Mostrar sólo una parte del flujo
La opción Flujo visible permite seleccionar qué parte del programa quieres visualizar.
Puedes mostrar:
- todo el programa;
- flujo principal;
- flujo global;
- una función concreta.
Cuando una función se muestra de forma aislada, la sincronización con el código sigue funcionando.
Si exportas el diagrama en ese momento, sólo se exportará el flujo visible.
Minimapa
El minimapa muestra una vista general del diagrama.
Permite:
- conocer qué parte del diagrama estás observando;
- seguir el zoom y desplazamiento;
- moverte rápidamente haciendo clic en otra zona.
Puede mostrarse u ocultarse desde la barra de herramientas.
Visualización de la ejecución
El diagrama también puede mostrar el recorrido real de un programa mientras se ejecuta.
Con el diagrama abierto, utiliza:
Ejecutar código CLRS
La ejecución continúa realizándose normalmente en la terminal integrada.
Por lo tanto, características como:
leer;escribir;- errores de ejecución;
mantienen su comportamiento habitual.
Durante la ejecución
El diagrama muestra visualmente el recorrido realizado por el programa.
| Estado | Comportamiento |
|---|---|
| Nodo actual | Se resalta y se centra automáticamente |
| Nodos visitados | Permanecen señalados |
| Ejecución correcta | Se muestra como finalización correcta |
| Error | Se identifica el último nodo alcanzado |
| Interrupción | La ejecución se marca como interrumpida |
Esto permite observar el algoritmo como una secuencia de pasos reales.
Revisar la traza
Después o durante la ejecución puedes revisar el recorrido mediante los controles inferiores.
Entre las acciones disponibles se encuentran:
- ir al primer paso;
- paso anterior;
- reproducir;
- pausar;
- paso siguiente;
- regresar al paso más reciente.
La reproducción admite diferentes velocidades:
0.5×
1×
2×
Cuando estás situado en el paso más reciente, los nuevos eventos pueden seguirse en vivo.
La traza corresponde al código ejecutado
La traza pertenece exactamente a la versión del archivo que fue ejecutada.
Si modificas el código después de la ejecución, la traza anterior se descarta para evitar mostrar pasos que ya no corresponden con el nuevo programa.
El diagrama y el depurador funcionan de manera independiente.
Límite de la traza
Por seguridad, el panel conserva como máximo:
10 000 pasos
Si el programa supera esta cantidad, la ejecución continúa normalmente, pero el diagrama indica que la traza fue limitada.
Exportar el diagrama
Los diagramas pueden exportarse como archivos SVG.
Utiliza:
- Paleta de comandos →
Exportar diagrama de flujo SVG
Después selecciona la ubicación y el nombre del archivo.
El formato SVG puede ampliarse sin perder calidad.
Es especialmente útil para:
- documentación;
- reportes;
- presentaciones;
- tareas;
- proyectos académicos.
Exportación de vistas parciales
Si estás visualizando únicamente una función o un flujo específico, la exportación genera solamente esa parte del diagrama.
Esto permite crear diagramas individuales de funciones sin tener que modificar el código fuente.
Consideraciones
- Los diagramas se generan a partir del Árbol de Sintaxis Abstracta (AST) del programa.
- El código debe ser sintácticamente válido para poder generar el diagrama.
- Las funciones se organizan automáticamente como subgrafos.
- La vista se mantiene sincronizada con el documento mientras trabajas.
- El diagrama de ejecución normal y el depurador funcionan de forma independiente.
- Si el código cambia, las trazas antiguas se descartan para evitar mostrar información incorrecta.
Uso práctico
El generador puede utilizarse principalmente para tres tareas:
| Uso | Para qué sirve |
|---|---|
| Comprender | Visualizar cómo se organiza el flujo del algoritmo |
| Revisar | Seguir condiciones, ciclos, funciones y llamadas |
| Documentar | Exportar diagramas para reportes o proyectos |
El objetivo del generador no es sustituir la lectura del código, sino hacer visible su estructura y su ejecución de una forma más fácil de seguir.
🎮 Videojuego BROKER.95
BROKER.95 es un videojuego educativo integrado en CLRS Kit Español.
Su objetivo es convertir la práctica de programación en una experiencia basada en contratos, progresión, recompensas, riesgo y aprendizaje. El código continúa escribiéndose normalmente en el editor de Visual Studio Code.
Puedes abrirlo mediante:
- Paleta de comandos →
Jugar BROKER.95 - El botón con icono de mando disponible en documentos
.clrs
CIPHER
Dentro del juego interactúas con CIPHER, una inteligencia artificial que participa como:
- generador de contratos;
- tutor durante la resolución;
- asistente para dudas;
- evaluador de entregas.
CIPHER puede ayudarte a comprender errores y orientar tu solución, pero el progreso del juego depende de los resultados obtenidos al resolver los contratos.
Contratos
Los contratos representan problemas de programación que debes resolver utilizando CLRS.
Cada contrato puede incluir:
- descripción del problema;
- requerimientos;
- casos de prueba;
- recompensa potencial;
- nivel de riesgo.
El flujo principal es:
OBTENER CONTRATO
↓
ACEPTAR
↓
PROGRAMAR EN CLRS
↓
REVISAR
↓
ENTREGAR
↓
RESULTADO Y RECOMPENSA
Los contratos pueden abarcar desde ejercicios elementales hasta problemas algorítmicos más avanzados.
Riesgo y recompensa
Los contratos pueden tener diferentes niveles de riesgo:
| Riesgo | Enfoque general |
|---|---|
| Bajo | Problemas sencillos |
| Medio | Mayor variedad de casos |
| Alto | Soluciones más exigentes |
| Extremo | Problemas algorítmicos avanzados |
Una mejor resolución puede producir una mayor recompensa.
El juego también mantiene elementos como:
- saldo;
- alerta;
- contratos completados;
- contratos fallidos;
- estadísticas;
- progreso.
Aprendizaje
BROKER.95 incluye un modo de aprendizaje estructurado en dos rutas:
| Ruta | Lecciones |
|---|---|
| Programación | 50 |
| Algoritmia | 57 |
Programación está disponible desde el inicio.
Algoritmia se desbloquea después de completar la ruta de Programación.
Ruta de aprendizaje
Cada ruta se presenta como un recorrido progresivo formado por secciones y lecciones.
Las lecciones pueden incluir:
- objetivo;
- explicación;
- ejemplos en CLRS;
- conceptos nuevos;
- notas;
- ejercicios prácticos.
El progreso se conserva y las lecciones se desbloquean de forma secuencial.
Ejercicios educativos
Desde una lección puedes solicitar un ejercicio relacionado con los conocimientos estudiados hasta ese momento.
Los ejercicios:
- mantienen una dificultad reducida;
- utilizan conocimientos ya introducidos;
- evitan conceptos futuros;
- se evalúan principalmente por su funcionamiento;
- pueden recomendar herramientas de CLRS como apoyo, pero nunca exigirlas.
Ayuda durante un contrato
BROKER.95 dispone de varias formas de interactuar con CIPHER.
| Comando | Función |
|---|---|
ai -review |
Revisa tu solución y proporciona orientación |
ai -ask [pregunta] |
Permite hacer una pregunta sobre el contrato y tu código |
ai -push |
Entrega la solución para su evaluación |
ai -ask está pensado para resolver dudas sin entregar ni evaluar todavía el contrato.
Terminal de BROKER.95
El juego incluye una terminal propia para administrar contratos.
Algunos comandos principales son:
| Comando | Acción |
|---|---|
ai -gameinfo |
Explica cómo funciona BROKER.95 |
ai -new |
Solicita un nuevo contrato |
ai -get |
Muestra los contratos disponibles |
ai -read <id> |
Consulta un contrato |
ai -set <id> |
Acepta un contrato |
ai -review |
Solicita una revisión |
ai -ask |
Pregunta a CIPHER |
ai -push |
Entrega la solución |
ai -info |
Muestra el estado actual de la partida |
Si el usuario no tiene experiencia en el uso de una terminal de comandos, se proporciona un acercamiento muy básico e intuitivo para que consiga familiarizarse con este tipo de sistema.
El código sigue en Visual Studio Code
BROKER.95 no incluye un editor de código independiente.
Los programas se escriben directamente en archivos .clrs utilizando el editor habitual de Visual Studio Code.
Esto permite utilizar junto al juego las demás herramientas de CLRS Kit Español, como:
- diagnósticos;
- ejecución;
- depuración;
- diagramas de flujo;
- análisis algorítmico.
BROKER.95 funciona como una capa de práctica y aprendizaje alrededor del entorno normal de CLRS, no como un sustituto del editor.
Modelos de IA
CIPHER puede utilizar diferentes proveedores de IA o un modelo local.
Entre las opciones disponibles se encuentran:
- OpenAI;
- Groq;
- Gemini;
- DeepSeek;
- xAI;
- Together AI;
- Z.AI;
- Hugging Face;
- OpenRouter;
- Ollama local;
- LM Studio local.
La configuración se realiza desde el propio panel de BROKER.95.
Tus claves de acceso se guardan de forma segura en tu sistema. La extensión sólo las utiliza para conectarse al proveedor que elijas; no las publica ni las comparte con otros proveedores. Si eliges un proveedor remoto, tus consultas y el código necesario para ayudarte se envían a ese proveedor.
Se recomienda ampliamente un modelo igual o superior a 7B de parámetros para una experiencia rápida y respuestas precisas.
Progreso persistente
La partida conserva automáticamente información como:
- dinero;
- alerta;
- contratos;
- estadísticas;
- progreso educativo;
- mejores resultados.
El progreso de Programación y Algoritmia se mantiene de forma independiente.
Objetivo de BROKER.95
BROKER.95 busca transformar la práctica repetida de programación en una experiencia más motivadora mediante:
APRENDER
↓
RECIBIR UN RETO
↓
PROGRAMAR
↓
COMPROBAR
↓
RECIBIR RETROALIMENTACIÓN
↓
MEJORAR
↓
PROGRESAR
La idea central no es sustituir el aprendizaje tradicional, sino ofrecer un entorno donde practicar programación y algoritmia mediante problemas concretos, progresión y retroalimentación continua.