웹서비스 이야기/MS

인터넷 익스플로러9 베타 출시, 이젠 바꿔야 할 이유

MIRiyA☆ 2010. 10. 6. 14:58

지난달 9월 16일에 있었던 마이크로소프트 인터넷 익스플로러9 베타 발표회에 다녀왔습니다. 이거 참 하도 뒤에 줄줄이 밀려있다보니 많이 밀렸습니다.


아침에 연가를 내고 나와서, 하루에 행사 3탕을 소화할 예정이었는데 첫번째 일정이 빵꾸가 나버려 일찍 코엑스 오디토리움에 왔습니다. 거의 한시간 반 정도 일찍 와서 다들 리허설중이더라구요. 오늘은 일찍 왔으니 사진 퀄리티 올리기에 좀 더 신경을 써보려고 합니다.



이렇게 흰 표면에 화이트밸런스와 노출을 깔끔하게 맞추고, 앞으로 행사가 어떻게 진행될지 동선을 어림짐작하여 세팅을 노트에 메모합니다. 그리고 이동하기 편하고 각 맞추기 편하게 맨 앞에 자리잡아두고요. 이렇게 미리 연습해두면 나중에 삽질할 일이 없지요. 뭐 촬영이라는게 항상 수십장 찍어야 잘 나오기 시작하지만 ㅠ



뭔가 회의중인 관계자들.


슬슬 참석자들이 입장하기 시작하고, 기다리는 동안 앞에 IE 관련된 비디오를 하나 틀어줬습니다.


이렇게 생긴 팝콘돌이가 돌아다니면서 홍보를 하고 있더라구요. 



뎀프시롤 합니까? 펀치가 살아있습니다.


오디토리움 앞에는 이렇게 사전등록중. 저는 이거 펼쳐놓기 전에 들어와서 육포 못받았습니다 ㅠㅠ


사람들도 거의 들어왔고, 이제 키노트를 시작할 차례.



자전거를 타고 들어오는 한국 마이크로소프트의 UX 에반젤리스트 황리건님.

도색이 특이한 스트라이다 자전거인데, 제가 사무실 출근할때 저거 짝퉁 버전 타고 다닙니다.

타봐서 잘 알지만 저거 운전 엄청 어렵고 위험합니다 ㅠㅠ



리건님의 세션은 총 4가지 주제로 진행되었습니다. "빠른 웹", "표준 웹", "안전한 웹", "깔끔한 웹"

우선, 빠른 웹 먼저.


뉴스 사이트와 Ajax 사이트의 구성요소 비교.



IE 초기 구동시 툴바 등 추가 기능으로 인한 시작 지연 시간의 그래프입니다. 맨 위에 윈엠프 툴바가 보입니다. 얘 하나가 1초 이상 지연시키는군요. 그 외에는 바이러스 백신 등의 무거운 추가 기능들이네요. 



IE9에서는 이렇게 로딩 속도가 긴 추가기능을 선별해서 꺼버릴 수 있는 기능이 들어간다고 합니다. 크롬이나 파이어폭스 등으로 추가기능 많이 사용해왔는데, 이런 기능은 참 좋네요. 선별해서 설치한다 해도 얘가 얼마나 많은 자원을 차지하는지 알수가 없으니 말입니다. 이 기능 추가로 인해 추가기능 개발사도 속도 최적화에 공을 들이는 계기가 되었으면 합니다.



아시는 분은 다 아시지만 이번 IE9에는 GPU 가속 기능이 들어갔습니다. 여태까지 컴퓨터에는 중앙 처리를 담당하는 CPU 혼자서 오만 계산들을 다 수행했지만, 요즘 게임들도 많이 하다보니 그래픽카드에 달린 GPU도 엄청 좋아졌습니다. 그래서 게임 같은거 안돌릴때는 너도 쉬지 말고 일좀 해라, 하고 GPU도 사용하는게 'GPU가속 기능'입니다. 이거 처음에 나왔다 할 때는 아 뭐 그런게 나왔나보다.. 하고 넘겼는데, 이게 있고 없고의 차이가 100:1로 엄청납니다. 대단해요. 빠르기로 유명한 크롬과 IE9의 속도 테스트, 한번 보시죠.


