생각하는 자바스크립트 2편 - 자바스크립트의 역사

들어가며

지난 시간에 프로그래밍이 무엇인지에 대해서 살펴보았다. 프로그래밍은 요구사항을 분석하고 적절한 자료구조와 함수를 사용해서 그 흐름을 제어하는 것이라고 했다. 이제 본격적으로 자바스크립트에 대해서 들어갈 볼 시간이다. 오늘은 크게 자바스크립트의 역사에 대해서 살펴보고자 한다. 

 

자바스크립트의 탄생

자바스크립트

 

자바스크립트는 언제 만들어졌을까? 🤔 우연스럽게도 내가 태어난 1995년에 처음 세상에 등장했다. 90%의 웹 브라우저 시장 점유율로 한 때 마이크로소프트보다 잘 나갔던 넷스케이프는 웹페이지의 보조적인 기능을 수행하기 위해 브라우저에서 동작하는 경량 프로그래밍 언어를 도입하기로 한다. 그래서 탄생한 것이 넷스케이프의 직원이었던 Brendan Eich가 만든 자바스크립트이었다. 자바스크립트는 1996년 3월, 넷스케이프의 웹 브라우저인 넷스케이프 네비게이터 2에 탑재되었고 처음에 이름을 모카로 지었다가 라이브스크립트 그리고 최종적으로 자바스크립트라는 공식적인 이름을 갖게 되었다. 

 

현재 모든 브라우저의 표준 프로그래밍 언어로 자리 잡았지만 자바스크립트가 등장한 후 얼마 후에 파생버전인 JScript가 출시되면서 자바스크립트가 위기를 맞는다. 

 

자바스크립트의 표준화

1996년 8월, 넷스케이프의 경쟁자 마이크로소프트가 JScript를 인터넷 익스플로러 3.0에 탑재했다. 문제는 JScript와 자바스크립트가 표준화되지 못하고 적당히 호환되었다. 이유는 마이크로소프트가 시장 점유율을 높이기 위해 익스플로러에서만 동작하는 기능을 추가하기 시작했다는 것이다. 

이로 인해, 브라우저에 따라 웹페이지가 정상적으로 작동하지 않는 문제가 발생했다. 우리가 프론트엔드 개발자라면 한 번쯤 들어봤을 크로스 브라우징 이슈가 여기서 처음 등장하게 된다. 역시 이유없이 만들어지는 건 없다. 이러면서 모든 브라우저에서 정상적으로 동작하는 웹페이지를 만들기가 어려워졌다. 

 

이에 표준화된 자바스크립트의 필요성이 부각되면서 1996년 11월, 넷스케이프는 컴퓨터 시스템의 표준을 관리하는 비영리 표준화 기구인 ECMA 인터네셔널에 자바스크립트의 표준화를 요청한다. 

1997년 7월, ECMAScript(ES)라는 이름으로 표준화된 자바스크립트 초판이 처음 등장하게 된다. 이후 1999년 ES3이 공개되고, 10년 만인 2009년 출시된 ES5는 HTML5와 함께 출현한 표준 사양이다. 

 

2015년에 공개된 ES6는 let/const 키워드, 화살표 함수, 클래스, 모듈 등과 같이 범용 프로그래밍 언어로서 갖춰야 할 기능들을 대거 도입하는 큰 변화가 있다. 나 역시 ES6에 관련된 강의를 통해서 공부했었다. 현재는 ES13까지 등장했으니, 새로운 기능들은 궁금하면 직접 찾아보면 좋을 거 같다.  

 

자바스크립트의 성장의 역사

1️⃣ AJAX

초창기 자바스크립트는 웹페이지의 보조적인 기능을 수행하기 위해 한정적인 용도로 사용되었다. 이 시기에 대부분의 로직은 웹 서버에서 실행되었고, 브라우저는 서버로부터 전달받은 HTML과 CSS를 단순히 렌더링(문서 해석 후 시각적으로 보여주는 작업)하는 수준이었다. 

 

그러다가 1999년, 자바스크립트를 이용해 서버와 브라우저가 비동기 방식으로 데이터를 교환할 수 있는 통신 기능인 Ajax가 XMLHttpRequest라는 이름으로 등장했다. 

이전 웹페이지는 화면이 전환되면 서버로부터 새로운 HTML을 전송받아 웹페이지 전체를 처음부터 다시 렌더링했다. 따라서 너무 불필요한 작업이고 성능 면에서도 불리하다. 이로 인해 화면이 전환되면 화면이 순간적으로 깜빡이는 현상이 발생했다.

 

