Cloudflare Stream .M3U8 video low res when it first starts playing

[jinsley8]

When using video.js to play Cloudflare Stream videos (.m3u8). The beginning 3-4 seconds are extremely low quality.

I tried changing "preload" to "auto", "none", and "metadata".

When I test a MP4 in the player it loads fine. The Cloudflare Video loads fine in the Cloudflare dashboard and the "/watch" URL they provide.

[dugwood]

See https://github.com/videojs/videojs-contrib-quality-levels/blob/main/README.md

Also the use of ABR (options.html5.vhs.bufferBasedABR = true;) may be useful.

And tests on https://videojs-http-streaming.netlify.app/ should help too, as you can tweak options and test your own feed until you find the right setting.