우측의 크롬은 아직도 준비중인데, 좌측의 크롬은 달리기 시작했습니다.



그리고 이건 화면상에 물고기 1000마리를 띄웠을때 얼마나 버벅거리나 알아보는 테스트인데, 위와 같이 IE9의 완승으로 끝났습니다. 실제로 동영상으로 봐야 제맛인데, 상당히 차이나더군요. 근데 이번 시연에서 실수로 빼놓은게, 크롬의 GPU 가속 기능을 켜놓지 않았다는겁니다. 제가 골수 크롬빠라서 크롬 dev 버전을 깔아서 써오고 있었습니다. 7.0 버전 이후로는 GPU 가속 기능이 들어가는데, 이 기능은 아래의 명령줄을 따로 추가해줘야 사용 가능합니다.


chrome.exe --enable-accelerated-2d-canvas


이 행사가 9월 16일에 있었고, 크롬측에서 GPU 가속 기능을 켜는 옵션을 발표한게 9월 14일이니 일부러 켰네 안켰네 하기에는 소모적인 논쟁이 뒤따를겁니다. 시연한 리건님은 딱히 크롬을 까거나 하는 말투는 아니었고, 가능한한 크롬을 배려해주는 느낌이었거든요. 예를 들어 위에 물고기 영상의 경우 오래 켜두면 프레임수가 올라가는데, 크롬이 버벅거리지 않을때까지 적당히 기다려줬습니다.


물론 악의가 있었건 없었건 간에 위에서 MS측이 한 실험은 결과적으로 공정하지 못했으니 무효입니다. IE9는 GPU가속이 켜져있는 상태고, 크롬은 꺼져있는 상태였으니까요. 그래서 언제나 그렇듯 제가 대신 실험을 해봤습니다. 먼저 GPU 가속 기능을 끈 크롬으로 테스트해서 스크린샷을 찍고, GPU 가속 기능을 켠 크롬으로 테스트, 그리고 IE9로 테스트해봤습니다. IE9를 맨 마지막으로 두었는데, 혹시나 메모리 누수가 있을까 해서 IE9에게 최대한 불리하게 잡아본겁니다. 


테스트 사이트 : http://ie.microsoft.com/testdrive/

시스템 사양 : Core2Duo T8300 2.4Ghz, nVidia Geforce 8600M GS, 

                       3GB RAM, Hitachi 500GB 7200RPM HDD, Windows7


뭐 간단하게 말해서 그래픽카드 약간 괜찮은 2년 된 노트북에서 돌려봤습니다.

먼저 GPU 가속 기능을 끈 크롬의 화면입니다.


아래쪽에 작은 글씨로 FPS:14라고 적힌게 보일겁니다. 이 화면 볼때까지도 한참 걸렸습니다.


아놔 너무 느려서 도저히 못기다리겠습니다. 거의 30분 걸릴것 같아서 그냥 닫았습니다.

물고기 탱크도 1fps 나와서 스샷 그냥 안찍었습니다.


이번에는 깔끔하게 GPU 가속 기능 켠 크롬입니다. 모든 확장기능은 다 꺼둔 상태입니다.


오.. 시작부터 한계선인 60FPS를 찍었네요.


테스트 결과, 24초가 나왔습니다. 프레임은 계속 60FPS를 유지하네요. 17ms마다 한장씩 보여준답니다.


이번에는 InternetExplorer9 베타로 테스트해봤습니다.


역시나 GPU 가속이 지원되니 시작부터 60FPS 찍어줍니다.


결과값으로 21초가 나왔습니다. 24초가 나온 크롬보다 근소하게나마 빠르네요.


