HTTP/2의 시맨틱스: 새로운 활용 사례

1.0 반응형 디자인

이전 유저 에이전트 정보를 보고 모바일, 웹 등을 구분하여 콘텐츠를 배포하는 방식이 주류였다. 현재는 작은 화면에 적합한 레이아웃 또는 테블릿의 가로와 세로에 각각 최적인 레이아웃 등 다양한 경우 적절하게 표현할 수 있도록 하는 것이 반응형 디자인이다.

 

2.0 시맨틱 웹

웹에서 표면적인 '텍스트', '문서'가 아니라 '의미'를 다룰 수 있게 해서 웹의 가능성을 더욱 넓히고자 하는 운동이다. 웹의 아버지인 팀 버너스리가 주장했다. 시맨틱 웹에서 '의미를 다룬다'는 것은 페이지에 포함된 정보를 분석해서 정보를 집약하거나 검색하는 과정을 사람 손을 거치지 않게 하는 것이다. 그러기 위해서 데이터를 정규화해 프로그램에서 접근 가능한 형태로 만들어야 한다. 

 

1. RDF

시맨틱 웹의 최초로 URI로 식별되는 엔티티 간의 관계성을 기술한다. 

 

2. 더블린 코어

컴퓨터 전문가가 아니더라도 알기 쉬운 용어로 제안. 자원은 대부분 누군가의 저작물인 경우가 많은데, 효과적으로 검색할 수 있도록 저작물 특유의 특성을 정의. 오픈 eBook이라는 규격에 포함되는 파일 목록과 서적 정보를 담은 OPF 파일이라는 EPUB 파일의 핵심 파일이 있다. 해당 파일의 dc:로 시작하는 메타데이터가 더블린 코어의 구성 요소이다.

 

3. RSS

RDF의 응용 사례로서 가장 성공한 것으로 웹사이트의 업데이트 기록 요약에 관한 배급 형식이다. 블로그나 웹사이트를 업데이트하면 블로그 엔진과 콘텐츠 관리 시스템이 자동으로 업데이트 한다. 이 RSS 파일에는 새로운 순서대로 신규 콘텐츠의 요약이 저장된다.

 

4. 마이크로포맷

RDF와 달리 HTML 태그와 클래스를 사용해 표면해 간다. 웹사이트 간의 공유 용어집(스키마)을 카탈로그화해서 정보 유통을 활성화한다. 자세한 내용은 microformats.org에 집약되어 있다.

 

5. 마이크로데이터

WHATWG, W3C 등에서 논의돼 온 HTML에 삽입 가능한 시맨틱 표현 형식이다. 마이크로포맷과 마찬가지로 어휘집을 가지고 있으며, 현재도 검색 엔진이 지원한다. 마이크로포맷과 다리 기존 HTML 속성과 충돌하지 않도록 고유 속성을 사용한다. 

 

6. RDF의 역습

RDF 자체는 널리 사용되지 않았지만, 이후에 여러가지 파생 포맷이 만들어졌고 schema.org에 대량의 어휘집이 게재되어 있다. schema.org에서는 예제 데이터로 마이크로데이터, RDFa, JSON-LD 세 종류를 게재했다. 구글이 추천하는 포맷으로서 향후 가장 많이 이용될 것으로 예상되는 것이 JSON 형식의 JSON-LD이다. 

 

 

3.0 오픈 그래프 프로토콜

오픈 그래프 프로토콜은 소셜 네트워크에서 사용되는 메타데이터로, 소셜 네트워크에서 가장 높은 점유율을 자랑하는 페이스북이 개발했다. 오픈 프로토콜이 설정된 웹사이트의 URL을 SNS 등에 붙여 넣으면 기사의 일부가 인용되고 이미지도 표시된다. 티스토리에서도 사용되고 있다. 아래 사진과 같이 링크를 붙였을 때 나타난다.

오픈 그래프 프로토콜은 더블린 코어, link-rel canonical, 마이크로포맷, RDFa에 영감을 받았다고 되어 있으므로 시맨틱 웹의 자손이라고 볼 수 있다.

 

4.0 AMP

휴대 기기에서 웹페이지의 로딩 속도를 빠르게하는 방법이다. 네트워크 환경이 나쁜 나라에서는 극적인 사용자 경험 향상을 얻을 수 있다고 한다. 어떤 페이지에서나 속도가 빨라지는 것은 아니고, 구글에서 말하길 뉴스, 요리법, 영화 목록, 제품 페이지, 리뷰, 동영상, 블로그 등 모든 유형의 정적 웹 콘텐츠에서 효능이 있다고 한다. 

 

