게임부터 화상연결까지…뜨는 웹 표준 기술 8가지

웹이 제2의 전성기를 맞았다. 디바이스와 플랫폼이 늘어나면서 브라우저만 있으면 어디에서나 동일한 콘텐츠를 제공할 수 있는 웹 기술이 각광받고 있다. 덕분에 한때 네이티브 애플리케이션에 밀려 사망선고까지 받았던 웹이 기사회생을 넘어 기술 혁신의 이이콘으로 떠올랐다.

웹표준화단체 월드와이드웹컨소시엄(W3C)의 대한민국관심그룹(KIG) 의장인 이원석 한국전자통신연구원(ETRI) 표준연구본부 박사는 6일 서울 삼성동 코엑스에서 열린 'W3C HTML5 컨퍼런스' 기조연설을 통해 "웹이 자동차, 사물인터넷(IoT) 등 다양한 디바이스에서 사용되는 애플리케이션 및 콘텐츠 기술로 자리 잡고 있다"며 "웹이 다시 한번 혁신하고 있다"고 강조했다.

웹 앱은 성능이 중요한 분야에 적합하지 않다고 여겨졌지만, 이런 인식도 바뀌고 있다. 대표적인 사례가 게임 분야다.

이원석 박사는 "몇 년 전만 해도 성능 때문에 게임은 HTML5로 구현할 수 없는 영역으로 여겨졌지만 이젠 캐주얼 게임을 중심으로 HTML5로 전환이 일어나고 있다"고 말했다.

그러면서 "친구와 메신저로 대화를 나누다가 같이 게임을 하려면 게임을 설치하는 일이 굉장히 불편했는데 HTML5 게임은 웹뷰 위에 콘텐츠만 올리면 바로 동작하기 때문에 설치가 필요 없고 게임을 하다 다른 게임으로 전환하기도 번거롭지 않다는 장점이 있다"고 설명했다.

네이티브 앱을 뛰어넘는 성능과 기능을 갖추기 위한 노력도 지속되고 있다. W3C는 네이티브와 격차를 줄이기 위해 지속적으로 웹 표준을 개선·발전시키고 있다. 2014년 말 HTML5 최종 표준 제정됐고, 올해 말엔 HTML5.2이 나왔다.

이원석 박사는 최근 특히 주목해야 할 웹 기술로 웹VR, 웹RTC, 웹 페이먼트, HTTPS로 전환을 꼽았다.

■웹 페이먼트

웹 페이먼트 기술은 모바일과 데스크톱에서 브라우저를 통해 쉽게 결제할 수 있는 생태계를 만드는 것이 목표다.

이원석 박사에 따르면 웹 페이먼트 워킹그룹은 W3C 안에서도 가장 빠른 성과를 내고 있다. 구글, 애플, 삼성전자, 알리바바, 비자 마스터 등 모든 플레이어가 참여해 표준을 빠르게 만들고 있고, 브라우저 지원도 빠르게 이뤄지고 있다.

이원석 박사는 "특히 국내는 여전히 액티브X를 써서 결제해야 하는 사이트가 많기 때문에 생태계를 정리하는 차원에서 웹 페이먼트 기술을 관심있게 지켜볼 필요가 있다"고 말했다.

■웹 어셈블리

"이미 작성된 코드를 웹에서 쓸 수 있게 하자"는 것이 웹 어셈블리 기능의 가장 큰 목표다.

웹 어셈블리는 C나 C++ 등으로 작성된 언어라도 로우레벨가상머신(LLVM)라는 바이트 코드로 변환한 다음에, 이것을 다시 자바스크립트로 바꿔준다. 즉 다른 언어로 작성된 라이브러리를 자바스크립트로 변환해 주기 때문에 모든 브라우저에서 구동이 가능해진다. 기존 라이브러리, 프로그램을 재활용할 수 있게 된다.

이원석 박사는 "적용할 수 있는 분야가 많은데 특히 게임과 얼굴인식분야가 유망하다"고 말했다. 그는 또 "앞으로 웹 생태계에 좋은 영향을 미칠 중요한 기술이고 이미 메이저 브라우저 업체들은 다 지원하고 있다"고 강조했다.

■웹RTC

웹RTC는 웹 기반 실시간 양방향 영상전송 기능이다. W3C에서 웹RTC 표준 스펙을 완성하는데 거의 6년이 걸렸다. 이렇게 시간이 오래걸린 이유는 "웹RTC가 단순한 API표준이 아니라 화상기반의 새로운 애플리케이션을 만들 수 있는 프레임워크이기 때문"이라고 이원석 박사는 설명했다.

이원석 박사는 "굉장히 많은 프로토콜 표준, 코덱 표준, API 표준을 만들면서 오려걸렸다"며 "앞으로 웹RTC를 이용한 상용 서비스가 엄청나게 늘어날 것"이라고 예상했다.

■서비스워커

