본문 바로가기

개발 이야기

HTML5와 IE9, 그리고 강력한 웹개발 플랫폼들

미국 라스베거스에서 현재 진행중인 MIX10 행사의 둘 째날 행사에서는 웹과 관련된 이야기가 풍성하게 흘러나왔습니다. 다음 버전의 웹 브라우저인 Internet Explorer 9(이하 IE9), 웹 개발 플랫폼인 ASP.NET MVC2, ASP.NET AJAX4 그리고 Windows Azure 기반의 Dallas등 다양한 기술 이야기들이 나왔지만 웹과 관련된 가장 큰 이야기는 바로 "웹 표준"이었습니다.

1. 웹 표준을 준수하는 고성능 웹 브라우저 IE9


<그림2>표준과 커뮤니티 피드백

IE9의 가장 큰 변화점은 HTML5과 성능 향상 이렇게 두 가지를 이야기 할 수 있습니다.
IE9은 최근 가장 크게 이슈가 되고 있는 HTML 5을 적극적으로 준수하고 있습니다. 또 CSS 3, DOM, ECMA Script 252과 같은 웹표준들을 지원하므로써 IE8부터 시작한 웹 표준을 준수하는 웹 브라우저라는 기조를 자연스럽게 이어가고 있습니다. 웹 표준을 테스트하는 Acid3 테스트는 IE8가 20점이 IE9은 50점이 나와서 훨씬 웹 표준을 잘 지원하는 것으로 나타났습니다.

<그림3>YouTube 시연장면

HTML 5에서는 동영상 재생과 같은 요소들이 기본 HTML5에 정의된 내용만으로 가능하게 설계되어 있습니다. 국내외 대형 업체들 중에는 벌써 HTML 5에 기본 스펙으로 정의된 동영상 기능을 바로 사용하려는 시도들이 공식적으로 나오고 있는 데 <그림3>에서 보면 IE9에서 YouTube 동영상을 재생하는 모습을 볼 수 있는데 마우스 오른쪽 버튼을 눌러보면 Flash가 없이 실행되고 있는 것을 볼 수 있습니다.

 또 하나가 IE9의 경우 성능향상이 눈에 띄게 이루어졌는데 이렇게 비약적인 성능향상이 가능했던 이유는 이미 대중화 되어 있는 멀티코어 CPU의 성능을 잘 활용하고, HTML5와 화면 랜더링이 하드웨어 가속 기능을 잘 활용할 수 있게 된데 있습니다.  특히 자바스크립트 엔진과 Direct2D 기술이 잘 접목된 형태는 표준과 성능 두 가지가 잘 접목된 형태의 IE9이 탄생할 수 있도록 해주었습니다.



SunSpider Benchmark Results
<그림4>놀라운 성능 향상을 보여주고 있는 IE9의 자바스크립트 엔진

Browser Sunspider Result Average (ms)
IE8 3825.53
Opera 10.10 2491.93
IE9 PDC 2009 Demo 834.00
Firefox 3.6 699.80
Firefox 3.7 Alpha2 Pre-Release 610.20
IE9 Mix 2010 Platform Preview 1.9.7745.6019 598.80
Safari 4.0.5 (531.22.7) 407.93
Chrome 4.0.249.89 373.87
Chrome 5.0.342.2 (dev) 293.47
Opera 10.5 285.20
<표1>브라우저 별 자바스크립트 성능 비교

작년 PDC09에서 공개되었던 데모에 비해서도 30% 정도의 성능 향상을 볼 수 있습니다. 하지만 아직 최종 버전이 아닌 점을 감안해 볼 때 최종 출시되는 버전의 성능이 기대 됩니다.

새로운 IE9의 랜더링 엔진은 성능 뿐 아니라 섬세한 표현 면에서도 좋아진 모습을 보여주었습니다. IE와 <그림5>의 내용은 폰트를 400% 이상 확대한 경우인데 이런 경우에도 폰트의 곡선 부분이 매끄럽게 표현되는 것을 볼 수 있습니다.

<그림5>향상된 표현력을 가지고 있는 IE9의 랜더링 엔진