이번에는 문제의 물고기 탱크 테스트로 크롬 vs IE9를 해봤습니다.


먼저 크롬. 28FPS 나옵니다. 26~29 사이를 오가더군요. GPU가속 켜기 전에는 1FPS 나왔었죠.. 


이번에는 IE9입니다. 36FPS가 나오네요. 35~38 사이를 왔다갔다 합니다.


리뷰 쓰는 블로거 입장에서 사심없이 결과 스샷만 찍어서 보여드리는거니 믿건 안믿건 개인의 판단에 맏기겠습니다. 전체적인 결과로 봤을때는 IE9이 크롬7보다 근소하게 빠릅니다. 지금 세상에 GPU 가속을 지원하는 브라우저가 크롬dev7이랑 IE9 베타밖에 없으니, 현재 세상에서 가장 빠르다 할 수 있겠습니다.(이 테스트에 한해서) 덕분에 제 노트북이 최신 노트북에 비해 얼마나 성능이 떨어지는지 알 수 있는 기회가 되었네요. 아마 요즘 컴퓨터에서는 거의들 비슷하게 나올겁니다. 아, 참고로 GPU 가속 기능 뿐만 아니라 멀티 코어도 지원하게 되었습니다. 드디어 두 다리 모두 사용해서 달릴 수 있게 되었군요.


여튼, IE9에는 GPU가속 기능이 기본으로 들어갑니다. 기존에 IE를 안쓰고 크롬을 쓰게 만든 이유중 가장 큰 부분이 속도 문제였습니다. 속도는 진짜.. 크롬이 신나게 달리고, 파이어폭스가 그 뒤를 바짝 쫒아가고, IE는 양반다리 하고 앉아서 엉덩이로 움찔움찔 움직이던 정도였는데 많이 나아졌네요. 얘도 이제 일어서서 어께를 나란히 할 정도로 달립니다. IE9에서도 이젠 "우리도 속도 빠르다"라고 당당하게 외칠 수 있을것 같습니다. 



GPU 가속 기능 이외에 괄목할만한 변화는 내부 엔진의 변화인데요, 이번에는 '차크라 엔진'이라는게 들어갔는데 이게 성능이 꽤 좋습니다. 위 그래프를 보다시피 선스파이더 벤치마크 결과로도 기존 IE8에 비해 12배나 빨라진 양호한 모습을 보여주고 있습니다. 거참.. 기존 IE8이 얼마나 느렸는지 뭐라 말을 못하겠군요. 참고로 그 IE8은 예전 IE6에 비해 50배 빨라진 놈입니다. 이건 뭐 충격과 공포네요. 여튼 지금부터라도 속도를 대부분 따라잡았으니 참 다행입니다. 


넷스케이프 나가떨어진 이후로 IE6가 독주하다가, 파이어폭스와 크롬이 나오면서 신나는 전쟁이 펼쳐지는 중인데요, 쓰는 사람 입장에서는 아주 흐뭇합니다. 구글과 MS같은 덩치들이 제 블로그를 0.1초 더 빨리 띄워주기 위해 노력중이네요. 각 브라우저들에 GPU 가속 기능이 기본 탑재될 내년이 흥미로워집니다.





빠른 웹은 이정도로 끝내고, 표준 웹 차례입니다. IE의 표준 준수에 대해 욱하시는 분들이 참 많죠. 다 압니다. 저도 여러분들의 0.5%정도 고생좀 해본터라 IE가 아주 미웠답니다. 일단 표준 준수 여부 측정하는 테스트 하면 이름도 무시무시한 ACID 테스트가 있지요. 몇점 맞았나 성적표좀 보겠습니다.




