VSCode와 Google Antigravity 확장을 만들었습니다

프로그래밍은 1도 모르다보니 가끔 갑갑한 적이 많았습니다.

그래서 LLM에게 스펙 시트를 주고 지시를 내려도 이게 내 의도대로 되는건지 모를때가 많죠. 그래서 구조를 한 눈에 알아보고 이걸 이해할 수 있는 도구를 구상하고 Antigravity 확장을 만들었습니다. VScode에서도 사용이 가능합니다

지시를 내리면 시각적으로 노드(소스파일)와 노드(소스파일)을 표시하고 이 노드들이 어떤 노드(소스파일)을 참조하는지 선(엣지)로 표시합니다.

선은 의존성, 콜, 데이터플로, 그리고 양방향 참조로 구분됩니다.

노드를 클릭하면 바로 해당 소스를 들여다볼 수 있습니다.

선이나 노드가 논리적으로 이상하면 바로 시각적으로 표시됩니다.

노드들 역시 사용자의 승인이나 거부를 통해 지울 수 있습니다.

시각화 보드 ( 캔버스 ) 안에서 직접 노드를 만들어 줄 수 있습니다.

그리고 캔버스 위에서 각 노드들의 클러스터를 정의해서 보다 보기 편하게 작업할 수 있습니다

제가 테스트해 본 언어는 3가지입니다. Rust, C, Python 그외에 쉘스크립트, YAML, Json, TOML까지 지원합니다.

VSCODE와 안티 그래비티 모두를 지원합니다.

혹시 써보시고 문제점이 있으면 이야기 해주시면 감사하겠습니다.

자동 클러스터링과 의존성을 제외한 노드 표시 다이어트 등도 되어 있습니다.

스냅샷 기능이 있어 언제든 롤백이 가능합니다. 스냅샷은 자동저장, 수동 저장 모두를 지원합니다.

2개의 좋아요

이제 멀티 프롬프트 ( 다양한 md 파일 ) 과 더불어 언제든 대화 프롬프트를 md 파일로 저장할 수 있게 되었습니다. 내가 맥락 유지할 수 있는 방법이 늘어났네요,

1개의 좋아요

md 파일에도 lsp 연결했습니다

md파일에 경로명 등이 있다면 에디터 상에서 불러들인 md파일에서 해당 파일명만 클릭하면 바로 편집 가능합니다

VSCode와 Antigravity 모두에서 작동시켜봤습니다.

적어도 내가 가려운 곳은 긁어줄 수 있을 듯 합니다.

이게 정말 도움이 될지는 모르겠습니다만 그래도 내가 생성한 소스 파일들이 어떻게 돌아가고 고립되어서 쓰이지 않는 녀석들이 어떤 녀석들인지는 확인이 가능합니다.

노드가 연결되면 자동으로 순서도를 만들어줍니다.

1개의 좋아요

파이선, C와 Rust까지 지원합니다

GEMINI.md 파일을 부트스트랩시키면 자동으로 노드를 생성하고 폴더 내 파일 구조를 만든다음 순서도까지 작업을 진행합니다.
멀티MD 파일을 지원합니다.

추가 계획

GEMINI.md 파일만 부트스트랩시킵니다만, 이걸 좀더 확장해서 Clade다 chatGPT까지 모두 지원하게 하려고 합니다.
기본이 된 MD 파일은 헌법처럼 남겨두고 이제 아키텍쳐 자체를 에디트할때 필요한 MD를 자동 생성시키려고 합니다. 이 파일은 스냅샷과 연결시킬 겁니다.
현재 대화 맥락을 언제건 단축키 하나로 세이브할 수 있습니다.
이 기능을 좀더 확장시켜보려고 합니다

마지막으로 SSH 접속기능을 써서 팀 작업 기능을 추가하려고 합니다

  • 팀장이 서버를 열면 다른 작업자들이 접속할 수 있게 만듭니다
  • 접속하면 이 캔버스에 자동으로 다른 팀원들의 Graph뷰가 뜹니다
  • 팀장은 다른 팀원들의 그래프뷰를 통해 파일을 읽고 쓸 수 있습니다
  • 팀원은 다른 팀원과 팀장의 프로젝트 그래프뷰를 통해 파일을 읽을 수 있습니다

