1. 개요
|
프로그래밍 언어 PHP의 Hello, world! 코드 |
Syntax highlighting / 構文強調
컴퓨터 언어, 프로그래밍 언어 등을 읽거나 구조를 파악하기 쉽도록 키워드, 식별자, 문장 부호 등의 개별 요소를 색칠해서 보여주는 기능.
syntax coloring, 신택스 하이라이팅, 문법 강조라고도 한다.
2. 특징
가독성을 매우 향상시킨다. 자연어와 다르게 프로그래밍 언어는 특성상$.map<str>["key"]?.(par);
처럼 띄어쓰기 없이 여러 동작을 하는 코드를 붙여 쓸 때가 많은데, 이 경우 각각의 요소를 시각적으로 구분하기 힘들어진다. 이 때 신택스 하이라이팅을 적용하면 어디부터 어디까지가 문자열인지, 이게 함수 호출인지, 메서드인지, 인덱싱인지, 어떤 게 자식 요소인지, 어디가 문장의 끝인지 등등이 한눈에 파악된다.이런 짧은 코드에서뿐만 아니라 코드 전체의 구조를 파악하기에도 용이한데, 들여쓰기나 짝이 맞는 괄호를 같은 색으로 칠하거나 코드가 아닌 주석 등은 건너뛰기 쉽도록 옅은 색으로 칠하기도 한다.
에러를 찾기에도 좋다. 에러가 난 부분을 강조해줄 때뿐 아니라 단순한 오타도 색을 보고 본능적으로 오타임을 알아차리기 쉽게 도와준다. 예를 들면
else
를 eles
로 오타를 냈어도 무심코 지나칠 수 있지만, 전자는 키워드, 후자는 식별자로 인식되므로 else
가 아닌 eles
로 표시되는 셈. 실제로는 이런 단순한 예시뿐만 아니라 닫지 않은 괄호, 빼먹은 콤마, 없는 프로퍼티 참조 등등 수많은 실수를 방지하는 데에도 효과가 있으며, 무엇보다 이런 에러 파악이 익숙해지면 거의 본능에 가까운 감각이 된다. 이는 비단 프로그래밍 언어뿐 아니라 마크업 언어에서도 그대로인데, 위키위키를 편집하다가 위키 문법 에러를 내면 미리보기를 보기 전 깨진 문법을 수정할 수 있다.케임브리지 대학교의 연구진이 아이 트래커를 사용해 실제로 신택스 하이라이팅의 효과에 대해 조사한 적이 있는데,[1] 결론은 신택스 하이라이팅을 사용한 집단이 프로그래밍 언어를 배우고 이해하는 데 든 시간이 압도적으로 적었고, 키워드와 같이 반복되는 문법 요소들에 시선을 소모하는 일이 훨씬 줄어들었다는 것. 또 다른 특징으로 이런 표본집단간 격차가 프로그래밍 경험이 늘어날수록 줄어들었다는 것이다. 다시 말하면 해당 언어에 익숙할수록 구문 강조의 효과는 다소 약해지고, 바꿔 말하면 구문 강조는 프로그래밍을 처음 접하는 초보자들에게 훨씬 도움이 된다는 것.
3. 종류
- 토큰 하이라이팅
단순히 렉서 또는 이를 조금 확장한 정규표현식을 기반으로 하는 하이라이팅 로직. 렉서가 [math(\mathcal O)]의 시간 복잡도를 가지기 때문에 가장 빠른 구현체이며, 때문에 수천줄의 파일을 빠르게 로딩해야 하는 에디터의 경우 후술할 더 정확한 하이라이팅을 지원한다고 해도 언어 서버가 워낙 분석이 느리기 때문에 우선 토큰 하이라이팅을 먼저 수행하고 나중에 더 정확한 하이라이팅 맵으로 업데이트하는 경우가 많다. 더 정확한 하이라이팅을 구현하지 않고 이 정도 구현에서 그치는 경우도 많다. 실제로도 극도의 미니멀리즘을 표방하거나 주류 언어와 구조가 다른 소수 언어들을 제외하면 이 정도의 구현만으로도 70% 정도는 커버할 수 있고, 서브라임 텍스트나 Visual Studio Code에서 사용하는 TextMate highlighter 등은 문맥 요소를 아주 조금 추가했을 뿐 결국은 정규표현식 덩어리로 이루어져 있다. - 문맥 하이라이팅
위 토큰 하이라이팅에 문맥(context) 정보를 추가한 것으로, 심화되면 정적 분석 없이 파일 전체를 파싱해 AST를 만들어 냈을 때 얻을 수 있는 정보들을 반영한 하이라이팅을 말한다. 예를 들면 함수의 매개변수만 다른 색으로 칠한다던지 하는 게 가능한데, 렉서 수준에서는 매개변수도 함수의 지역변수도 전부 같은 식별자이지만, 파싱이 끝난 시점에서는 이 식별자가 어디서 정의되었는지까지 파악이 가능하다. 하지만 결국 파싱만 되었을 뿐이라 후술할 시맨틱 하이라이팅만큼 강력하지도 않고 토큰 하이라이팅보단 느리기 때문에 여러모로 어중간한 위치. 대표적인 구현체는 TreeSitter 등이 있다. - 시맨틱 하이라이팅
당연하겠지만 AST에서도 파악할 수 없는 정보들은 셀 수 없이 많다. 식별자의 실제 타입 정보나, 불변 여부 등의 정보를 알 수 없다. 이러한 정보는 파싱보다 더 뒷 단계인 정적 분석이 수행되어야 얻을 수 있으므로, 랭귀지 서버를 돌릴 필요가 있다. 이렇게 랭귀지 서버로부터 직접 소스를 분석해서 받은 자세한 정보를 반영한 것이 바로 시맨틱 하이라이팅이다.
4. 구현체
- TextMate - 오픈 소스 텍스트 에디터. 신택스 하이라이팅 정의는
.tmLanguage.json
에 정의된다. 원래는 TextMate 에디터 내부적으로만 쓰기 위해 개발된 포맷이었지만 현재는 사실상 표준급으로 쓰이는 중. - Sublime Text -
.sublime-syntax
라는 독자 포맷과 TextMate를 동시에 지원한다. - vi/vim -
.vim/syntax/
하위 폴더에syntax match
구문으로 정의한다. 대부분 정규표현식. Neovim 등 현대화된 포크는 TreeSitter 등을 사용하기도 한다.
4.1. 웹 구현체
- highlight.js
- shiki - vscode와 같은 TextMate를 사용한다.