ajax 등장 이전부터, ajax, comet, 그리고 html5의 웹소켓까지 기술의 흐름을 간략하게 정리해 보았습니다.

웹 어플리케이션의 개발을 다뤄보지 않은 개발자들을 대상으로 처음부터 웹소켓을 다루기 전에,

  1. 이전 세대의 통신 기법은 어떤 모양이었는지
  2. 웹소켓이 왜 환영받을 만한 기술인지

... 등을 공감할 수 있기 위한 목적으로 PT를 작성 하였습니다.

 
Posted by leafbird 트랙백 0 : 댓글 8

댓글을 달아 주세요

  1. addr | edit/del | reply Favicon of http://blog.naver.com/fantasyls BlogIcon 나진욱 2011.11.18 14:42

    안녕하세요. 웹개발자로 가려는 입문생입니다.
    요즘 새로운 기능들을 한 번 눈여겨 보는 도중에 정말 좋은 강의를 보고 갑니다.'ㅈ')/

    그런데 질문이 있는데요.
    HTML5에 스펙으로 웹소켓이 있는게 아닌걸로 아는데요. 아닌가요?
    저도 책으로 얼핏 본거같아서요.(<- 퍽! 그럼 웹소켓은 어디서 온거냣!)

    아무튼 좋은 글이라서 블로그에 내용 타자로 따로 써서 담아가겠습니다.(출처 밝혀요>ㅁ<)

    쓰다보니 공부도 되네요.^^

    아, 그런데 담아가기가 안 된다면 비밀글로 돌리겠습니다.ㅠ

    • addr | edit/del Favicon of https://devnote.tistory.com BlogIcon leafbird 2011.11.18 15:09 신고

      안녕하세요~
      퍼가시는 것은 괜찮습니다 :)
      그리고 말씀하신대로 웹소켓은 HTML5 스펙에서 제외 되었습니다. (그럼 뭐야?)
      이 발표자료는 저도 HTML5 공부 시작하기 전에 만든 거였는데, 그땐 제외된 줄 모르고 저렇게 적었네요 ^^;

  2. addr | edit/del | reply Favicon of http://blog.naver.com/fantasyls BlogIcon 나진욱 2011.11.18 14:43

    2부가 기대되네요.; - ;)/

    • addr | edit/del Favicon of https://devnote.tistory.com BlogIcon leafbird 2011.11.18 15:10 신고

      2부가 언제 올라오게 될까요 ^^;
      제가 사실 웹 개발자가 아니어서... 웹쪽은 취미삼아 하고 있는거라 후편 일정을 기약할 수가 없습니다 ㅡㅜ...

  3. addr | edit/del | reply Favicon of http://blog.naver.com/fantasyls BlogIcon 나진욱 2011.11.20 17:03

    아하. 그렇군요.
    답변 감사합니다

    ^_^) 취미로 하신다니 그저 기다려야겠네요.ㅎㅎ
    혹시, 2부가 올라오면 다시 즐감하겠습니다.^^
    좋은 하루 되세요.

  4. addr | edit/del | reply 김뭇스 2011.12.03 23:02

    오 예제가 참 적절하십니다.
    ID중복 체크에서 큰 공감을..

  5. addr | edit/del | reply Favicon of http://wnote.kr/wordpress BlogIcon 김성준 2012.02.01 15:31

    설명을 쉽고 간결하게 잘 하시네요. 한번에 쏙쏙 이해가 됩니다.

    이렇게 잘 설명하는 걸 배워야 할텐데, 부럽네요 ^^

웹소켓에 대해서 궁금하신 분들은 아래 슬라이드도 참고하세요.

 

1998년만 해도 '웹 프로그래밍'이라는 개념이 아직 완전히 정착하기 전이었다. 단순한 웹페이지는 대개 HTML로 이루어졌고, 약간 복잡한 웹사이트는 펄(Perl)과 같은 스크립트 언어를 이용한 CGI 프로그래밍으로 구축되었다. CGI에서 한 걸음 더 나아간 JSP나 서블릿, 혹은 ASP와 같은 기술은 이제 막 퍼져 나가고 있는 단계였다. '프로그래밍'이란 말 속에서 구체적인 컴퓨터 시스템의 하드웨어적 특성이나 운영체제의 커널을 연상하는 프로그래머들에게 '스크립트'로 이루어지는 프로그래밍은 프로그래밍이 아니었다. 더구나 프로그래밍 코드 안에 도무지 '언어'라고 볼 수 없는 HTML이 섞여 들어오는 것은 끔찍했다. 그런 프로그래머들에게 화면을 예쁘게 꾸미는 데나 필요한 HTML과 절묘한 알고리즘과 순수한 데이터 처리로 이루어진 프로그래밍을 분리하는 것은 절실한 바램이었다.
- 임백준의 소프트웨어 산책 中...