95점 맞았습니다. 5점 까인 이유는 W3C쪽에 각 회사들이 표준에서 빼달라고 요청중인 기능을 일부러 제외했기 때문이라네요.(그 요소 이름은 생각이 안납니다 ㅠㅠ) 이것도 통과하다니 여튼 점수는 이제 의미가 없게 되어버렸네요. 참고로 ACID2 테스트는 IE8이 공식출시하며 100점 맞고 통과했습니다.



이번 세션은 여기까지 하고, 잠시 네이버와 다음에서 한분씩 나와 시연을 합니다.



이번에는 NHN의 Ajax'ter 송효종님 세션. 네이버의 완소 서비스중 하나인 디지털 뉴스 아카이브를 가지고 HTML5 적용한 모습을 보여주었습니다. 예전에는 웹의 표현 한계상 플래시를 사용할 수 밖에 없었지만, HTML5가 적용된 IE9가 널리 보급되면 브라우저 자체에서 플러그인 없이 이런 효과들을 매끄럽게 구현할 수 있겠지요.


"개발은 밤낮으로 엄청 힘들게 했는데.. 시연은 이렇게 순식간에 해버리네요."

아.. 눈물이 앞을 가립니다.


이번에는 다음에서 힘든것만 개발하는 문경두님 등장입니다.


자 박수쳐주세요~



이분은 다음에서 에디터 부분이랑 로드뷰 개발하시는 분인데, 제가 매번 이 다음 블로그에서 글 쓰다가 에디터 때문에 짜증나면 메일로 버그 리포트하고 땡깡부리는데, 그거 다 받아주시던 분입니다. 실제로 만나뵈니 생각보다 젊고 개그 센스가 있더라구요. 이번 발표때도 시청 광장 로드뷰 화면에 각 호텔 외벽마다 소녀시대 동영상을 오버레이로 돌려버리더군요. 동영상 5개를 동시에 재생하고 이리저리 로드뷰 화면을 움직여도 버벅거리지 않는 모습이 인상적이었습니다. 참고로 아이폰용 웹버전 로드뷰는 이미 플래시 말고 HTML5로 구현되어 돌아가고 있다네요.




문경두님 데모는 여기서 마치고 다시 리건님 등장.



이번 테마는 '안전한 웹'입니다.



총 12억개의 위험 요소를 차단했고, 1억 6000번 피싱 사이트를 차단했답니다. 위에 표는 단순히 IE 쓰는 사람이 많아서 저렇게 나온게 아니라, 100%중 저만큼 막아준다는 뜻입니다. 그리고 이런 자동 차단 외에도 다운로드 평판을 관리할 수 있다고 합니다.



다운로드 관련 안내창도 이젠 화면 밑에서 뜬답니다. 


이번엔 '깨끗한 웹'입니다.



좌측부터 순서대로 IE9, 파이어폭스, 크롬입니다. 창모드일때 IE가 더 세로 공간을 넓게 쓸 수 있는걸 알 수 있습니다. 탭과 주소줄을 통합하고, 상태 표시줄도 크롬처럼 감춰놨네요. 근데 전체화면으로 키워보면 크롬이 IE9보다 세로 공간을 적게 차지할것 같습니다. 왜냐하면 크롬은 상단 공간까지 활용하니까요.


그 부분에 관련해서는 "병적인 구글 크롬의 세로 사이즈 활용" 이라는 글에서 예전에 적은 바가 있습니다.



"의혹을 제기하지 말고 증거를 대!" 할것 같아서 전체화면으로 키워서 실험을 해봤는데, 어쭈구리? 웬일로 IE9가 공간을 덜 차지합니다. 4px 차이로 크롬보다 얇습니다. 몹시 견제스러운 느낌이지만 전 이런 공간 활용 좋아합니다. 기왕에 만드는 김에 구글 크롬처럼 탭을 위에 붙이면 좋으련만..



이렇게 빈 탭에 자주 가는 사이트를 쭈욱 정렬해서 보여주는 기능도 들어갑니다. 구글도 비슷한게 있지만, 일일히 건드리지 않아도 알아서 해주는 이런것도 참 좋네요. 어차피 다들 비슷할테니..


