Launch HN: Haystack (YC S24) – tecnología para visualizar y editar código en un lienzo infinito

 (github.com/haystackeditor)
2 puntos por GN⁺ 2024-09-27 | 1 comentarios | Compartir por WhatsApp
  • Haystack Editor es un producto que combina la simplicidad de un editor de código con una UI de lienzo para que el código sea más fácil de entender de un vistazo, y se desarrolla en este repositorio junto con la comunidad
  • El repositorio publica no solo el código y los issues, sino también la hoja de ruta, y el código fuente se ofrece bajo PolyForm Strict License 1.0.0
  • La distribución del producto adopta la base del repositorio con ciertas personalizaciones añadidas, y se ofrece bajo términos de servicio separados
  • Algunos ejemplos de funciones son Canvas Workspaces, Explorer View, Keyboard Navigation y Generate Function, e incluye soporte integral para edición, exploración y comprensión de código, depuración ligera, un modelo de extensiones robusto e integración ligera con herramientas existentes
  • Haystack se actualiza cada semana con nuevas funciones y correcciones de errores, y puede descargarse para Windows, macOS y Linux

Rol del repositorio de Haystack Editor

  • Este repositorio es el espacio donde Haystack Software desarrolla el producto Haystack Editor junto con la comunidad
  • Además del trabajo sobre código e issues, también publica la roadmap
  • El código fuente se ofrece bajo PolyForm Strict License 1.0.0

Producto Haystack Editor

  • Haystack Editor es la distribución del repositorio Haystack Editor e incluye ciertas personalizaciones
  • La distribución se publica bajo terms of service separados
  • El producto combina la simplicidad de un editor de código con una UI de lienzo para que el código sea más fácil de entender de un vistazo
  • El alcance del soporte incluye lo siguiente
    • Edición de código integral
    • Exploración de código
    • Soporte para comprensión de código
    • Depuración ligera
    • Un modelo de extensiones rico
    • Integración ligera con herramientas existentes
  • Haystack se actualiza cada semana con nuevas funciones y correcciones de errores
  • Las descargas para Windows, macOS y Linux están disponibles en el sitio web de Haystack

Vista previa de funciones

  • Ofrece la función Canvas Workspaces
  • Ofrece la función Explorer View
  • Ofrece la función Keyboard Navigation
  • Ofrece la función Generate Function

Contribuciones y canales de retroalimentación

  • Hay varias formas de participar en el proyecto
  • Para contribuir directamente a la base de código, consulta el documento How to Contribute
    • Cómo compilar y ejecutar desde el código fuente
    • Flujo de trabajo de desarrollo, incluida la depuración y la ejecución de pruebas
    • Envío de PR
    • Cómo encontrar issues en los que trabajar
  • Los canales de retroalimentación son los siguientes

Proyectos relacionados y extensiones incluidas

  • Varios componentes y extensiones clave de Haystack están en repositorios separados en GitHub
  • Por ejemplo, el node debug adapter y el mono debug adapter están en repositorios distintos
  • Otro ejemplo es el repositorio de Pixi
  • Haystack incluye varias extensiones integradas en la carpeta extensions
    • Incluye gramáticas y snippets para varios lenguajes
    • Las extensiones que ofrecen soporte de lenguaje avanzado, como autocompletado de código o Go to Definition, usan el sufijo language-features
    • Por ejemplo, la extensión json ofrece coloreado de JSON, y la extensión json-language-features ofrece soporte de lenguaje avanzado para JSON

Lecturas relacionadas

