Electron 앱 디버깅을 위한 네트워크 탭 활용 방법을 소개합니다.

네이티브 FFI 호출은 기존 DevTools에서 추적이 불가능해, 호출 내역과 지연 시간을 파악하기 어려웠습니다.

이를 해결하기 위해, Electron preload 프로세스에 로컬 HTTP 서버를 띄우고, 모든 네이티브 함수 호출을 HTTP POST 요청으로 프록시하여, 호출 정보를 Chrome DevTools의 Network 탭에 노출시켰습니다.

또한, AI 채팅과 같이 스트리밍 콜백이 필요한 경우에는 Server-Sent Events(SSE)​를 활용해 실시간 데이터 스트림을 전달하도록 구현하였습니다.

이 방법을 통해 호출 지연 문제를 신속히 발견하고 해결할 수 있었으며, 간단한 해킹에서 시작해 팀 전체가 활용하는 유용한 디버깅 도구로 자리잡았습니다.