6. GPU 하드웨어 가속 테스트
최근 인터넷이 점차 더 화려해지고, 다양한 멀티미이어 컨텐츠를 실시간으로 전송하고, 여가에 사용자 편의성이 강화된 인터페이스를 갖춰감에 따라 더 이상 소프트웨어적으로 이를 구현하는데 한계를 보이기 시작하였다.
이런 문제를 효율적으로 해결하기 위한 방안으로 제시된 것이 바로 웹 브라우저가 하드웨어 가속 기능을 적극적으로 활용하는 것이다. 이렇게 CPU가 대신할 작업들을 그래픽 카드의 GPU가 일정 부분 전담하게 되고 이를 통해 보다 빠른 그래픽 처리가 가능해짐으로 개발자들은 조금 더 여유있는 그래픽이나 동영상, GPU 등을 웹을 통해 구현할 수 있게 되었으며 이를 통해 웹 환경은 급속한 변화를 가져왔다.
테스트에 사용된 브라우저중 IE 9, 크롬 10, 파이어폭스 4은 하드웨어 가속을 지원하며, 사파리 5와 오페라 11은 현시점까지 지원이 되지 않고 있다.
|
IE 9의 GPU 가속 설정
|
|
크롬 10의 GPU 가속 설정
|
|
파이어 폭스 4의 GPU 가속 설정
|
GPU 설정의 경우 IE 9와 파이어폭스 4는 옵션 내에서, 크롬 10은 주소창에 about:flags를 입력후 실험실 기능에서 GPU Accelerated Compositing와 GPU Accelerated Canvas 2D 항목을 설정하면 된다. 참고로 IE 9와 파이어폭스4 의 경우 기본적으로 GPU 가속 항목이 활성화 되어있지만 크롬 10의 경우 그렇지 않기 때문에 사용자가 직접 변경을 해주어야한다.
웹 브라우저들이 자바스크립트 보다는 하드웨어 가속에서 성능 차이를 많이 보여주고 있다. 기존의 벤치마크로는 하드웨어가속 성능을 완전하게 테스트하기 어렵다. 우선 MS에서 제공하는 테스트 페이지중 GPU 성능을 측정할 수 있는 몇가지 항목을 살펴보도록 하자.
|
|
| 항목
|
IE 9
|
크롬 10
|
파이어폭스 4
|
사파리 5
|
오페라 11
|
| Fish Tank
|
60 fps
|
48fps
|
54fps
|
3fps 이하
|
3fps 이하
|
|
Fish Tank는 MS가 IE9 제품 발표회에에서 GPU 가속 성능의 우위를 보여주기 위해 제공한 데모중에 하나로 물고가의 수를 1000마리로 설정 하였을 경우 여타 다른 브라우저에 비해 물고기의 움직임이 상당히 빠르면서도 유연한 움직임을 확인할 수 있다.
이는 IE9의 경우 DirectWrite(Direct2D)를 이용해 그래픽을 구현하고 DX10.1이상에서 추가된 d2d를 통해 GPU가속에 svg와 canvas를 사용해 10.1 이상 지원하는 그래픽 카드에서는 더욱더 뛰어난 성능을 보여주기 때문이다.
특히 하드웨어 가속을 지원하는 크롬 10과 파이어폭스 4보다 더욱더 뛰어난 하드웨어 가속 성능을 보여주고 있는데, 이에 비해 하드웨어 가속 기능을 지원하지 않는 사파리5와 오페라11의 경우 거의 정지화면상태의 화면을 보여주어 큰 대조를 이루고 있다. 다만 해당 데모가 MS에서 제공하는 것인 만큼 참고로만 삼아야 할 것이다.
|
|
| 항목
|
IE 9
|
크롬 10
|
파이어폭스 4
|
사파리 5
|
오페라 11
|
| Speed Reading
|
60 fps
(6초)
|
60fps
(14초)
|
52fps
(16초)
|
6fps
(1755초)
|
9fps
(1365초)
|
|
또 다른 데모인 Speed Reading를 이용한 테스트 결과를 살펴보면 IE9와 크롬10 모두 60프레임 이상을 제공하는데, 최대 60프레임으로 제한되어 있기 때문에 동일하게 60프레임의 결과를 보여주고 있는 것이다. 파이어폭스는 이보다 다소 느린 52프레임을 제공하는데 실제 테스트에 소요된 시간을 살펴보면 IE9가 6초로 2등인 크롬 10에 비해서도 2배 이상 빠른 모습을 보여주고 있다.
물론 하드웨어 가속을 지원하지 않는 사파리5나 오페리11의 경우 순전히 CPU 연산에만 의존하기 때문에 10프레임 이하의 낮은 성능을 보여준다.
OpenGL ES2.0에 기반한 WebGL
현재 IE를 제외한 크롬과 사파리, 오페라와 파이어폭스의 경우 OpenGL ES2.0 에 기반한 WebGL의 GPU을 지원한다. 비영리 단체인 크로노스 그룹에 의해서 관리되고 있는 WebGL은 간단히 말하자면 웹 기반의 라이브러리로 별도의 플러그인 없이 3차원 컴퓨터 그래픽 API를 제공하는 HTML5의 캔버스를 사용한다.
WebGL에서 제공하는 데모를 통해 GPU 가속을 통한 성능 향상을 살펴보자.
|
|
|
항목
|
IE 9
|
크롬 10
|
파이어폭스 4
|
사파리 5
|
오페라 11
|
|
WebGL Aquarium
|
x
|
46fps
|
22fps
|
-
|
-
|
|
앞서 IE9의 하드웨어 가속 테스트에서 사용된 수족관이 2D 기반이었다면, Web Aquarium의 경우 별도의 플러그인 없이 3D를 표현해주고 있다. 물론 프로젝트에 참가하지 않은 IE9의 경우 실행조차 되지 않으며, 크롬10은 1920x1200 해상도에서 모든 옵션을 활성화했음에도 46프레임을 보여주고 있다. 참고로 사파리와 오페라의 경우 개발자킷을 통해서 지원하며 별도로 WebGL을 설치해야하기 때문에 이번 테스트에서는 제외하였다. |
