Launch HN: Haystack (YC S24) – tecnologia para visualizar e editar código em uma tela infinita

 (github.com/haystackeditor)
2 pontos por GN⁺ 2024-09-27 | 1 comentários | Compartilhar no WhatsApp
  • O Haystack Editor é um produto que combina a simplicidade de um editor de código com uma UI em canvas para facilitar a compreensão do código de relance, e é desenvolvido neste repositório junto com a comunidade
  • O repositório publica não só código e issues, mas também o roadmap, e o código-fonte é disponibilizado sob a PolyForm Strict License 1.0.0
  • A distribuição do produto é baseada no repositório com customizações específicas e é oferecida sob termos de serviço separados
  • Exemplos de recursos incluem Canvas Workspaces, Explorer View, Keyboard Navigation e Generate Function, além de suporte abrangente para edição, navegação e compreensão de código, depuração leve, um modelo de extensões e integrações leves com ferramentas existentes
  • O Haystack é atualizado semanalmente com novos recursos e correções de bugs, e está disponível para download para Windows, macOS e Linux

Papel do repositório do Haystack Editor

  • Este repositório é o espaço onde a Haystack Software desenvolve o produto Haystack Editor junto com a comunidade
  • Além do trabalho em código e issues, o roadmap também é público
  • O código-fonte é disponibilizado sob a PolyForm Strict License 1.0.0

Produto Haystack Editor

  • Haystack Editor é a distribuição do repositório Haystack Editor e inclui customizações específicas
  • A distribuição é lançada sob terms of service separados
  • O produto combina a simplicidade de um editor de código com uma UI em canvas para tornar o código mais fácil de entender de relance
  • O escopo de suporte inclui:
    • edição de código abrangente
    • navegação pelo código
    • suporte à compreensão do código
    • depuração leve
    • um modelo rico de extensões
    • integração leve com ferramentas existentes
  • O Haystack é atualizado semanalmente com novos recursos e correções de bugs
  • Downloads para Windows, macOS e Linux estão disponíveis no site do Haystack

Prévia dos recursos

  • Oferece o recurso Canvas Workspaces
  • Oferece o recurso Explorer View
  • Oferece o recurso Keyboard Navigation
  • Oferece o recurso Generate Function

Caminhos para contribuição e feedback

Projetos relacionados e extensões incluídas

  • Vários componentes centrais e extensões do Haystack estão em repositórios separados no GitHub
  • Como exemplo, o node debug adapter e o mono debug adapter ficam em repositórios separados
  • Outro exemplo é o Pixi repository
  • O Haystack inclui várias extensões integradas na pasta extensions
    • Inclui gramáticas e snippets para várias linguagens
    • Extensões que oferecem suporte rico a linguagens, como conclusão de código ou Go to Definition, usam o sufixo language-features
    • Por exemplo, a extensão json oferece colorização de JSON, enquanto a extensão json-language-features oferece suporte rico à linguagem para JSON

Leituras relacionadas

