mux-player-react streaming loop video loads on every loop

drywall_dan

I'm using mux-player-react on a next.js site to implement a background looped movie ( agobay.com ). Unfortunately the video reloads after each loop. On slower connection, it starts first with a poor quality version and reloads the good one later. But this happens on each loop again. How can I prevent this (caching video?) thanks for help <MuxPlayer className={styles.videoMob} playbackId={'xxxx'} streamType="on-demand" loop muted autoPlay />

Originally asked by user1272597 on Stack Exchange (stackoverflow) (CC BY-SA 4.0).

uphilltech

Great question — answering as the UphillTech team:

You can use the playback modifiers in Mux Player. <MuxPlayer className = {styles.videoMob} playbackId = {'xxxx'} streamType = "on-demand" minResolution="480p" loop muted autoPlay /> Mux Player supports min_resolution , max_resolution and rendition_order as attributes on the web component and props on the React component. For example to set the max_resolution= parameter with Mux Player, you can set max-resolution="720p" attribute ( maxResolution="720p" in React). When setting this attribute Mux Player will internally add it on as a query parameter on the streaming URL. You can read more here: https://www.mux.com/docs/guides/control-playback-resolution#using-playback-modifiers-in-mux-player

Full answer by Pratik Kale: https://stackoverflow.stackexchange.com/a/79373478 (CC BY-SA 4.0).

Need it done for your business? UphillTech.