잘 되면 좋겠습니다

일단 보이는 건 깔끔해졌습니다.

순서도와 노드 관련해서 내부 로직은 모두 뜯어고쳤습니다.

이제 다음번에는 노드에서 제어한 엣지의 내용과 새로 캔버스에서 추가한 노드들의 종류가 순서도에 반영되어야 합니다. 아마 다음주에나 작업이 가능할 거 같네요

순서도 로직도 바뀌었습니다. 이제 좀더 보기 좋게 만들어졌습니다.

이제 마우스 호버와 마우스 셀렉션 시 연관된 엣지들이 글로우 효과를 보이며 강조됩니다.

평시에는 로직의 흐름에 따라 엣지 에니메이션이 보이게 했습니다.

지금까지 뷰어의 기능이 강했다면 이제는 능동적으로 노드를 만들면 소스 파일을 생성시킵니다
노드와 노드를 직접 연결하게 했습니다.

그 결과 논리를 직접 에디팅 할 수 있는 길을 만들 수 있습니다.

노드가 엣지로 연결되면 즉시 상위노드에 하위 노드를 임포트 시킵니다. 물론 삭제하면 해당 임포트 구문은 자동 주석처리됩니다.

사용자가 만든 노드들을 직접 순서도에 집어 넣을 수 있는 로직도 만들었습니다.

노드의 형상은 소스 파일의 조건문등을 파악하여 자동으로 형태를 바꿔줍니다.

가장 중요한 사고 깊이 조절을 통해 로직의 병목 현상으로 판명되는 노드의 코딩시 연산력 조절을 가능하게 처리했습니다.

1개의 좋아요

레이어 기능을 추가했습니다

포토샵 레이어처럼 동작합니다.

추후 ssh연동하게되면 다른 사용자의 레이어가 더 붙게 됩니다

사용자가 수동으로 만든 논리 흐름과 ai가 만든 논리의 흐름을 시각적으로 단절시킬 수 있습니다

로직에 결정론적 사고를 일부 부여했습니다. 로직 검증 실패가 프로그램의 실행 불가능을 의미하지않습니다.

그외 자잘한 ui도 편하게 바꿔두었습니다

와 ㄷㄷ…
한눈에 로직 파악하는게 엄청 쉬워지겠네요!

1개의 좋아요

코드는 건드리지않습니다

로직보는 도구 맞아요

지금 3d가속과 ui변경 그리고 내부 로직을 결정론적으로 다루는 작업중입니다

  1. UI를 좀 바꾸었습니다.
    1. 문서 파일들을 보여주던 클러스터를 완전히 웹뷰에서 독립시켰습니다. 노드가 줄어든 만큼 속도가 좀 빨라졌습니다
    2. 노드 선택 UI를 기본적으로 사용하는 선택 인터페이스로 변경하였습니다.
  2. 3D 가속 기능을 추가했습니다
    1. 노드와 엣지 모두 3D 가속 기능을 부여했습니다만 아직 엣지가 완전히 구현되지 않았습니다. 핫픽스로 수정해야 겠네요
  3. 결정론적 사고로 로직을 확인합니다. 이제 추상화와 추상화 뒤에 가려진 문제들을 파악하고 노드에 묘비를 표시합니다. 이게 실제 디버깅 실패를 의미하지 않습니다. 오히려 예방적 의미가 더 강합니다. 나중에 문제 생길 부분을 표시하는 지뢰밭 표시 기능 정도로 생각하면 됩니다.
  4. 결정론적 사고를 바탕으로 가상 디버깅 기능을 부여했습니다. 물론 이게 실제 디버깅 실패를 의미하지 않습니다.

길었습니다. 여기까지 오는데..

결국 릴리즈 하고 나서 모두 4번의 픽스를 해야 했습니다. ㅠㅠ 너무 힘드네요

1개의 좋아요

주말 내내 이 것만 잡고 있었네요
2D 모드의 퍼포먼스를 올리고 3D 가속에서도 속도가 잘 나옵니다.

참고로 제 시스템 사양은 하스웰 i5 / Ram 16기가 / 1050Ti / 우분투 25.10 입니다.

여기서 안티그래비티와 테스트 검증용 VScode를 모두 돌립니다.