뿐만 아니라 favicon 아이콘에서 자동으로 색을 추출해서 뒤로가기/앞으로가기 버튼을 그 색으로 바꿔주는 기능도 들어갔습니다. 이 기능 아주 재미있게 쓸 수 있을것 같아요. 위에 스샷 보시면 지마켓이나 다음, 네이버의 색을 추출해서 그래프에 적용한걸 보실 수 있습니다.




요런식으로 폰트 렌더링도 향상되었다고 합니다. 자료만 보면 굉장히 좋아보이네요. 사파리는 좀 안습이군요.. 근데 윗줄과 아랫줄 둘 다 볼드처리 안된거겠죠? 일단 제 나름대로 테스트를 해봤습니다. 아래 스샷 보시죠.



위로부터 IE9, IE8, 크롬7, 파폭3.6입니다. 뭐랄까 IE9가 너무 많이 진한것 같습니다. 크롬과 파폭은 글씨들을 양옆으로 당겨서 굵게 처리하는 반면에, IE8과 IE9는 위아래로도 굵게 처리하는것 같습니다. 전 IE8의 방식이 제일 맘에 드네요. 깔끔하기는 크롬/파폭이 제일 나은것 같고..



이번에는 제 블로그 옆 사이드바입니다. 다음 블로그쪽 문제인지 IE9 베타의 버그인지 글씨가 붙은게 좀 보이네요. 이 부분은 누구 잘못인진 모르겠지만 얼른 해결되었으면 좋겠습니다. 아.. 역시 다음은 파폭만 편애하는지 크롬에선 레이아웃이 밀리네요. 줄간격이 약간 에러군요. 여튼 베타 버전이니 판단은 좀 미뤄두겠습니다.




와우, 환영할만한 부분. 기존 IE들은 저렇게 테두리에 쓸데없이 라인이 들어있었는데, 저게 빠집니다. 디자인 하는 분들 살맛나겠네요. 전체화면 할때도 깔끔하게 내용만 보여질테니 다행입니다.





워어, 이런식으로 작업표시줄에서 바로 트위터로 메시지도 쓸 수 있습니다. 최신 유행을 선도하네요.


여기까지 설명한 IE9 베타버전은 이곳에서 다운받으실 수 있습니다.

ie9html5.com


잠시 쉬는시간. 리건님은 자전거 타고 퇴장합니다.


사람이 하도 많이 와서 줄이 좀 기네요.

다들 육포 하나씩 들고 먹고 있는데, 전 너무 일찍 들어와서 못받았습니다ㅠㅠ




다음 세션은 한국 MS에서 IE랑 라이브 제품군의 개발 주기 전체를 책임진다는 이중영 책임연구원님이 나와 IE9의 베타 개발 이야기에 대해 강연을 해주었습니다.




정보 표시줄 나오는 위치 바뀐것에 대해 이야기중.

'삐릭' 소리나면서 상단에 ActiveX 창 뜨는거 참 압박이었죠 ㅎㅎ


IE9에서 있을 수 있는 ActiveX 호환성 문제를 테스트하는 방법에 대해 이야기 중입니다. 저는 잘 모르는 내용입니다만, 실무에서 ActiveX 개발하시는 분들은 많은 도움이 될것 같습니다.



호환성도 베타 초기임에도 불구하고 괜찮게 시작하네요. 각 업체들은 IE9 정식 버전 나왔을때 우왕좌왕하지 않도록 미리서 대비를 해야할겁니다. 특히나 인트라넷에서 IE6만 지원하는건 웹 환경의 개선을 가로막는 주요 원인이죠.


다음 세션은 모비젠에서 모바일 어플리케이션 개발하는 허광남님.



자, 오늘 하루 긴시간동안 앉아서 강연 들었으니 팔 쭈욱 펴줍니다~!