5.0 HTTP 라이브 스트리밍에 의한 동영상 스트리밍 재생

HTTP 라이브 스트리밍(HLS)은 애플이 2009년에 제창한 동영상 스트리밍 재생 방식이다. HLS의 내부는 매우 단순하다. WWDC 2016에서 HLS를 소개한 세션의 페이지는 <video> 태그를 사용한다. 

 

5.5 HLS의 장점과 단점

HLS의 장점은 서버와 클라이언트의 통신에 특수한 프로토콜이 아니라 전 세계 라우터가 지원하는 HTTP를 사용하는 점이다. 만약, 특수한 프로토콜이라면 전용 서버를 설치하고 통신할 포트를 열어야 할 필요가 있다. 하지만, HLS는 HTTP이므로 일반 웹 서버와 동일한 서버를 사용할 수도 있고, 콘텐츠 전송 네트워크 또한 사용할 수 있다.

 

단점으로는 '스트리밍'라고 자칭하지만, 실체는 점진적 다운로드 방식이라는 점이다. 청크별로 다운로드가 끝나지 않으면, 재생이 시작되지 않으므로 지연이 발생한다. 애플의 자료에서는 표준으로 30초 정도 지연이 있다고 적혀 있다. 12초의 청크로 회선이 허용하는 최대 화질로 영상을 재생하려면 '12x2+인코딩 시간'만큼 지연이 발생한다.

 

가장 큰 단점은 지원되지 않는 환경이 많다는 점이다. 특히, 데스크탑에서의 지원이 좋지 않다. 

 

6.0 MPEG-DASH 동영상 스트리밍 재생

HTTP 라이브 스트리밍은 애플이 제창한 방식이었지만, 다른 브라우저의 밴더는 더 폭 넓게 공통화할 수 있는 기술로서 수 많은 동영상 포맷을 배출한 MPEG 컨소시엄에서 표준화를 진행하고자 했다. 

 

DASH는 Dynamic Adaptive Streaming over HTTP의 약자로 HTTP를 사용해 동적으로 적절한 비트레이트로 스트리밍하는 방식을 뜻한다. MPEG-DASH가 목표하는 방향은 HLS와 거의 같고, HLS를 대폭 확장한 것이다. 

 

MPEG-DASH 또한 HTTP를 통한 점진적 다운로드를 핵심으로 하는 스트리밍 방식이다. 레퍼런스 구현으로서 video.js라는 라이브러리가 제공된다. 해당 라이브러리를 이용하면 브라우저에서 MPEG-DASH를 사용할 수 있다. 

 

6.1 MPEG-DASH와 HLS 재생 방법의 차이

HTTP를 통한 점진적인 다운로드를 핵심으로 하는 스트리밍 방식이라는 점에서 같지만, 대전제가 되는 재생 방법이 달라진다.

 

HLS는 HTML에서 재생한다기보다는 브라우저 자체에 HLS의 .m3u8 파일을 해석해서 재생하는 시스템이 포함되어 있었다. 또한 mac OS에서 미디어 플레이어 프레임워크를 이용하여 브라우저 이외에서도 재생할 수 있다.

 

마찬가지로 MPEG-DASH도 브라우저 외의 뷰어가 있다. 레퍼런스 구현으로는 자바스크립트로 만든 동영상 플레이어 dash.js가 제공된다. 브라우저 자체에서 프로토콜을 직접 해석하는 것이 아니라 데이터 분석은 자바스크립트로 하고 동영상 재생은 브라우저의 코덱을 자바스크립트에서 다루는 API, HTML5 Media Source Extensions를 이용해 실시한다. 

 

애플은 제공하지 않지만, MPEG-DASH와 같은 Media Source Extensions을 사용해 지원하지 않는 브라우저로도 HLS를 재생하는 동영상 플레이어도 이미 개발됐으며, 다양한 프로그램과 라이브러리가 두 방식을 다 지원하고 있어 현재는 차이가 거의 없어졌다고 봐도 문제 없다. 또한, 2016년 WWDC에서 애플은 MPEG-DASH 측에 양보하는 발표를 했다. Fragmented MPEG4를 지원하고, 이를 통해 MPEG-DASH와 같은 미디어를 사용할 수 있게 되었다.

 

 

 

 

Reference

• 리얼월드 HTTP