얼마전에 읽은 책에서 나오는 구절이다. 20세기 말(...) 기존 프로그래머들이 무시하던 '웹 프로그래밍'에 대한 이야기다. 내가 대학교 1학년이었을 때는 2001년도 였는데, 그 때 학교의 교수님들도 실제로 위에 적혀 있는 것과 똑같은 이야기를 하셨다. 나는 예전부터 html이나 php에 관심이 많았는데 (그 당시에 제로보드의 선풍적인 인기로 나 말고도 php를 가지고 놀던 학생들이 제법 있었다), 선배들이나 교수님들은 신입생이 웹 프로그래밍에 관심있어 하는 것을 별로 달갑게 보지 않았다. 교수님들은 강의 시간에 직접적으로 '웹 프로그래밍은 공부하지 말아라'라고 말씀하셨다. 그 당시의 웹 프로그래밍이란 '웹 디자인'과 '웹 프로그래밍'이 명확히 구분되지 않은, 애매한 개념이었다.

지금 생각해 보면 교수님의 입장에서는 그럴만 하겠구나 하는 생각이 든다. 이제 막 전산학도가 된 학생들에게 수많은 하드웨어의 특성, 소프트웨어의 역사, 알고리즘의 신비함 등을 가르쳐야 하는데 쉽고 재밌다는 이유로 html을 가지고 노느라 바쁜 학생들을 보고 있자면 괜한 시간 낭비라는 생각이 들고 마음이 급해지지 않았을까. 하지만 시간이 흘러 웹은 무섭게 발전했고 웹 프로그래밍 역시 공룡같이 성장해 버렸다. 지금은 교수님들이 학생들에게 웹 프로그래밍에 대한 비난섞인 주장을 하지는 못하겠지. 요즘 1학년들에겐 웹에 대해 뭐라 말씀하실지 종종 궁금하다 ㅎㅎ

웹은 정말 무섭게 성장하고 있다. 알에서 태어나 죽을 때까지 성장하는 파충류 같다. 교수님들이 반대하던 웹 프로그래밍은 그저 html 태그를 잘 붙여서 보기 좋은 텍스트 문서를 디자인 하는 수준이었겠지만 이제는 정말 공룡처럼 커져서 기존의 데스크탑 어플리케이션이 하던 거의 모든 일들을 잡아먹고 브라우저만으로 모든 컴퓨팅을 실현해 내고 있다.

3D 게임은 - 특수한 용도를 제외하고 - 일반적인 기업과 가정의 컴퓨팅 환경 중에 웹이 잡아먹지 못한 거의 마지막 남은 프로그램 영역이라고 봐도 좋다. 실시간으로 방대한 양의 그래픽 처리를 해내야 하는 3D 게임 클라이언트는 cpu, gpu, 메모리, 디스크 등 대량의 하드웨어 리소스와 연산 처리를 요구하기에 아직도 어셈블리 수준의 프로그래밍이 필요하고, 웹 뿐만 아니라 자바나 닷넷같은 가상 머신형 언어들도 제대로 침투하지 못한 분야다.
그런데 이제는 3D 그래픽 프로그래밍도 웹에서 처리할 수 있는 세상이 되어가고 있다. WebGL과 Flash 11에서 돌아가는 언리얼3 엔진을 보면서 참 여러가지 기분이 드는 요즘이다.


Ajax 입문 - Asynchronous JavaScript + XML
국내도서>컴퓨터/인터넷
저자 : 타카하시토시로 / 이창신역
출판 : 한빛미디어 2006.01.31
상세보기


