Controlbar Video Previewer Realtime

Video previewer using small realtime video frames

This work in progress experimental example demonstrates using a pre-encoded video with a thumbnail frame size and no audio. The small frame helps with load times due to latency and therefore less of a delay displaying the frame hence the requirement of images.

This unfortunately pre-buffers the video depending on the offset times, therefore needs to be encoded as small as possible.

A better example obtaining the video byte data directly may be realised later but complicated to translate to byte requests from offset times. Capturing the video frame for caching with a standard video display is complicated due to cross origin issues cross browser which is the same issue as the snapshot feature requiring cross origin proxy work arounds.

    <div class="flex w-full h-auto my-auto">
          <div id="realtime" class=""></div>
  <script type="text/javascript">
  	var player = jwplayer("realtime").setup({
    "aspectratio": "16:9",
    "framesurl": "//",
    "playbackRateControls": true,
    "plugins": {
        "../../js/videopreviewer-8.1.0.js": {
            "realtime": true
    "sources": [
            "file": "",
            "type": "webm"
            "file": "",
            "type": "mp4"
    "width": "100%"