<그림6>Internet Explorer 9의 새로운 기능

IE9은

  • 현재의 하드웨어(멀티코어 CPU)등을 활용하는 새로운 자바 스크립트 엔진
  • HTML5, CSS3, DOM, SVG... 등 다양한 웹 표준의 준수
  • 현재 웹에 대한 현재 하드웨어(GPU)를 통한 가속 기능의 활용
  • HTML5 Video에 대한 하드웨어 가속(지원 예정)

등을 주요 특징으로 이야기 할 수 있습니다.


2. 한 단계 더 올라선 성숙한 웹 개발 플랫폼

Microsoft 웹 개발 플랫폼도 MIX10에서 좀 더 성숙한 모습을 보여주고 있습니다. 여기서 성숙한 모습을 보여주고 있다는 표현을 사용하는 것은 MIX10에서 새로 발표되는 내용은 많지 않았기 때문 입니다. 이미 작년 PDC09 행사나 또 다른 채널을 통해서 관심있는 분들은 많이 접해왔기 때문에 새로움은 덜했습니다.

 Microsoft 웹 개발의 핵심에는 .NET 기반의 기술인 ASP.NET이 자리 잡고 있으며 ASP.NET 기반의 기술인 ASP.NET MVC2, ASP.NET AJAX4와 같은 기술들이 자리잡고 있습니다.
 복잡하고 여러가지 기술을 사용해야 하는 웹 기반의 개발에는 필연적으로 스마트하고 강력한 개발툴의 지원이 필연적이라고 할 수 있는데 그런면에서 Microsoft의 Visual Studio 2010은 현존한는 최고의 개발 툴 중에서도 백미라고 할만큼 많은 기능들을 자동화 시키고 개발자들을 잘 이해하고 있는 툴로 나왔습니다.

<그림7>멀티 모니터를 통한 개발

다양한 부가기능 들이 많이 소개가 되었지만 개발자들은 개발 툴에서 멀티 모니터를 지원하는 것에 격한 호응을 보내주는 모습을 보였는데 두개 이상의 모니터를 사용해서 개발 할 경우 소스나 다이어그램과 같은 요소들을 별개의 창에 배치하고 개발할 경우 개발 생산성이 대단히 높아지기 때문입니다.

이외에도 향상된 IntelliSense나 Code Navigation등도 개발자의 작업에 큰 도움이 될 수 있는 요소들이 아닐까 합니다.

<그림8,9>향상된 소스 편집 기능

이외에도 Visual Studio 2010에서는 프로그램의 프로파일링과 디버깅 테스트 시나라오등을 통해서 품질을 향상시킬 수 있는 요소들이 많이 포함되었습니다.

ASP.NET의 경우도 ViewState를 가볍게 하고 사용자 친화적인 URL를 사용할 수 있는 구조로 바꾸는 등 사용자들의 요구사항을 충실히 반영하고 있는 것을 볼 수 있습니다. 특히 .NET Framework 3.5 SP1에서 선보였던 ASP.NET MVC는 MVC2로 업그레이드 되면서 한층 더 성숙한 모습을 보여주고 있습니다.

<그림10>ASP.NET MVC2의 주요 변화

ASP.NET MVC2의 주요 변화로는 다음과 같은 요소들을 이야기 할 수 있습니다.

-ASP.NET MVC2는 클라이언트와 서버 양측에서 데이터를 검증
-새로운 UI와 자동으로 추가,수정,조회,삭제를 생성해주는 Scaffolding 기능의 강화
-Modular/Reusable 프로젝트
-Visual Studio와 좀 더 잘 통합된 기능

들을 제공하고 있습니다. 특히나 자바스크립까지 지원하는 IntelliSense 기능은 JQuery와 같은 자바스크립트 오픈소스 기반의 프레임웍을 .NET에서 기본으로 제공하는 수준의 개발 편의성을 제공할 수 있습니다.

<그림11>더 좋아진 자바 스크립트 IntelliSense