5년 전 ajax를 처음 봤을 때 무척 가슴이 뛰었다.
ajax는 텍스트 데이터를 서로 공유하는 수준으로 출발해 못내 답답함이 많았던 웹 프로그래밍에 굉장히 신선한 동작을 보여주었다. 고전적인 웹 프로그래밍들은 기본적으로 서버와 통신을 하려면 다른 페이지로 이동을 해야 하는 대 전제를 가지고 있었고, 페이지 새로고침이라는 불필요한 절차를 감추기 위해 팝업창 같은 편법적인 방법을 동원하고 있었는데 (특히 asp에서의... 페이지 상태를 유지하는 post 뭐시긴가 하는 기술은 정말... ;; ) ajax는 페이지 새로고침이 없이 서버에 요청을 하고 응답을 받아냈다. 이전에는 이렇게 통신할 수 있는 방법이 아주 없었으니 무에서 유가 창조되는 순간이었다. 난 그당시 php로 제작했던 우리 게임의 DB 운영툴에 ajax를 도입하고 혼자 너무 기뻐 어쩔줄을 몰라 했는데, 정작 툴을 사용하는 우리 팀원들은 동작방식이 바뀐 걸 아는지 모르는지 그다지 대수롭게 생각하지도 않았다.

지금 생각해보면 무에서 유가 탄생했다는 희열을 빼면 XHR을 이용한 통신은 제법 다루기 불편한 물건이었다. 그리고 클라이언트에서 polling을 해야만 서버가 응답할 수 있었기 때문에, 서버가 먼저 브라우저에게 통신을 시작할 수는 없는 반쪽짜리 통신이었다. 이런 단방향성을 해결하기 위해 지금은 Comet 내지는 Reverse-ajax로 불리는 기술을 사용하고 있지만, 나는 여기까지는 follow하지 못했다. 간단히 자료들을 찾아보면 Comet은 ajax보다도 깐깐하고 신경쓸 일이 많은 기법인 것 같다. ajax도 처음 등장했을 때만 잠깐 다뤄봤을 뿐이라 이후에 차차 발전이 되면서 조금 더 편해졌을거라는 추측은 해보지만, 아마 기본적인 큰 틀은 많이 벗어나지 못했겠지.



최근에 node.js라는 물건과, 더불어 html5의 웹소켓에 대해서 알게 되었다. '웹소켓이란게 생길 것이고, 이제 웹에서 지속적인 연결을 유지하면서 실시간 통신을 할 수 있다'는 말은 꽤나 예전부터 들었지만 그냥 그런가보다 하고 넘어갔는데, 며칠 전부터 웹소켓을 이용한 샘플 코드들을 훑어보면서 이게 참 대단한 물건이구나 하고 이제야 실감이 난다. 꼭 5년 전에 ajax를 처음 봤을 때 같이 가슴이 뛴다.

굳이 node.js라든지 웹소켓이 아니어도 웹 프로그래밍은 꾸준히, 빠르게, 무섭게 발전하고 있었다. 여러가지 언어로 자유롭게 개발 가능한 프레임웍들이 등장했고 개발 패러다임이 숱하게 변화되었(...다고 확신있게 말할 만큼 가까이서 지켜보진 않았지만 주워 듣는 소리로 그간의 흐름을 가늠해 보건대 그럴거라고 추측한)다. node.js는 자바 스크립트를 이용해 웹 솔루션을 구축하는 하나의 프레임워크라는 정도로 보면, 파이썬으로 구현하는 장고(django)랑 비슷한 종류의 물건으로 봐도 좋을 것 같다. 가만히 생각해 보면 내가 이만큼 충격적으로 받아들이는 것은 그 위에 얹어지는 차세대 html 표준 프로토콜 웹소켓의 존재 때문인 것이 더 크다.

이 포스팅은 별다른 큰 목적이 있는 글은 아니고, 웹의 무서운 발전을 실감하며 이런 저런 이야기를 적어보고 싶었다. 어느 분야에 있든 상관없이 현직 프로그래머라면 이제는 웹의 발전과 변화를 무시할 수 없을 것이며, html5의 표준으로 포함되는 웹소켓을 눈여겨 봐야 할 것이다. 며칠전 아무 생각없이 '간만에 웹쪽 기술들이나 다시 한 번 둘러볼까'하고 asp.net으로 만들던 물건이 있었는데, node.js로 포팅해 봐야겠다.

ps - 서버쪽에서 웹소켓을 사용할 수 있는 방법은 node.js 말고도 몇가지 더 있다. 제티라는 것도 뭔가 검색하다가 보이던데... node.js의 자바 스크립트 샘플들은 요즘 lambda를 통해 흥미를 느낀 클로저 스타일의 코딩이라 더 마음이 간다. (사실 다른 건 자세히 안 찾아봤음...)

Posted by leafbird 트랙백 1 : 댓글 2

댓글을 달아 주세요

  1. addr | edit/del | reply Favicon of http://c-holic.com BlogIcon cielo 2012.02.19 19:41

    좋은글 잘 읽었습니다.