허광남님, aka Kenu님은 일종의 '좌빨 개발자 커뮤니티'인 OKJSP를 운영하고 있습니다. 근로 환경 개선에 대한 기사글 나오면 대부분 OKJSP에서 나온 내용들이죠ㅎㅎ


"듀얼 모니터 안쓰면 그게 직원인가요? 알바지 ㅋㅋ 왜그러세요 모니터 하나만 쓰는 사람들처럼 ㅋㅋㅋ"

매번 강연 들을때마다 이런 개그 드립이 너무 재미있습니다. 수염 깎고 안경 벗으니 느낌이 확 다르네요.




IE9에 포함된 '개발자 툴'을 이용하는 방법을 주제로 강연을 해주셨습니다. 파이어폭스에서 제일 완소 기능이 '파이어버그'였는데, 이거 쓰는 맛은 써본 사람만 알지요. IE9에도 여기 필적할만한 강력한 개발자 도구가 들어갔습니다. 조금씩 조금씩 일하기 편해지는군요.


다음 세션은 NHN에서 힘든 일을 주로 담당하는 정찬명님의 'IE6부터 IE9까지 대응하기'강연입니다.



ㅋㅋ 슬라이드에 뼈가 있습니다. 어떤 분들은 IE6가 싫다며 IE6를 지원하지 않겠다고 선언하는데, 이 말은 손님의 1/3을 받지 않겠다는 말이랑 같다는거죠. 외국의 경우엔 IE6의 점유율이 거의 바닥을 쳤지만, 우리나라는 아직 가장 많은 사람들이 IE6를 쓰고 있습니다. 어쩔 수 없이 아직까지는 IE6를 안고 가야합니다. 내년 쯤에는 점유율 20% 밑으로 내려가길 기대합니다.


아래는 제가 그간 써온 IE6 관련 글들입니다.


현재는 약 35% 정도의 사용자들이 IE6를 쓰는 중이고, IE7과 IE8이 30%/30%씩 사이좋게 나눠갖고 있지요. 둘 다 합치면 IE만 95%인 셈입니다. 국내 금융 환경상 IE를 놓기는 힘드니, 전 가능한한 빨리 IE6만이라도 어떻게 윗 버전으로 업그레이드 했으면 좋겠어요. 참고로 IE9는 XP에선 지원이 안됩니다. 결국 윈도우 XP가 물러나야 IE6가 퇴장하겠지요. IE7은 뭐 탭 하나만 생겼을 뿐 그게 그거고, IE8은 좀 쓸만은 해졌는데 타 브라우저에 비해 경쟁력이 없었지만, 이번 IE9는 굉장히 내세울게 많아졌으니 아주 많이 기대하고 있습니다. 거의 뭐 다 좋아졌으니.. 이번에는 좀 홍보 팍팍 때려서 IE9 점유율이 금방 올라갔으면 좋겠어요. 예전에 IE8 다운로드 화면의 삽질 UI 사례를 적은 적이 있는데, 이 부분도 사려깊게 배려하여 부디 잘 되었으면 좋겠습니다.






IE6와 IE7은 표준 준수율 차이가 거의 없고, IE8과 IE9는 거의 비슷하답니다. ACID2 테스트 화면은 매번 보면서 느끼는거지만 좀 무서워요 ㅠㅠ


다음 순서는 많은 사람들의 기대와 실망이 교차하는 경품 추첨의 시간입니다.



엑스박스360 세대랑 아크 키보드가 경품으로 나왔네요.



ㅎㅎ 전 항상 행운의 주인공은 못되네요. 마지막 추첨까지 끝나니 사람들이 썰물 빠지듯 퇴장합니다.


IE6를 위해서라도, IE9가 잘 해주었으면 좋겠습니다. IE6 쓰시던 분들, 이거 정식 버전 나오면 업데이트 꼭 해보세요. 아주 빨라지고 좋아졌습니다.