Firefox, Canvas의 위력

Firefox가 1.5 로드맵 중에 Canvas 태그를 추가하고 SVG 표준 지원을 통해 Rich Internet Application에 좀 더 한발을 내딛었다.

파이어폭스에서도 1.5 (구, 1.1) 버전에 SVG와 함께 Canvas 태그를 삽입하여, XUL을 가지고 간단한 위젯을 구현할 수 있는 플랫폼을 선보인바 있습니다. 따라서 파이어폭스의 확장형 위젯과 야후! 위젯(콘파뷸레이터), 매킨토시 대시 보드 등 Rich한 Web기반 어플리케이션의 향배가 어떻게 될 지 매우 흥미 진진합니다. …야후, 콘파뷸레이터 인수중에서

Firefox 1.5 (RC)버전이 깔려 있는 사람이라면 몇 십줄 정도의 XML과 자바스크립트 코드로 만든 SVG Tetris를 보면 큰 감명을 받을 것이다. 오늘 감명 받을 예제가 하나 더 있으니 바로 Canvascape – “3D Walker”이다.

몇 십줄의 자바 스크립트와 CSS를 가지고 3D 엔진을 넘가하는 그래픽을 선보였다.
만든 사람도 대단하다.

여러분의 생각

  1. 사파리에서도 잘 되네요. 너무 신기해요!

  2. 대, 대단하다….

    MS, 긴장 좀 하자~

  3. 근데…VRML, VML로 2000년도 초반에 이미 ie에선 만들었던 기술 같은데요..ㅡ.ㅡ;;
    외국 어디 DHTML사이트에서 저런것은 많이 봤드랬죠..

    ie는 너무 앞서나가서 손해보는게 상당히 많아보입니다.

  4. vrml은 sgi에서 만든 기술로 netscape에서 plugin으로 구현된 기술이었습니다. (물론 ie에서도 plugin이 됐겠지만) 브라우저 내장 기술은 아니었죠. vml 역시 office같은 문서를 브라우저에 표현하기 위한 2차원 벡터 그래픽 기술입니다. adobe의 pgml과 표준 경쟁하다가 지금은 w3c의 svg로 통합됐지만 그 이후 ms는 svg는 거들떠도 보지 않고 있죠. IE는 앞서나가는 게 아니라 항상 뒤따라가다가 방치해 둬서 문제입니다.

    이 모델은 웹 표준인 HTML(Canvas)SVG/Javascript/CSS만 가지고 만든 것입니다.
    언제 만들었냐가 아니라 뭘로 어떻게 만들었냐가 중요한겁니다.

  5. 이거 정말 괴물이네요.
    자바 스크립이 실시간 계산해낸 놈을
    맵을 그려내다니 orz

  6. 저기에 AJAX까지 응용하면, 온라인 게임도 되는거겠군요!!ㅠ_ㅜ)=b 대단해요.

  7. 와 대단하네요…

  8. HTML 소스를 보니 canvas 태그를 사용했군요.
    canvas와 VRML은 3D 그래픽 품질면에서 비교대상이 되지 않습니다.
    canvas는 단순한 2D 그래픽스 기술로서 gradient coloring과 같은 약간 고급의 2D 그래픽스를 지원하여 약간의 3D 효과를 준 것 뿐, canvas의 한계로 인해 실제로는 더 고급의 3D 효과를 낼 수가 없으며, 자바 스크립트의 한계로 인해 좀 더 큰 어플리케이션을 개발하는 데는 크게 어려움이 따를 것입니다.

  9. 그러나, VRML은 크고 복잡한 3D 렌더링 엔진의 지원이 필요한 기술입니다.

  10. 즐건하루: 저는 그렇게 보지 않습니다. web application 최종 버전에는 canvas의 3d 지원이 완벽해 질 것입니다.

  11. CN: OpenGL ES-like 3D API를 말씀하시는 것 같은데, 결국은 그렇게 되겠지요.
    그뿐만 아니라 사운드 API와 멀티미디어 API등 UI와 관련된 API는 결국 모두 제공될 것 같군요.

    canvas 기반 AJAX 기술과 DOM 기반 AJAX 기술이 너무나 달라서 사실상 별개의 기술이라고 볼 수도 있겠습니다.

    canvas 기반 AJAX 기술의 장점에 대해서는 생각해 볼 필요가 있습니다.
    임베디드 오브젝트나 stand-alone 어플리케이션보다는 배포 문제나 보안 문제가 덜하기는 합니다.
    그와 같은 low-level 그래픽스 API와 스크립트 언어로 프로그래밍할 수 있는 플랫폼은 플래쉬 런타임을 대신할 수는 있을 것입니다.
    아주 간단한건 직접 프로그래밍할 수 있겠고 좀 더 복잡한 것은 플래쉬처럼 저작 도구를 사용하면 플래쉬 런타임을 능가하는 기술이 될 것이기 때문입니다.
    그러나, 이 방식은 개발 용이성 면에서는 stand-alone application이나 임베디드 오브젝트보다는 휠씬 불리해보입니다.

    또한, canvas 기반 AJAX 기술과 DOM 기반 AJAX 기술의 장점인 프로그래밍 코드와 컨텐츠의 완전한 분리 및 문서 컨텐츠 전반에 걸친 프로그래밍의 제어로 인한 장점도 없습니다.

의견 쓰기

이름* 이메일* 홈페이지(선택)