1 comentários

 
GN⁺ 2024-09-27
Comentários do Hacker News

  • Essa ideia é excelente há décadas. Espero que a Haystack tenha sucesso, assim como muitas tentativas anteriores, e a execução inicial parece promissora.
    Ainda assim, deve haver muitos obstáculos, como a dificuldade de entender chamadores/chamados ou as preferências de UX que variam de desenvolvedor para desenvolvedor. Sempre achei que isso poderia ficar muito mais poderoso em um espaço bem maior que uma tela 2D, por exemplo em um ambiente como um headset de VR.

    • Gosto muito da ideia de um mundo Haystack em VR. É uma pena que, por fatores biológicos, o software de VR ainda esteja em um estado instável, mas acredito que um dia ele será o futuro.

  • Muito legal. Imaginei a base de código inteira de uma organização mapeada assim, visível através de vários frameworks e linguagens.
    Não sei se perdi isso no vídeo ou se ainda não é possível, mas conectar nós manualmente dá trabalho demais; seria bom ter um bot simples que rodasse na pasta do repositório e automatizasse a visualização. Adicionei à minha lista de interesse.
    Eu miraria em grandes organizações empresariais ou grupos de TI de prefeituras/governos locais que estejam fazendo ou planejando transformação digital. Eles precisam se orientar e entender o sentido entre trabalho legado e trabalho novo.
    Se der certo, em um ano a Salesforce pode bater à porta. Parece combinar bastante com a visão e o portfólio deles.

    • Gosto do conceito que vi no vídeo. Mas queria ver algo maior, com mais janelas e tudo conectado.
      Não sei se seria realmente usável nesse estado, mas seria divertido tentar. Seria como um diagrama UML de uma base de código inteira, com milhares de setas.
      Aí você poderia dizer a um colega que o arquivo a ser alterado está em algum lugar no canto superior direito, e o diff do Git também ficaria visível, permitindo dar zoom nas mudanças espalhadas por aí.
    • As conexões são adicionadas automaticamente quando você navega seguindo arquivos ou símbolos. Não sei se era exatamente isso que você quis dizer, mas estamos tentando oferecer ao usuário um “fluxo” com base em consultas em linguagem natural.
      Por exemplo, lidar com perguntas como “o que acontece desde o momento em que clico com o mouse no botão de assinatura até o backend?”.
    • Seria interessante se também desse para “conectar” chamadas de API para serviços diferentes.

  • Fico curioso se este projeto foi inspirado no Light Table.
    Como pedido de funcionalidade, gostaria que a visualização fosse além de 2D. Sistemas realmente complexos costumam ser grafos sofisticados — ou, colocando de forma positiva, um novelo —, e já tive a experiência de que apenas uma visualização em plano 2D não basta.
    Seria bom ter algo como uma visualização em esferas concêntricas, com serviços de borda nas camadas externas e serviços centrais/de domínio nas internas.

    • Muita gente mencionou o Light Table, mas só ficamos sabendo dele depois do lançamento.
      É interessante você falar de uma visão mais próxima de 3D. Já pensamos nessa ideia, mas é realmente difícil fazê-la bem de uma forma que os usuários consigam entender. Ainda assim, ela definitivamente faz parte da visão de futuro.
      Edit: removi a especulação sobre o Light Table porque não era verdadeira.
    • Espero que vocês conheçam não só o Light Table dos anos 2010, mas também o Oberon do fim dos anos 1980. O Oberon também tinha a capacidade de posicionar código em um canvas sem limites.

  • Uma pergunta meio tangencial, mas existe algum canvas infinito open source de referência que valha a pena usar? Estou fazendo um jogo de cartas e preciso de um canvas infinito multiplayer. Gostaria de receber recomendações.

  • Se fosse uma extensão do VSCode, acho que eu experimentaria. Tenho vontade de usar, mas hoje em dia vivo dentro do Cursor.

    • Parece um problema cada vez maior.

  • Fico me perguntando por que não dá para fazer como extensão. A ideia é muito boa, e consigo imaginar perfeitamente isso dentro de uma aba na área do editor.
    Assim também daria para ter várias abas do Haystack, tornando a troca de contexto muito mais fácil. Mesmo sendo baseado no VSCode, é um pouco chato ter que instalar outro IDE. Ainda assim, torço para que continuem mandando bem.

    • Extensões do VS Code são bastante limitadas. Você consegue trocar o renderizador de uma aba do editor, mas fazer vários elementos dentro de uma interface customizada serem tratados como abas de editor de primeira classe por todo o ambiente e pelo ecossistema de extensões é praticamente difícil. Se não ficar para trás, um fork é uma escolha razoável.
    • Entendo essa frustração. Como comentei em outro comentário, é bem difícil fazer o Haystack ser bom o suficiente como extensão, mas no fim pretendemos explorar esse caminho também.
    • Se há limitações em extensões, um bom contorno talvez seja uma função para ativar e desativar a visão de canvas. Eu gostaria de alternar entre o canvas e a visão padrão do VSCode; se isso for possível dentro do Haystack, não seria necessário instalar os dois.

  • Isso me lembra o ambiente Kansas da linguagem de programação Self. Há um vídeo feito pela Sun em 1995:
    https://www.youtube.com/watch?v=Ox5P7QyL774
    Depois desse vídeo, recursos de busca ainda mais interessantes foram adicionados.

  • Muito bom. É quase igual ao processo que eu sigo ao olhar uma base de código grande, mas muito mais limpo e organizado.
    Normalmente deixo cinco ou seis terminais abertos apontando para vários arquivos-fonte e tento montar um mapa na cabeça. No fim acabo pegando o jeito, mas é um processo trabalhoso; uma ferramenta dessas ajudaria demais. Agora só falta combinar com um monitor ultrawide.

  • Acho que ajudaria por reduzir o que preciso manter na cabeça, mas a UI atual depende demais do mouse. Seria bom criar atalhos de teclado e fazer as janelas ficarem em “tiling”, como no gerenciador de janelas dwm, para que não seja necessário ajustar o tamanho delas manualmente.

    • Na verdade, queremos que seja possível navegar pelo canvas com o teclado tanto quanto possível. Há uma lista de atalhos no botão “Keybindings and Help” no canto inferior direito.
      Quanto ao redimensionamento manual, estamos tentando implementar tiling dentro do viewport. Se você nos disser o que faz você precisar redimensionar, talvez possamos corrigir.

  • Parece uma abordagem conveniente para desenvolvedores espalharem e mapearem código em um espaço bidimensional. Isso é parecido com o método dos loci[1], em que o desenvolvedor codifica espacialmente trechos de código e conexões de forma elaborada para reforçar a memória e também aumentar a compreensão.
    Por isso, ouso sugerir adicionar opções de padrões de fundo que forneçam um pouco de informação sem atrapalhar. Não tenho um padrão específico em mente, mas, se o fundo fosse um mapa-múndi, o usuário poderia lembrar mais rapidamente a posição que quer encontrar e também se localizar mais depressa.
    Na mesma linha de pensamento, valeria considerar permitir que o usuário defina a cor da borda das abas ou adicione ruído diferente para cada aba. O ruído poderia esmaecer conforme o nível de zoom e a distância em relação ao centro do viewport.
    https://en.wikipedia.org/wiki/Method_of_loci

    • Planejamos adicionar um minimapa para ajudar os usuários a se orientarem.
      A ideia de usar diferenças sutis de cor ou som também é interessante. Vamos pensar nisso.