VS코드 vs 아톰…‘코드편집기’ 시장서 여전히 막상막하

각기 비슷한 컴포넌트로 개발, VS ‘간편 확장 기능’ vs 아톰 ‘높은 수준 사용자화’

2020-11-19     김홍기 기자

코드 편집기 시장에선 비주얼 스튜디오 코드가 가장 유력한 도구로 자리잡고 있는 가운데 전통적인 아톰 역시 만만찮은 경쟁력과 시장성을 갖고 있다.

아직은 둘다 쌍벽을 이룬다고 할 만큼 각자 막강한 포지션을 확보하고 있다. 물론 비주얼 스튜디오 코드(VS코드)는 고급 사용자화를 지원하는 다양한 코드 편집 앱 등으로 날이 갈수록 더욱 앱 개발 시장에서 앞서가고는 있다. 그러나 왕년에 깃허브가 만든 아톰(Atom)은 MS가 깃허브를 인수한 후에도 그 기세를 잃지 않고 여전히 사용자가 필요로 하는 것을 잘 구현하고 있다는 평가다.

MS의 비주얼 스튜디오 코드 이미지로 아톰과 함께 코드 편집기 시장에서 쌍벽을 이룬다. (출처=MS홈페이지 캡처)

 

둘다 공히 데스크앱 개발 일렉트론 시스템

아톰과 VS코드는 둘다 비슷한 컴포넌트를 이용해 개발됐다. 즉 웹 기술로 데스크톱 애플리케이션을 개발하는 일렉트론(Electron) 시스템인 것이다. 그러나 최근 앱 개발자들은 매우 간편하게 개발 작업을 할 수 있는 VS코드의 확장 기능에 더욱 주목하는 분위기다.

확장 기능을 활용하면 코드 편집기에서 바로 DB를 탐색하고 API로 작업하며 앱의 생산성을 검증할 수 있다. 또 VS 코드는 남다른 유연성을 갖고 있어 프로그래밍 언어 혹은 파일 형식 지원은 물론 코딩 외의 여러 유용한 기능을 제공한다.

 

VS코드 ‘앱 안에서 직접 DB를 쿼리’

흔히 데스크톱 앱이나 웹 포털로 DB를 관리하지만 VS코드용 애드온을 사용하면 앱 내에서 직접 데이터베이스를 쿼리하며 읽어낸다. 다만 이러한 확장 기능은 테이블 구조를 아예 변경하는 것과 같은 DB세부 정보를 관리하기보단 쿼리를 검색하고 실행하는 데 적합하다는게 전문가들의 평가다.

API 개발 및 테스트 기능도 큰 장점이다. VS코드는 편집기에서 API를 바로 테스트하거나 API 정의 형식으로 작업할 수 있다. 예를 들어 ‘트로픽RPC(tropic RPC)’를 사용할 경우 VS 코드 프로젝트에 저장된 테스트 구성으로 자체 API를 자동으로 테스트할 수 있다.

 

오픈API에 대한 린팅‧스웨거 뷰어 기능 등

또한 오픈API에 관한 유효성 검사나 소스코드를 분석, 검증하는 린팅을 제공하기도 한다.

이 경우 오픈API는 API 정의를 작성하는 데 가장 일반적으로 사용되는 형식이다. 또한 오픈API 린트는 YAML 및 JSON을 비롯한 다른 형식으로 내보낼 수 있도록 한다.

더불어 오픈API 파일에 대해 린팅 및 인텔리센스(IntelliSense)는 물론 미리보기도 제공하는 ‘스웨거 뷰어(Swagger Viewer)’기능도 있다. 특히 VS코드는 원활한 실시간 원격 작업을 지원하는 팀 협업툴이 장점이다.

슬랙(Slack)과 디스코드(Discord)를 사용할 경우, VS코드와 이들 서비스를 연동할 수 있고 ‘채팅(Chat)’ 애드온을 VS 코드 창에 직접 통합해 사용할 수도 있다.

 

아톰, 플러그인 통합 기능 등

이에 비해 아톰 역시 만만치않은 특장점을 갖고 있다. 심지어 “비주얼 스튜디오 코드도 확장 기능을 만드는 가이드를 제공하지만 아톰이 제공하는 수준에는 미치지 못한다”는 평가가 나오기도 한다.

예컨대, 플러그인과 통합기능도 그 중 하나다. 이는 아톰이 매우 높은 수준의 사용자화를 지원하도록 한 설계의 일환이다.

이를 위해 아톰은 많은 핵심 기능을 플러그인으로 제공한다. 기본 플러그인도 독창적인데 깃/깃허브가 통합됐고 흰색 여백과 탭으로 구성된 편집 기능을 제공한다.

이미 지난 2019년에 출시된 아톰 1.19 버전에서부터 네이티브 C++ 텍스트 버퍼가 응답성과 메모리 사용을 증진시키고 있다. 깃허브에 따르면 파일 저장은 이제 UI 차단 없이 동기화되어 발생한다. 따라서 사용자는 한 업무에서 다음 업무로 매끄럽게 이동할 수 있다. 즉 대용량 파일이 메모리를 적게 사용한다는 설명이다.

 

DOM의 인터랙션 레이어, ‘코드 단순화 위한 재작성 기능’

또한 아톰의 문서 인터페이스의 일환인 DOM의 인터랙션 레이어는 그 성능을 개선하고 코드를 단순화하도록 재작성됐다. 재작성된 레이어는 새로운 브라우저 기능과 가상 DOM 기능을 활용하게 된다.

이와 함께 웹스타일 시트의 표준안인 CSS 방지 바운더리를 포함한 APIs를 수용할 수 있도록 이뤄짐에 따라 브라우저의 스타일과 레이아웃을 제한할 수 있게 됐다.

게다가 관찰자 크기를 재설정하도록 고안되기도 했는데, 이를 통해 요소의 콘텐츠 사각형이 크기를 달리하는 시점을 알려줄 수 있게 된다.

 

아톰 1.20 버전, 다중 ‘동시보기’‧PHP문법 수정기능 등

아톰은 윈도우, 맥OS, 리눅스에서 이용할 수 있으며, HTML, 자바스크립트 및 Node.js로 제작됐다. 데스크톱 애플리케이션 구축을 위한 깃허브의 일렉트론(Electron) 크로스 플랫폼 프레임워크에서 실행된다.

아톰의 차기 버전은 현재 베타 단계인 1.20이다. 1.20 버전에서는 깃 통합을 향상시키고, 창(pane) 지원과 다중 ‘동시 보기’를 보류할 수 있게 된다. 아톰 1.20엔 또 동적 웹페이지의 스크립트 언어인 PHP 문법에 대한 수정 기능도 있다. 이를 통해 사용자는 패키지 세팅 내의 매치를 전후해 가용한 라인 수를 설정할 수 있으며 결과를 볼 때 인라인 표시를 수정할 수 있는 것이다.