¿Qué es la edición colaborativa de código?

La edición colaborativa de código permite que varios desarrolladores trabajen en el mismo código al mismo tiempo, cada uno desde su propio navegador. Es útil para programar en pareja, hacer entrevistas, enseñar y depurar fragmentos de código en conjunto, sin configurar un IDE compartido ni intercambiar archivos.

Para mantener idéntica la copia de todos, los cambios se envían como pequeñas ediciones en lugar de archivos completos, y un servidor decide el orden en que se aplican. Las ediciones realizadas al mismo tiempo se ajustan entre sí para que se conserven ambas.

Descripción de la herramienta

Esta herramienta es un editor compartido de TypeScript con resaltado de sintaxis. Ábrelo y comparte el enlace: todos los participantes de la sala editan el mismo código en tiempo real, ven los cursores de los demás y pueden validar o dar formato al código para todos con un solo clic.

La validación comprueba la sintaxis con el analizador de Babel y su complemento de TypeScript, por lo que reconoce anotaciones de tipos, interfaces, genéricos y enumeraciones. El formato utiliza el analizador de TypeScript de Prettier, y el código formateado reemplaza solo las líneas que cambiaron, de modo que lo que los demás escriban mientras tanto permanezca en su lugar.

Funciones

  • Edición en tiempo real: los cambios de todos aparecen al instante y se combinan cuando varias personas escriben al mismo tiempo.
  • Cursores y selecciones: observa dónde está cada persona, con el color que aparece junto a su nombre.
  • Validar: comprueba la sintaxis de TypeScript y muestra el primer error con su línea y columna.
  • Dar formato: vuelve a dar formato al código con Prettier para todos los participantes de la sala.
  • Copiar y descargar: guarda una copia del código como archivo .ts.

Cómo funciona

Al abrir la página, se crea una sala en el servidor de sincronización y su enlace aparece en la barra de direcciones. Todas las personas que abren el enlace se unen a la misma sala y ven el mismo documento.

Cada cambio se envía al servidor como una pequeña descripción de lo que cambió —qué caracteres se insertaron o eliminaron y dónde— en lugar de enviar todo el texto. El servidor establece un orden único para los cambios de todos, reubica los cambios realizados sobre una versión anterior para que se apliquen después de los que llegaron primero y envía el resultado a los demás. Lo que escribes aparece de inmediato, y los cambios de los demás se combinan con lo tuyo, para que no se pierda lo que nadie escribe cuando dos personas editan al mismo tiempo.

El documento se conserva únicamente en la memoria del servidor mientras la sala está abierta. Si vuelves a cargar la página, regresas a la sala con el texto tal como estaba; cuando todos se hayan ido, la sala y su texto desaparecerán.

Limitaciones

  • Una sala admite hasta 20 personas y 100.000 caracteres.
  • No se guarda nada cuando se cierra una sala. Descarga el texto antes de que se vaya la última persona.
  • Los cambios demasiado rápidos o demasiado grandes, como pegar el documento completo muchas veces seguidas, se rechazan y el editor vuelve a cargar el texto de la sala.
  • Si abres el enlace de una sala en otro de los editores colaborativos (por ejemplo, una sala de SQL en el editor de JavaScript), aparece el mensaje «Sala no encontrada»: cada sala corresponde a un solo lenguaje.
  • La validación solo comprueba la sintaxis, no los tipos: el código que no compilaría debido a un error de tipos aun así pasa la validación. JSX (.tsx) no es compatible.