1 comentarios

 
GN⁺ 2024-09-27
Opiniones de Hacker News

  • Esta idea ha sido excelente desde hace décadas. Espero que Haystack tenga éxito, igual que muchos intentos anteriores, y la ejecución inicial se ve prometedora.
    Aun así, parece que habrá muchos obstáculos, como que sea difícil identificar llamadores/llamados o que las preferencias de UX varíen entre desarrolladores. Siempre he pensado que podría ser más potente en un espacio mucho más amplio que una pantalla 2D, por ejemplo en un entorno como un casco de VR.

    • Me encanta la idea de un mundo Haystack VR. Es una lástima que el software de VR esté en un estado inestable por factores biológicos, pero creo que algún día será el futuro.

  • Muy genial. Me imaginé todo el codebase de una organización mapeado así, viéndose a través de múltiples frameworks y lenguajes.
    No sé si se me pasó en el video o si todavía no es posible, pero conectar nodos manualmente es demasiado trabajo; sería bueno tener un bot sencillo que se ejecute sobre una carpeta del repositorio y automatice la visualización. Lo agrego a mi lista de interés.
    Yo apuntaría a grandes organizaciones empresariales o grupos de TI de gobiernos locales que estén haciendo o planeando una transformación digital. Necesitan orientarse y entender el significado entre trabajo legacy y trabajo nuevo.
    Si sale bien, Salesforce podría tocarlos en menos de un año. Parece encajar bastante bien con su visión y su portafolio de productos.

    • Me gustó el concepto que vi en el video. Pero quiero verlo más grande, con más ventanas y todo conectado.
      No sé si en ese estado sería realmente usable, pero sería divertido intentarlo. Se siente como un diagrama UML de todo el codebase, con miles de flechas.
      Entonces podrías decirle a un compañero que el archivo que debe modificar está por ahí arriba a la derecha, y como las diferencias de Git también se ven visualmente, podrías hacer zoom en los cambios dispersos.
    • Si navegas siguiendo archivos o símbolos, las conexiones se agregan automáticamente. No sé si eso es exactamente a lo que te referías, pero intentamos ofrecerle al usuario un “flujo” a partir de consultas en lenguaje natural.
      Por ejemplo, procesar una pregunta como: “qué pasa desde el momento en que hago clic con el mouse en el botón de suscripción hasta el backend”.
    • Sería interesante si también pudiera “conectar” llamadas a API que van a servicios distintos.

  • Me pregunto si este proyecto se inspiró en Light Table.
    Como solicitud de funcionalidad, me gustaría que la visualización se extendiera más allá de 2D. Los sistemas realmente complejos suelen ser grafos sofisticados, o, dicho con cariño, una maraña de hilos, y por experiencia una visualización plana 2D no alcanza.
    Sería bueno tener algo como una visualización de esferas concéntricas, con servicios de borde en las capas externas y servicios core/de dominio en las internas.

    • Mucha gente mencionó Light Table, pero solo lo conocimos después del lanzamiento.
      Es interesante que hables de una vista más cercana a 3D. Hemos pensado en esa idea, pero hacerla bien de una forma que los usuarios puedan entender es realmente difícil. Aun así, definitivamente forma parte de la visión a futuro.
      Edición: eliminé la especulación sobre Light Table porque no era cierta.
    • Espero que no solo conozcan Light Table de los años 2010, sino también Oberon de fines de los 80. Oberon también tenía la capacidad de colocar código sobre un lienzo sin bordes.

  • Pregunta tangencial grande: ¿hay algún lienzo infinito open source que sea representativo y usable? Estoy creando un juego de cartas y necesito un lienzo infinito multijugador. Me gustaría recibir recomendaciones.

  • Si hubiera sido una extensión de VSCode, creo que la habría probado. Quiero usarla, pero últimamente vivo dentro de Cursor.

    • Parece un problema que se está haciendo cada vez más grande.

  • Me pregunto por qué no puede hacerse como extensión. La idea es realmente buena, y puedo imaginarla perfectamente dentro de una pestaña del área del editor.
    Así también podrías tener varias pestañas de Haystack, lo que haría mucho más fácil cambiar de contexto. Aunque esté basada en VSCode, tener que instalar otro IDE es un poco lamentable. De todos modos, espero que sigan avanzando.

    • Las extensiones de VS Code son bastante limitadas. Puedes cambiar el renderizador de una pestaña del editor, pero en la práctica es difícil hacer que varios elementos dentro de una interfaz personalizada se traten como pestañas de editor de primera clase en todo el entorno y el ecosistema de extensiones. Si no se quedan atrás, un fork es una opción razonable.
    • Entiendo esa frustración. Como dije en otro comentario, es bastante difícil hacer que Haystack sea lo suficientemente bueno como extensión, pero al final también planeamos explorar ese camino.
    • Si las extensiones tienen restricciones, una buena solución alternativa podría ser una función para activar y desactivar la vista de lienzo. Uno querría alternar entre el lienzo y la vista estándar de VSCode; si eso es posible dentro de Haystack, no haría falta instalar ambos.

  • Me recuerda al entorno Kansas del lenguaje de programación Self. Hay un video que Sun hizo en 1995.
    https://www.youtube.com/watch?v=Ox5P7QyL774
    Después de ese video se agregaron funciones de búsqueda más interesantes.

  • Realmente me gusta. Es casi igual al proceso que sigo cuando miro un codebase grande, pero mucho más limpio y organizado.
    Normalmente abro cinco o seis terminales apuntando a varios archivos fuente e intento construir un mapa en mi cabeza. Al final logro hacerme una idea, pero es un proceso difícil; una herramienta así sería de muchísima ayuda. Ahora solo falta combinarla con un monitor ultraancho.

  • Creo que ayudaría porque reduce lo que hay que mantener en la cabeza, pero la UI actual tiene demasiada dependencia del mouse. Sería bueno crear atajos de teclado y hacer que las ventanas se “tileen” como en el window manager dwm, para no tener que ajustar manualmente el tamaño de las ventanas.

    • De hecho, intentamos que el lienzo pueda navegarse con teclado tanto como sea posible. En el botón “Keybindings and Help” de abajo a la derecha está la lista de keybindings.
      En cuanto al ajuste manual de tamaño, estamos probando tiling dentro del viewport. Si nos cuentas qué te obliga a cambiar tamaños, creo que podríamos corregirlo.

  • Parece un enfoque cómodo para que los desarrolladores desplieguen y mapeen el código en un espacio bidimensional. Esto se parece al método de loci[1], donde el desarrollador codifica espacialmente fragmentos de código y conexiones de forma elaborada para reforzar la memoria y mejorar la comprensión.
    Por eso me atrevo a sugerir agregar una opción de patrones de fondo que aporten un poco de información sin distraer. No tengo un patrón específico, pero si el fondo fuera un mapa del mundo, los usuarios podrían recordar más rápido la ubicación que buscan y orientarse más rápido.
    En la misma línea, también valdría la pena considerar permitir que el usuario defina colores para los bordes de las pestañas o agregue ruido distinto a cada pestaña. El ruido podría desvanecerse según el nivel de zoom y la distancia al centro del viewport.
    https://en.wikipedia.org/wiki/Method_of_loci

    • Planeamos agregar un minimapa para ayudar a los usuarios a orientarse.
      También es interesante la idea de usar diferencias sutiles de color o sonido. Lo vamos a pensar.