{"id":1440,"date":"2022-11-22T17:32:54","date_gmt":"2022-11-22T16:32:54","guid":{"rendered":"https:\/\/websites.fraunhofer.de\/video-dev\/?p=1440"},"modified":"2022-11-22T17:37:42","modified_gmt":"2022-11-22T16:37:42","slug":"caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js","status":"publish","type":"post","link":"https:\/\/websites.fraunhofer.de\/video-dev\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\/","title":{"rendered":"Caption me if you can &#8211; WebVTT support for HbbTV terminals with dash.js"},"content":{"rendered":"\n<p>Following the german saying <em>&#8220;Ehre, wem Ehre geb\u00fchrt&#8221;<\/em> (<em>&#8220;honour to whom honour is due&#8221;<\/em>) we start this blog post a bit different &#8211; with the acknowledgements. First we would like to thank <strong><a href=\"https:\/\/www.arte.tv\/en\/\" target=\"_blank\" rel=\"noreferrer noopener\">ARTE<\/a><\/strong> for sponsoring and supporting the development activities and for providing the resulting source code back to the dash.js community. <\/p>\n\n\n\n<p>Next, we would like to thank Dan Sparacio for the inspiration for the title of this post. Dan recently gave a very interesting presentation at the <a href=\"https:\/\/2022.demuxed.com\/#schedule\" target=\"_blank\" rel=\"noreferrer noopener\">Demuxed conference<\/a>  titled <em>&#8220;Caption Me If You Can&#8221;<\/em>, talking about challenges and solutions while implementing timed text features for a global audience at Paramount.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Background<\/h2>\n\n\n\n<p>Since version 2.0.3 the HbbTV Specification officially supports the Media Source Extensions (MSE). The Encrypted Media Extensions (EME) are included in the HbbTV Specification since version 2.0.1. The availability of MSE and EME allows HbbTV application developers and content providers to move away from native DASH type-1 media-players to type-3 MSE\/EME based implementations. dash.js is a prominent option to be used as a library for playback of DASH content on HbbTV terminals. The official <a href=\"https:\/\/github.com\/HbbTV-Association\/ReferenceApplication\" target=\"_blank\" rel=\"noreferrer noopener\">HbbTV reference application<\/a> uses dash.js as a <em>&#8220;player for devices without a suitable native player&#8221;<\/em> as well. <\/p>\n\n\n\n<p>dash.js offers support for multiple subtitles and captions formats including CEA608, CEA708, TTML, IMSC1, EBU-TT-D and WebVTT. However, the implementation for WebVTT differs in a way that it requires native rendering support by the underlying device. dash.js parses the WebVTT files or segments and then uses the native <code><a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/TextTrack\/addCue\" target=\"_blank\" rel=\"noreferrer noopener\">addCue<\/a><\/code>, <code><a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/TextTrack\/removeCue\" target=\"_blank\" rel=\"noreferrer noopener\">removeCue<\/a><\/code>, and <code><a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Web\/API\/TextTrackCue\/enter_event\" target=\"_blank\" rel=\"noreferrer noopener\">onenter<\/a><\/code> methods. The styling and rendering is handled by the platform itself.<\/p>\n\n\n\n<p>The HbbTV standard itself does not define native WebVTT support. Quoting from <a href=\"https:\/\/www.etsi.org\/deliver\/etsi_ts\/102700_102799\/102796\/01.06.01_60\/ts_102796v010601p.pdf\" target=\"_blank\" rel=\"noreferrer noopener\">v1.6.1<\/a> of the HbbTV specification it states:<\/p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p>Terminals shall be able to correctly render TTML based subtitles<\/p>\n<\/blockquote>\n\n\n\n<p>Consequently, we need support by the media-player itself for using WebVTT tracks on HbbTV terminals.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Implementation<\/h2>\n\n\n\n<p>The goal of the custom WebVTT implementation in dash.js is to support WebVTT tracks on HbbTV terminals while guaranteeing maximum flexibility for dash.js users. For that reason, we implemented the solution in a way that the custom rendering can easily be activated and deactivated using a single configuration flag:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>player.updateSettings({\n  streaming: {\n    text: {\n      webvtt: {\n        customRenderingEnabled: true\n      }\n    }\n  }\n})<\/code><\/pre>\n\n\n\n<p>Under the hood we are using <a href=\"https:\/\/github.com\/videojs\/vtt.js\" target=\"_blank\" rel=\"noreferrer noopener\">vtt.js<\/a> for the parsing and rendering of the WebVTT tracks. In addition, dash.js exposes an interface for the application to specify a rendering container element:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>player.attachVttRenderingDiv(vttRenderingDiv)<\/code><\/pre>\n\n\n\n<p>The bootstrap logic of dash.js as well as the internal handling are optimized to only call the relevant methods for one of the rendering methods, either native rendering or custom rendering. The screenshot below shows an early version of the implementation in which both rendering methods could be enabled for debugging purposes.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"4516\" height=\"1726\" src=\"https:\/\/websites.fraunhofer.de\/video-dev\/wp-content\/uploads\/2022\/11\/Bildschirmfoto-2022-11-22-um-16.19.48.png\" alt=\"\" class=\"wp-image-1447\" srcset=\"https:\/\/websites.fraunhofer.de\/video-dev\/wp-content\/uploads\/2022\/11\/Bildschirmfoto-2022-11-22-um-16.19.48.png 4516w, https:\/\/websites.fraunhofer.de\/video-dev\/wp-content\/uploads\/2022\/11\/Bildschirmfoto-2022-11-22-um-16.19.48-400x153.png 400w, https:\/\/websites.fraunhofer.de\/video-dev\/wp-content\/uploads\/2022\/11\/Bildschirmfoto-2022-11-22-um-16.19.48-698x267.png 698w, https:\/\/websites.fraunhofer.de\/video-dev\/wp-content\/uploads\/2022\/11\/Bildschirmfoto-2022-11-22-um-16.19.48-768x294.png 768w, https:\/\/websites.fraunhofer.de\/video-dev\/wp-content\/uploads\/2022\/11\/Bildschirmfoto-2022-11-22-um-16.19.48-1536x587.png 1536w, https:\/\/websites.fraunhofer.de\/video-dev\/wp-content\/uploads\/2022\/11\/Bildschirmfoto-2022-11-22-um-16.19.48-2048x783.png 2048w\" sizes=\"auto, (max-width: 4516px) 100vw, 4516px\" \/><figcaption class=\"wp-element-caption\"><em>Custom and native rendering of WebVTT subtitles in dash.js<\/em><\/figcaption><\/figure>\n\n\n\n<p>The corresponding <a href=\"https:\/\/github.com\/Dash-Industry-Forum\/dash.js\/pull\/4089\" target=\"_blank\" rel=\"noreferrer noopener\">pull request<\/a> has been merged to the development branch of dash.js, a <a href=\"https:\/\/reference.dashif.org\/dash.js\/nightly\/samples\/captioning\/vttjs.html\" target=\"_blank\" rel=\"noreferrer noopener\">sample<\/a> is available in the nightly build of dash.js.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Test results<\/h2>\n\n\n\n<p>Extensive tests carried out by ARTE and Fraunhofer FOKUS showed that the custom rendering solution works on all the tested devices:<\/p>\n\n\n\n<figure class=\"wp-block-table\"><table><tbody><tr><td><strong>Model<\/strong><\/td><td><strong>Manufacturer<\/strong><\/td><td><strong>Year<\/strong><\/td><td><strong>Native Rendering<\/strong><\/td><td><strong>Custom Rendering<\/strong><\/td><\/tr><tr><td>43UK6400PLF<\/td><td>LG<\/td><td>2018<\/td><td>&#8211;<\/td><td>Works<\/td><\/tr><tr><td>43UM7400PLB<\/td><td>LG<\/td><td>2019<\/td><td>&#8211;<\/td><td>Works<\/td><\/tr><tr><td>43UM71007LB<\/td><td>LG<\/td><td>2019<\/td><td>&#8211;<\/td><td>Works<\/td><\/tr><tr><td>43UM7050PLF<\/td><td>LG<\/td><td>2020<\/td><td>&#8211;<\/td><td>Works<\/td><\/tr><tr><td>43UO75006LF<\/td><td>LG<\/td><td>2021<\/td><td>&#8211;<\/td><td>Works<\/td><\/tr><tr><td>43UP75009LF<\/td><td>LG<\/td><td>2021<\/td><td>&#8211;<\/td><td>Works<\/td><\/tr><tr><td>43UQ75009LF<\/td><td>LG<\/td><td>2022<\/td><td>&#8211;<\/td><td>Works<\/td><\/tr><tr><td>574319D80<\/td><td>Loewe<\/td><td>2018<\/td><td>&#8211;<\/td><td>Works<\/td><\/tr><tr><td>TX-40FXW724<\/td><td>Panasonic<\/td><td>2018<\/td><td>Works<\/td><td>Works<\/td><\/tr><tr><td>TX-40GXW804<\/td><td>Panasonic<\/td><td>2019<\/td><td>Works<\/td><td>Works<\/td><\/tr><tr><td>TX-43HXW904<\/td><td>Panasonic<\/td><td>2020<\/td><td>Works<\/td><td>Works<\/td><\/tr><tr><td>TX-40JXW854Z<\/td><td>Panasonic<\/td><td>2021<\/td><td>&#8211;<\/td><td>Works<\/td><\/tr><tr><td>QE43Q68AAUXXC<\/td><td>Samsung<\/td><td>2021<\/td><td>&#8211;<\/td><td>Works<\/td><\/tr><tr><td>UE43RU7400U<\/td><td>Samsung<\/td><td>2019<\/td><td>&#8211;<\/td><td>Works<\/td><\/tr><tr><td>GU43TU7079U<\/td><td>Samsung<\/td><td>2020<\/td><td>&#8211;<\/td><td>Works<\/td><\/tr><tr><td>GU43AU7179UXZG<\/td><td>Samsung<\/td><td>2021<\/td><td>&#8211;<\/td><td>Works<\/td><\/tr><tr><td>GQ32LS03BBUXZG<\/td><td>Samsung<\/td><td>2022<\/td><td>&#8211;<\/td><td>Works<\/td><\/tr><tr><td>KD-43XH8096<\/td><td>Sony<\/td><td>2020<\/td><td>&#8211;<\/td><td>Works<\/td><\/tr><tr><td>KD-43X80J<\/td><td>Sony<\/td><td>2021<\/td><td>&#8211;<\/td><td>Works<\/td><\/tr><tr><td>43A700F<\/td><td>Hisense<\/td><td>2020<\/td><td>&#8211;<\/td><td>Works<\/td><\/tr><tr><td>32EA5500F<\/td><td>Hisense<\/td><td>2020<\/td><td>&#8211;<\/td><td>Works<\/td><\/tr><tr><td>55PUS7504<\/td><td>Philips<\/td><td>2019<\/td><td>&#8211;<\/td><td>Works<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Future work<\/h2>\n\n\n\n<p>Future work includes performance optimizations regarding the parsing time of large WebVTT files. HbbTV terminals and SmartTVs typically do not have the same computational power as Desktop devices or smartphones. As a consequence, the parsing time for large WebVTT files can be significantly higher on HbbTV terminals than on other devices increasing the startup time of the player.<\/p>\n\n\n\n<p>To overcome such performance issues a possible solution is to parse the WebVTT tracks on the server side and return a JSON representation of the data to the client. Moreover, moving the parsing logic to a  webworker if available can lead to performance improvements. <\/p>\n\n\n\n<p>If you have any question regarding our DASH and HbbTV activities or dash.js in particular, feel free to check out our&nbsp;<a href=\"https:\/\/www.fokus.fraunhofer.de\/go\/dash\" target=\"_blank\" rel=\"noreferrer noopener\">website<\/a>&nbsp;and contact us.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Following the german saying &#8220;Ehre, wem Ehre geb\u00fchrt&#8221; (&#8220;honour to whom honour is due&#8221;) we start this blog post a bit different &#8211; with the acknowledgements. First we would like to thank ARTE for sponsoring and supporting the development activities&#8230;<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3,41,4],"tags":[],"coauthors":[6],"class_list":["post-1440","post","type-post","status-publish","format-standard","hentry","category-dash-js","category-hbbtv","category-media-source-extensions"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.6 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Caption me if you can - WebVTT support for HbbTV terminals with dash.js - Video-Dev<\/title>\n<meta name=\"description\" content=\"Implementation of WebVTT support for HbbTV terminals using dash.js.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/websites.fraunhofer.de\/video-dev\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Caption me if you can - WebVTT support for HbbTV terminals with dash.js - Video-Dev\" \/>\n<meta property=\"og:description\" content=\"Implementation of WebVTT support for HbbTV terminals using dash.js.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/websites.fraunhofer.de\/video-dev\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\/\" \/>\n<meta property=\"og:site_name\" content=\"Video-Dev\" \/>\n<meta property=\"article:published_time\" content=\"2022-11-22T16:32:54+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-11-22T16:37:42+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/websites.fraunhofer.de\/video-dev\/wp-content\/uploads\/2022\/11\/Bildschirmfoto-2022-11-22-um-16.19.48.png\" \/>\n<meta name=\"author\" content=\"Daniel Silhavy\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@dsilhavy\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Daniel Silhavy\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\\\/\"},\"author\":{\"name\":\"Daniel Silhavy\",\"@id\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/#\\\/schema\\\/person\\\/f7e1eee3cb4eae87a59648195014a809\"},\"headline\":\"Caption me if you can &#8211; WebVTT support for HbbTV terminals with dash.js\",\"datePublished\":\"2022-11-22T16:32:54+00:00\",\"dateModified\":\"2022-11-22T16:37:42+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\\\/\"},\"wordCount\":767,\"commentCount\":0,\"image\":{\"@id\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/Bildschirmfoto-2022-11-22-um-16.19.48.png\",\"articleSection\":[\"dash.js\",\"HbbTV\",\"Media Source Extensions\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\\\/\",\"url\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\\\/\",\"name\":\"Caption me if you can - WebVTT support for HbbTV terminals with dash.js - Video-Dev\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/Bildschirmfoto-2022-11-22-um-16.19.48.png\",\"datePublished\":\"2022-11-22T16:32:54+00:00\",\"dateModified\":\"2022-11-22T16:37:42+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/#\\\/schema\\\/person\\\/f7e1eee3cb4eae87a59648195014a809\"},\"description\":\"Implementation of WebVTT support for HbbTV terminals using dash.js.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\\\/#primaryimage\",\"url\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/Bildschirmfoto-2022-11-22-um-16.19.48.png\",\"contentUrl\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/wp-content\\\/uploads\\\/2022\\\/11\\\/Bildschirmfoto-2022-11-22-um-16.19.48.png\",\"width\":4516,\"height\":1726},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Caption me if you can &#8211; WebVTT support for HbbTV terminals with dash.js\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/#website\",\"url\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/\",\"name\":\"Video-Dev\",\"description\":\"Future Applications and Media - Video Development Blog\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/#\\\/schema\\\/person\\\/f7e1eee3cb4eae87a59648195014a809\",\"name\":\"Daniel Silhavy\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/wp-content\\\/uploads\\\/2019\\\/11\\\/0-1-150x150.jpegccb13c1b60303228bf3c575f3345fe29\",\"url\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/wp-content\\\/uploads\\\/2019\\\/11\\\/0-1-150x150.jpeg\",\"contentUrl\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/wp-content\\\/uploads\\\/2019\\\/11\\\/0-1-150x150.jpeg\",\"caption\":\"Daniel Silhavy\"},\"description\":\"Daniel Silhavy studied Computer Science at the Technical University of Berlin (TUB). He received his Masters degree with the completion of his thesis \u201cAd Insertion in MPEG-DASH\u201d at Fraunhofer Institute for Open Communication Systems (FOKUS) in 2015. Currently, he is employed as a scientific assistant and project manager at the Business Unit Future Applications and Media (FAME). He specializes in the R&amp;D of topics dealing with IPTV and adaptive media streaming.\",\"sameAs\":[\"https:\\\/\\\/www.fokus.fraunhofer.de\\\/fame\\\/team\\\/silhavy\",\"https:\\\/\\\/www.linkedin.com\\\/in\\\/daniel-silhavy-21650a129\\\/\",\"https:\\\/\\\/x.com\\\/dsilhavy\"],\"url\":\"https:\\\/\\\/websites.fraunhofer.de\\\/video-dev\\\/author\\\/silhavy\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Caption me if you can - WebVTT support for HbbTV terminals with dash.js - Video-Dev","description":"Implementation of WebVTT support for HbbTV terminals using dash.js.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/websites.fraunhofer.de\/video-dev\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\/","og_locale":"en_US","og_type":"article","og_title":"Caption me if you can - WebVTT support for HbbTV terminals with dash.js - Video-Dev","og_description":"Implementation of WebVTT support for HbbTV terminals using dash.js.","og_url":"https:\/\/websites.fraunhofer.de\/video-dev\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\/","og_site_name":"Video-Dev","article_published_time":"2022-11-22T16:32:54+00:00","article_modified_time":"2022-11-22T16:37:42+00:00","og_image":[{"url":"https:\/\/websites.fraunhofer.de\/video-dev\/wp-content\/uploads\/2022\/11\/Bildschirmfoto-2022-11-22-um-16.19.48.png","type":"","width":"","height":""}],"author":"Daniel Silhavy","twitter_card":"summary_large_image","twitter_creator":"@dsilhavy","twitter_misc":{"Written by":"Daniel Silhavy","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/websites.fraunhofer.de\/video-dev\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\/#article","isPartOf":{"@id":"https:\/\/websites.fraunhofer.de\/video-dev\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\/"},"author":{"name":"Daniel Silhavy","@id":"https:\/\/websites.fraunhofer.de\/video-dev\/#\/schema\/person\/f7e1eee3cb4eae87a59648195014a809"},"headline":"Caption me if you can &#8211; WebVTT support for HbbTV terminals with dash.js","datePublished":"2022-11-22T16:32:54+00:00","dateModified":"2022-11-22T16:37:42+00:00","mainEntityOfPage":{"@id":"https:\/\/websites.fraunhofer.de\/video-dev\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\/"},"wordCount":767,"commentCount":0,"image":{"@id":"https:\/\/websites.fraunhofer.de\/video-dev\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\/#primaryimage"},"thumbnailUrl":"https:\/\/websites.fraunhofer.de\/video-dev\/wp-content\/uploads\/2022\/11\/Bildschirmfoto-2022-11-22-um-16.19.48.png","articleSection":["dash.js","HbbTV","Media Source Extensions"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/websites.fraunhofer.de\/video-dev\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/websites.fraunhofer.de\/video-dev\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\/","url":"https:\/\/websites.fraunhofer.de\/video-dev\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\/","name":"Caption me if you can - WebVTT support for HbbTV terminals with dash.js - Video-Dev","isPartOf":{"@id":"https:\/\/websites.fraunhofer.de\/video-dev\/#website"},"primaryImageOfPage":{"@id":"https:\/\/websites.fraunhofer.de\/video-dev\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\/#primaryimage"},"image":{"@id":"https:\/\/websites.fraunhofer.de\/video-dev\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\/#primaryimage"},"thumbnailUrl":"https:\/\/websites.fraunhofer.de\/video-dev\/wp-content\/uploads\/2022\/11\/Bildschirmfoto-2022-11-22-um-16.19.48.png","datePublished":"2022-11-22T16:32:54+00:00","dateModified":"2022-11-22T16:37:42+00:00","author":{"@id":"https:\/\/websites.fraunhofer.de\/video-dev\/#\/schema\/person\/f7e1eee3cb4eae87a59648195014a809"},"description":"Implementation of WebVTT support for HbbTV terminals using dash.js.","breadcrumb":{"@id":"https:\/\/websites.fraunhofer.de\/video-dev\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/websites.fraunhofer.de\/video-dev\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/websites.fraunhofer.de\/video-dev\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\/#primaryimage","url":"https:\/\/websites.fraunhofer.de\/video-dev\/wp-content\/uploads\/2022\/11\/Bildschirmfoto-2022-11-22-um-16.19.48.png","contentUrl":"https:\/\/websites.fraunhofer.de\/video-dev\/wp-content\/uploads\/2022\/11\/Bildschirmfoto-2022-11-22-um-16.19.48.png","width":4516,"height":1726},{"@type":"BreadcrumbList","@id":"https:\/\/websites.fraunhofer.de\/video-dev\/caption-me-if-you-can-webvtt-support-for-hbbtv-terminals-with-dash-js\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/websites.fraunhofer.de\/video-dev\/"},{"@type":"ListItem","position":2,"name":"Caption me if you can &#8211; WebVTT support for HbbTV terminals with dash.js"}]},{"@type":"WebSite","@id":"https:\/\/websites.fraunhofer.de\/video-dev\/#website","url":"https:\/\/websites.fraunhofer.de\/video-dev\/","name":"Video-Dev","description":"Future Applications and Media - Video Development Blog","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/websites.fraunhofer.de\/video-dev\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/websites.fraunhofer.de\/video-dev\/#\/schema\/person\/f7e1eee3cb4eae87a59648195014a809","name":"Daniel Silhavy","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/websites.fraunhofer.de\/video-dev\/wp-content\/uploads\/2019\/11\/0-1-150x150.jpegccb13c1b60303228bf3c575f3345fe29","url":"https:\/\/websites.fraunhofer.de\/video-dev\/wp-content\/uploads\/2019\/11\/0-1-150x150.jpeg","contentUrl":"https:\/\/websites.fraunhofer.de\/video-dev\/wp-content\/uploads\/2019\/11\/0-1-150x150.jpeg","caption":"Daniel Silhavy"},"description":"Daniel Silhavy studied Computer Science at the Technical University of Berlin (TUB). He received his Masters degree with the completion of his thesis \u201cAd Insertion in MPEG-DASH\u201d at Fraunhofer Institute for Open Communication Systems (FOKUS) in 2015. Currently, he is employed as a scientific assistant and project manager at the Business Unit Future Applications and Media (FAME). He specializes in the R&amp;D of topics dealing with IPTV and adaptive media streaming.","sameAs":["https:\/\/www.fokus.fraunhofer.de\/fame\/team\/silhavy","https:\/\/www.linkedin.com\/in\/daniel-silhavy-21650a129\/","https:\/\/x.com\/dsilhavy"],"url":"https:\/\/websites.fraunhofer.de\/video-dev\/author\/silhavy\/"}]}},"_links":{"self":[{"href":"https:\/\/websites.fraunhofer.de\/video-dev\/wp-json\/wp\/v2\/posts\/1440","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/websites.fraunhofer.de\/video-dev\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/websites.fraunhofer.de\/video-dev\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/websites.fraunhofer.de\/video-dev\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/websites.fraunhofer.de\/video-dev\/wp-json\/wp\/v2\/comments?post=1440"}],"version-history":[{"count":31,"href":"https:\/\/websites.fraunhofer.de\/video-dev\/wp-json\/wp\/v2\/posts\/1440\/revisions"}],"predecessor-version":[{"id":1473,"href":"https:\/\/websites.fraunhofer.de\/video-dev\/wp-json\/wp\/v2\/posts\/1440\/revisions\/1473"}],"wp:attachment":[{"href":"https:\/\/websites.fraunhofer.de\/video-dev\/wp-json\/wp\/v2\/media?parent=1440"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/websites.fraunhofer.de\/video-dev\/wp-json\/wp\/v2\/categories?post=1440"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/websites.fraunhofer.de\/video-dev\/wp-json\/wp\/v2\/tags?post=1440"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/websites.fraunhofer.de\/video-dev\/wp-json\/wp\/v2\/coauthors?post=1440"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}