Ajax는 이러한 단점을 커버하기 위해서 등장했다. 웹페이지에서 변경할 필요가 없는 부분은 다시 렌더링하지 않고, 서버로부터 필요한 데이터만 전송받아 변경해야 하는 부분만 한정적으로 렌더링하는 방식이 가능해졌다. 이에 따라서 Desktop application과 유사한 빠른 성능과 부드러운 화면전환이 가능해졌다. 

 

2️⃣ JQuery

2006년, jQuery의 등장으로 다소 번거롭고 논란이 있던 DOM(Document Object Model)을 더욱 쉽게 제어할 수 있었으며, 크로스 브라우징 이슈도 어느 정도 해결되었다. 넓은 사용자 층을 순식간에 확보했으며, 배우기가 다소 까다로운 자바스크립트보다 배우기 쉽다는 장점이 있어 많은 개발자들이 선호하기도 했다. 

 

아래는 사용예시인데, JQuery가 확실히 쓰기 간편하다. 

// JavaScipt
document.getElementById('a')
document.querySelectorAll('.b')

// JQuery
$('#a')
$('.b')

 

3️⃣ V8 자바스크립트 엔진

2005년, 구글이 구글 맵스를 발표하면서 웹 애플리케이션 프로그래밍 언어로서 자바스크립트의 가능성을 확인하는 계기가 마련되면서, 웹 애플리케이션을 구축하려는 시도가 늘면서 더욱 빠르게 동작하는 자바스크립트 엔진의 필요성이 대두되었다. 

2008년 등장한 구글의 V8 자바스크립트 엔진은 이러한 요구에 부합하는 빠른 성능을 보여주었다. V8 자바스크립트 엔진의 등장으로 자바스크립트는 Desktop application과 유사한 사용자 경험을 제공할 수 있는 웹 애플리케이션 프로그래밍 언어로 정착하게 되었다. 

 

V8의 등장으로 자바스크립트가 발전되면서 웹 서버에서 수행되던 로직이 브라우저로 이동했고, 웹 애플리케이션 개발에서 FrontEnd 영역이 주목받는 계기가 되었다.  

 

4️⃣ Node.js

Node.js 홈페이지

2009년, 라이언 달이 발표한 Node.js는 구글 V8 자바스크립트 엔진으로 빌드된 자바스크립트 런타임 환경이다. 즉 자바스크립트를 웹 브라우저에서 독립시켜서 터미널프로그램에서 Node.js를 입력하여 브라우저 없이 바로 실행 가능하다. 주로 서버 사이드 애플리케이션 개발에 주로 사용된다. 실제로 React, Vue등을 활용해서 프로젝트를 진행할 때 가장 먼저 설치하는게 Node.js이다. 보통은 안정적으로 LTS(Long Term Support)를 설치한다.

 

특히, Node.js의 등장으로 이전까지는 Sever-Client 웹사이트를 만들 때 웹에서 표기되는 부분은 JavaScript를 사용하여 만들어야만 했으며, 서버는 Reby, Java 등 다른 언어를 써서 만들어야 했는데 마침내 한 가지 언어로 전체 웹 페이지를 만들 수 있게 된 것이다. 

 

Node.js는 비동기 I/O를 지원하며 싱글 스레드 이벤트 루프 기반으로 동작함으로써 요청 처리 성능이 좋다. 따라서 Node.js는 데이터를 실시간으로 처리하기 위해 I/O가 빈번하게 발생하는 SPA(Single Page Application)에 적합하다. 하지만 CPU 사용률이 높은 애플리케이션에는 권장하지 않는다. CPU 사용량이 높을 경우 이벤트 루프 delay 현상이 발생하기 때문이다. 

 

이제 자바스크립트는 크로스 플랫폼을 위한 가장 중요한 언어로 주목받고 있다. 웹은 물론 모바일 하이브리드 앱(PhoneGap, Ionic), 서버 사이드(Node.js), 데스크톱(Electron) 등 다양한 환경을 위한 프로그래밍 언어로서 세계에서 가장 인기 있는 프로그래밍 언어다. 

 

 

마무리하며

오늘은 자바스크립트의 역사에 대해서 살펴보았다. 어떻게 보면 역사를 아는 게 중요한 것일까?라는 생각이 들 수도 있지만  자바스크립트가 어떻게 만들어졌고 발전했는지에 대해서 관심을 보이는 자세가 더 나은 개발자로 가는 발걸음이라고 생각한다. 끊임없이 자바스크립트는 발전해 왔다. 오늘날 사용하는 웹 브라우저의 발전은 먼저 누군가의 헌신과 노력이 있었기에 가능했다는 것을 잊지 말자.