Microsoft는 ASP.NET MVC를 내어 놓으면서 JQuery를 기본으로 포함하고 있으며 이와 관련한 지원을 지속적으로 해오고 있는데 JQuery는 자바스크립트 기반의 오픈소스에서 사실상 표준으로 사용되고 있는 오픈 소스 프레임웍입니다. 이 날 행사에서는 JQuery의 창시자인 John Resig가 직접 출연해서 많은 관심을 모았습니다.

<그림12>JQuery의 창시자인 John Resig

 언제부터 인지 Microsoft의 개발 플랫폼도 표준을 통한 오픈과 오픈을 통한 표준 두 가지 방면에서 모두 노력을 하고 있으며 그 결과물이 이번 MIX10을 통해서 발표될 수 있었던 것 같습니다.


3. 누구나 함께 하는 웹 세상을 위한 진보

 Web 환경과 생태계를 지원하는 위한 프로젝트가 바로 Web Platform Installer로 http://www.microsoft.com/web 에서 제공하고 있습니다. 여기서는 Windows만 설치되어 있는 컴퓨터를 자연스럽게 웹 서버나 웹 개발 환경으로 바꾸어 주는 기능들일 모두 제공하고 있습니다.
 웹서버와 개발 플랫폼 그리고 개발도구와 공개된 웹 애플리케이션까지 모두 웹에서 다운로드 받아서 설치하게 해주는데 최근에는 국내에서 많이 사용되고 있는 XE엔진과 같은 PHP기반의 소스들도 함께 업로드 되어 있습니다.

<그림13>웹 플랫폼 인스톨러의 소개

또 하나가 OData(Open Data) 형식을 적극적으로 활용하기 시작했다는 점인데 OData란 웹에서 데이터를 주고 받을 때 사용하는 데이터의 형식을 정의한 표준으로 http://www.OData.org에서 관련된 정보를 받을 수 있습니다.

현재 OData는 Microsoft, Google, Apple 등 많은 기업의 제품에서 활용될 수 있으며 아래와 같은 언어의 SDK를 홈페이지에서 제공하고 있습니다.

  • Javascript
  • PHP
  • Java
  • Windows Phone 7 Series
  • iPhone (Objective C)
  • .NET
  • Microsoft는 기업 포탈로 활용되고 있는 SharePoint 2010에서도 OData를 적극적으로 사용하고 있으며 웹 개발 플랫폼에도 확장 기능으로 사용할 수 있게 하고 있습니다.

    <그림14>OData를 사용하는 Microsoft 기술과 제품들

    <그림15>OData를 사용할 수 있는 웹 기술들

    <그림16>OData를 사용하고 있는 iPhone App의 예


    4. 둘째 날 키노트를 정리하면서

    첫째 날 Windows Phone 7 만큼 충격과 놀라움은 없었지만 최소한 Microsoft의 웹 기술들이 방향을 표준을 통한 시장의 확대로 방향을 잘 잡아가고 있음을 보여주고 있었던 것 같습니다.
     HTML5, CSS3와 같은 요소들은 아직 그 스펙이 확정되지 않았음에도 불구하고 적극적으로 제품에 반영하고 또 표준 스펙에도 참여하고 있는 것은 최소한 웹 세상에서 만큼은 표준을 통해서 시장이 형성되고 있는 있는 현실을 잘 반영하고 있는 것이라 느껴 집니다.

    한가지 걱정은 IE9의 정식 출시 시기인데 IE9의 출시 시기에 따라서 국내에는 또 한번 호환성 검증을 하느라고 부산을 떨 것 같은 느낌을 지울 수 없습니다. 국내 환경도 빨리 IE6를 정리하고 웹 표준에 맞추어서 잘 업그레이드 되기를 바라 마지 않습니다.

    ---(*)---

    블로그 이미지 김영욱 차장 Microsoft Korea  .NET Evangelist
    Enterprise UX 를 위한  UI 기술과 SOA, Cloud Computing, NUI등 다양한 분야의 접목과 응용을 통해 최적의 IT 인프라 구축을 위해서 노력하고 있다.
    Email: iwinkey@hotmail.com
    Blog: http://winkey.tistory.com