현대의 웹에서 자바스크립트는 대단히 핵심적인 위치를 차지하고 있습니다. 아예 자바스크립트에 모든 기능을 의존하는 웹 사이트도 이제는 결코 이상하지 않지요. 그러다 보니 자바스크립트는 갈수록 복잡해지고 코드 크기가 커져가는 경향이 있습니다. HTTP Archive에 따르면 2020년 3월 기준으로 웹 페이지에서 로드되는 자바스크립트의 평균 크기는 약 450KB인데, 사실 1MB를 넘기는 웹페이지도 결코 적지 않습니다.
 

문제는 자바스크립트 코드는 본질적으로 텍스트 뭉치이고, 이걸 해석하는 것은 기술적으로 시간과 비용이 꽤나 소비되는 작업이라는 것입니다. 웹 페이지의 기능을 구동하려면 자바스크립트를 써야 하는데, 커다란 자바스크립트 파일을 끝까지 다운로드받아 컴파일 과정을 거치고 그 결과를 다시 브라우저 창에 피드백하여 웹 페이지를 그려나가는 장대한 과정은 놀랍지만 복잡하고 저사양 시스템에서는 답답합니다.
 

그렇다면, 매번 일일히 자바스크립트의 모든 내용을 처음부터 다 해석하지 않아도 좋다면 어떨까요? 모든 고급 프로그래밍 언어는 인간이 작성한 소스코드를 기계가 실행하기 위한 컴파일의 초기 단계로 추상 구문 트리(Abstract Syntax Tree, AST)라는 것을 만듭니다. 이 과정은 인간이 알아볼 수 있게 텍스트로 작성한 소스코드의 내용을 파싱(Parsing)하여 모호성이 없는 트리 형태로 만드는 것을 말합니다. 텍스트로 된 소스코드는 끝까지 읽기 전까지는 앞에서 나온 내용이 어떤 의미로 작성된 것인지 모호할 수도 있거든요. 그래서 자바스크립트 파일을 모두 다운받기 전에는 본격적인 해석을 시작할 수 없습니다.
 

이걸 반대로 생각해보면, 처음부터 인간이 쓴 소스코드가 아니라 모호성이 없는 데이터 형태로 자바스크립트 코드의 내용을 수신할 수 있다면 웹 서버에서 데이터를 다운받는 도중에라도 브라우저가 코드를 해석하여 실행을 시작할 수가 있을 것입니다. 게다가 복잡한 초기 해석 과정이 생략되므로 훨씬 빠른 퍼포먼스도 기대할 수 있겠지요. 그래서 이런 구상을 실제로 구현하고자 하는 것이 바로 [BinaryAST]입니다.
 

BinaryAST는 아직 초기 단계지만, 모질라와 클라우드플레어 등이 계속해서 추진해 나가고 있습니다. 실제로 파이어폭스의 Nightly 버전에서 다음 두 플래그를 설정하면 해당 기능이 활성화됩니다.

• dom.script_loader.binast_encoding.enabled = true
• dom.script_loader.binast_encoding.domain.restrict = false

파이어폭스가 웹 브라우저 차원에서 BinaryAST를 지원한다면, 클라우드플레어는 서버 쪽에서 이걸 지원합니다. 클라우드플레어가 자바스크립트를 BinaryAST로 바꾸는 구조는 이렇다고 합니다.

특이한 것은, 위 그림에서 서버 역할을 하는 Worker와 자바스크립트를 AST로 해석하는 Parser는 자바스크립트인 Node.js 기반인데, 이걸 BinaryAST로 바꾸는 Encoder는 Rust로 개발하여 웹어셈블리로 컴파일한 물건이라는 점입니다. 웹 생태계에서도 점차 다양한 언어가 등장한다는 것을 보여주는 것 같습니다.
 

그래서, 이걸 쓰면 정말로 웹 브라우징에 성능 향상이 있을까요? 비록 이것이 초기 버전이긴 하지만, 모바일 등 사양이 낮은 환경에서 코드 구조가 복잡할수록 BinaryAST는 빛을 발한다고 합니다. 앞으로의 발전을 기대해도 좋겠죠.
 

 

참고 :
https://github.com/binast/binjs-ref