전보다 조금은 나아졌습니다.
이제 애니메이션 부분 손 보고 Debug 각 항목의 메뉴들이 제대로 출력되는지 확인해야 합니다.
이거 하느라 크레딧을 모두 소진시켰습니다.

VSCode와 안티그래비티 같은 포크 버전의 큰 차이점이 있습니다.

vscode의 경우 사용자의 프롬프트의 입력과 LLM의 답변이 표준API를 통해 투명하게 json 형태로 표시됩니다. 하지만 안티그래비티는 어딘가에서 블랙박스화되어 있습니다. 이거 뚫고 컨텍스트를 모두 저장하게 하려니 계속 리버스엔지니어링하게 되네요.

후킹은 소용없고 데이터 계속 추적해서 대화가 오가는 경로를 찾아내서 이걸 가로챈 다음 저장하는 방법을 모색중입니다.

간단하게 생각했는데 이 녀석이 시간을 너무 많이 잡아 먹고 있습니다.

일단 노이즈 형태이긴 해도 어떻게든 사용자의 프롬프트의 입력값을 잡아내고 출력까지는 성공했습니다.

그런데 이게 계속 누적되서 저장이 되지 않습니다. 현재 사용 중인 안티그래비티(Gemini 버전)는 대화 로그를 전혀 다른 곳에 Protobuf(.pb) 형식으로 저장하고 있습니다.

실제 로그 위치: /home/dogsinatas/.gemini/antigravity/conversations/

그리고 이 파일들은 압축 되어 있습니다. bc6d80a7-8ad6-4853-8161-1df436e7d9cb.pb (방금 전 14:03 업데이트 확인)

:light_bulb: 해결 방안

ChatExtractor.ts가 감시하는 경로를 ~/.config/Antigravity로 수정하더라도, 안티그래비티가 대화 내용을 .jsonl이 아닌 ~/.gemini/antigravity/conversations/*.pb에 저장하기 때문에 파일 감시 대상과 파싱 로직을 Antigravity(Gemini) 전용으로 업데이트해야 합니다.

현재 Antigravity IDE는 일반적인 VS Code의 .jsonl 방식이 아닌 이 .pb 파일을 통해 대화를 관리하고 있습니다. 방금 확인한 결과, 우리 익스텐션이 기존의 VS Code 경로만 감시하고 있어서 이 새로운 파일 구조를 포착하지 못하고 있었습니다.

따라서 .pb 파일에서 텍스트 조각을 휴리스틱하게 추출하는 로직을 추가하고, 감시 대상에 안티그래비티 전용 폴더(~/.gemini/antigravity/conversations/)를 포함시켜서 즉시 동기화되도록 수정하겠습니다.

작업 계획은 다음과 같습니다:

  1. ChatExtractor 강화: .pb 파일 내의 바이너리 데이터 스트림에서 유의미한 UTF-8 문자열을 추출하는 로직을 추가합니다.

  2. 감시 경로 업데이트: 안티그래비티 전용 대화 로그 폴더를 실시간 감시 대상에 추가합니다.

  3. ** audit log 연결**: 추출된 대화를 .synapse_contexts/에 즉시 기록하도록 보정합니다.

먼저 .pb 파일을 파싱할 수 있도록 ChatExtractor를 수정하겠습니다.

아마 제대로 되지는 않을 거 같습니다. 어떻게든 해봐야죠. 소스가 없으니 여기까지 알아내느라 좀 많이 돌아왔습니다.

pb 파일 컴파일러로도 확인이 되지 않습니다.

❯ cat f84a3739-e0d8-4408-aa2e-877a67946d37.pb | protoc --decode_raw

Failed to parse input.

❯ protoc --decode_raw < f84a3739-e0d8-4408-aa2e-877a67946d37.pb

Failed to parse input.

도대체 어떤 녀석인가 확인해보려고 해봤습니다

file f84a3739-e0d8-4408-aa2e-877a67946d37.pb

f84a3739-e0d8-4408-aa2e-877a67946d37.pb: data

이 말은 표준 압축 파일도 아닙니다. 커스텀 프레임 구조를 가지고 있네요. 그러니 아무리 삽질을 해도 내용을 알 수 없습니다.

왜 이렇게 까지 숨겨놓았는지 모르겠습니다.