서비스워커는 오프라인 상태에서도 웹앱이 작동할 수 있게 해주는 기능이다. 웹 데이터를 모바일 기기에 캐시로 저장해 놓고 정보를 캐시에서 꺼내오는 방식이다. 또 브라우저가 닫힌 상태에서도 동작하는 특성 덕분에 푸시 알림도 보낼 수 있고, 인터넷 연결이 끊기면서 중단된 작업을 인터넷이 연결되면 바로 재개할 수 있다.

서비스워커는 과거 웹 프레임워커 워킹그룹에서 논의됐으나, 최근 페이스북 등 기업들이 관심을 많이 보이면서 별도의 서비스워커 워킹그룹이 만들어졌다.

이원석 박사에 따르면 서비스워커 안에서도 새로운 논의가 이뤄지고 있다. '웹 백그라운드 싱크로나이제이션'이라는 표준이 따로 만들어지고 있다.

이 기능은 사용자가 데이터를 저장하지 않고 서비스에서 이탈해도, 데이터가 사라지지 않도록 백그라운드에 저장해 준다.

웹VR 기술 스택 설명

■웹VR

웹VR은 말그대로 가상현실(VR) 콘텐츠를 웹 기반으로 구현해 주는 기술이다. 이원석 박사는 "기존 VR 기술에 한계가 많기 때문에" 기업들이 웹VR 기술에 관심이 많다고 강조했다.

기존 VR 기술의 한계는 크게 3가지다. 먼저 헤드마운트디스플레이 등 VR콘텐츠를 사용하기 위해 디바이스가 필요하기 때문에 유저 확보가 어려웠다. 또 디바이스 플랫폼 마다 콘텐츠를 따로 만들어야 하기 때문에 콘텐츠 확보와 배포에 어려움이 컸다. 더불어 VR디바이스를 가지고 있는 사용자와 그렇지 않은 일반 인터넷 환경 사용자들이 함께 커뮤니케이션 할 수 있도록 VR 콘텐츠의 확장이 필요했다.

이원석 박사는 "기업들은 이런 문제를 풀 수 있는 해법이 웹이라고 보고 있다"며 "이미 웹 개발자가 많고, 웹VR로 콘텐츠를 만들면 디바이스 제조사에 상관 없이 모든 플랫폼에서 사용할 수 있게 된다"고 설명했다.

웹 진영도 웹VR 기술을 중요하게 보고 있다. 이원석 박사는 "기존 웹 콘텐츠에서 주지 못했던 경험을 VR콘텐츠를 통해 더 풍부하게 소비할 수 있는 환경이 제공된다는 측면에서 웹 콘텐츠의 업그레이드를 가져올 수 있다고 본다"고 설명했다.

브라우저에서 웹VR 콘텐츠를 실현시켜 주는 웹GL 2.0 API도 중요하다. 웹GL 2.0 API는 웹VR 콘텐츠를 만들 때 브라우저가 제공해 줘야하는 로우레벨 API다. 크롬과 파이어폭스는 웹GL 2.0을 지원하고 있다.

■CSS 후디니(Houdini)

CSS 후디니는 "웹 개발자들이 렌더링을 핸들링할 수 있는 인터페이스를 만들어 주자"는 목적으로 나왔다.

CSS후디니는 특정 기능이 지원되지 않는 브라우저에 사용하는 코드조각인 '폴리필코드'와 유사하게 작동한다. 예컨대 웹소켓을 써야하는데 어떤 브라우저는 웹소켓을 지원하지 않을 수 있다. 웹소켓을 지원하지 않는 브라우저에도 웹소켓이 돌아가는 것처럼 에뮬레이션 해주는게 폴리필코드로 가능하다.

CSS후디니를 쓰면 렌더링 쪽에서도 이런 일이 가능해진다. 이원석 박사는 "새로운 렌더링 기능이 나왔왔을 때 이 기능이 엔진에 구현되지 않은 브라우저에서도 구현할 수 있게 된다"고 설명했다.

■브라우저 익스텐션 API

브라우저마다 익스텐션(확장) 추가 방식이 달랐는데, 최근엔 크롬 익스텐션 API 방식으로 통일되는 추세라고 이원석 박사는 설명했다.

이미 크롬, 파이어폭스, 엣지에서 지원한다. 아주 작은 코드만 수정하면, 다른 부라우저에서도 익스텐션 앱을 동작시킬 수 있게 됐다.

■웹 플랫폼 인큐베이터

웹 플랫폼 인큐베이터는 워킹그룹보다 가볍고 빠르게 웹표준 기술 논의를 진행하는 곳이다. 이원석 박사는 재미있는 프로젝트로 '쉐입 디텍션 API'와 '웹쉐어 API'를 소개했다.

셰입 디텍션(Shape detection) API는 이미지에서 얼굴 ,바코드, QR코드 인식을 할 수 있는 API 표준이다. 크롬, 오페라 지원한다.

웹셰어(web Share) API는 웹 앱에서 네이티브 앱으로 콘텐츠를 공유할 수 있는 기능이다. 웹과 네이티브가 통합되고 있는 추세를 반영한 기능이라고 볼 수 있다. 안드로이드 크롬에 구현되어 있다.