v15 media player endless buffering with tracking through video

[austinspooner]

Please go through all the tasks below

• Check this box only after you have successfully completed both the above tasks

Please provide a brief description of the problem. Please do not forget to attach the relevant screenshots from your side.

In v15 the Rock media player does not load the media correctly. It appears to endlessly buffer. When viewing the actual source (Vimeo) this does not happen. This issue is only in the Rock Media Player for web as the mobile app does not have the issue.

https://app.screencast.com/6JvMykCHNKlQL

Expected Behavior

Video would load correctly.

Actual Behavior

Does not load correctly.

Steps to Reproduce

Go to https://veritaschurch.org/messages and pick a video

Try to skip through the video

Does not load correctly

Rock Version

15

Client Culture Setting

en-us

[ethan-sparkdevnetwork]

@austinspooner I am able to view and skip through all of the videos I tried at https://veritaschurch.org/messages. There was no apparent lag when skipping forward or backward. I tried with Chrome and Edge. Is there any other context or does it work for you now as well?

[austinspooner]

Its not working for me in Chrome or Safari, logged in our logged out. I have other users with tickets open for the same issue.

[tikool17]

@ethan-sparkdevnetwork @austinspooner we've noticed a similar issue, but we're on 14.1 also using the Vimeo plugin, so i feel like at least some of the issue existed before v15. For us, we're usually able to play the first ~4 seconds and then it will hang. And similar intermittent hangs if you jump around the video.

In the media dev tools in Chrome this event is logged when it hangs

[frogydiak]

Same issue and noticed this since v13.7 and now we're on v14.2 #5419

[jasonhendee]

@austinspooner , @tikool17 , @frogydiak : next time you reproduce this issue, can you please run a quick speed test (https://www.google.com/search?q=speed+test) and let us know the results?

We investigated this further, and were able to reproduce it, but only after manually throttling the network speed using Chrome's dev tools as follows:

1. Navigate to https://plyr.io/ (this is the media player library that Rock is using under the hood);
2. Open dev tools and on the Network tab, change from No throttling to Slow 3G;
3. Enable Media dev tools by clicking dots menu > More tools > Media;
4. Open Media dev tools tab, start playing the video, drag the slider, and observe the Events reported.

As @tikool17 mentioned, these video hanging issues almost always seem to be associated with a BUFFERING_HAVE_NOTHING / DEMUXER_UNDERFLOW kBufferingStateChanged event, and according to some Chromium source comments I found, this indicates network slowness.

[ethan-sparkdevnetwork]

@jasonhendee, @austinspooner let me know via the Rocket Chat beta channel that he only gets this issue on iOS, so I am assuming Safari browsers.

[tikool17]

@jasonhendee @ethan-sparkdevnetwork thanks for looking into this. Speed test below. Today I tested this on my Macbook on Chrome/Safari/Firefox and experienced hanging around 4 seconds on all browsers. I tested on a PC on Chrome/Edge and didn't experience hanging.

[frogydiak]

@jasonhendee Here's my internet speed

Just like @tikool17 said above, I am also experiencing this issue in Mac in both Macbook (latest OSX) and MacPro (older OSX) in Chrome/Safari/Firefox/Edge and around the same timeline as @tikool17. Same thing, I don't have this issue in Windows PC.
I do get the same issue on premise where my workstation is directly connected to the same network as our web server hosting Rock. So, I guess it not the latency with Plyr, I'm thinking it is the latency with Rock's collecting video metrics, maybe?

[nlBayside]

I'm experiencing the same issue, and as shown above, my internet speeds are very good. I first noticed this when watching Rock's v15 features video. When viewing a sermon from https://veritaschurch.org/messages, it also freezes around 4 seconds in.

[jasonhendee]

Thank you all for your speed test results. It seems pretty clear that's not the issue, but given the difficulty we've had reproducing on our end, I wanted to rule that out.

@nlBayside are you also experiencing this issue only on a Mac?

Also, would you each be willing to go directly to the Plyr site (https://plyr.io/) and see if the issue can be reproduced there on your end? This will help us determine if it's an issue with the media player library itself, or with our usage of the library.

[nlBayside]

@jasonhendee I am only experiencing this on a Mac. Just tried on my iphone and I didn't have any issue viewing videos from Plyr's site or the sermons from Veritas Church.

[tikool17]

@jasonhendee i didn't experience the buffering issue on plyr.io on my Mac, but continued to have them on my Rock install. Also i have no issues on iOS on my Rock install or plyr.io

[jasonhendee]

Thank you all for your feedback. To summarize what we know so far:

1. This issue occurs within macOS (to clarify, only the desktop version of Apple's OS, and not iOS).
   • Occurs within Safari, Chrome and Firefox browsers.
   • Occurs whether logged in or logged out.
2. This issue does not occur within Windows, in any browser.
3. We've ruled out internet speed as a culprit.
4. Those experiencing the issue when watching videos via Rock do not experience issues when watching the example video directly only Plyr.io's website.

One more question for everyone: are your source videos all hosted by Vimeo? If so, do you have any YouTube-sourced videos you can experiment with in your Rock instance to see if they also exhibit the same issue? Thanks again for helping us fill in these testing gaps; hopefully we can get to the bottom of this soon.

[tikool17]

@jasonhendee we also have the youtube plugin, i pointed it to a youtube video and didn't have any problems. It looks like it uses a standard youtube embed player, not the plyr.io one.

[asdf1nit]

Recently mentioned the same issues in the Rock Star Channel. We are a MacOS shop and I can confirm I have seen the same issues with video on the Rock Community website for at least the last 3 months. I have also had the issue using my personal windows desktop at home when watching Rock videos.

We do not have the Vimeo plugin nor do we use the Rock video player(yet) so I have no Rock instance to test with.

[BEGamache]

We are experiencing the same issue here and the message is on the home page). Office computers are primarily macOS. Most are older and will load the first 5 seconds or so and then endlessly buffer. Some of the newer OS's will get to that same 5 second mark and then skip 5-10 seconds and continue playing the rest of the video without issue.

My specific work computer is running the latest macOS 13. Safari and Firefox I notice the time jump after the first 5 seconds. When I test in Chrome, it stops and hangs after the first 5 seconds.

I do have a Surface Pro laptop, running Windows 10 Pro, and in Edge and Chrome I haven't experienced this issue yet.

For my iPhone I haven't noticed the issue yet in Safari.

For my iPad, I did notice the time jump in Safari, Firefox, and Chrome.

[jasonhendee]

We've nailed down a fix which we expect to have in v15.1 (Beta) early next week.

Video streaming can be quite complex, so we rely on a couple of different libraries to provide the best streaming experience possible within Rock. These library providers are up against a constant challenge of navigating potentially-breaking changes as browsers implement newer and better streaming features over time.

With respect to this issue, we found a recent fix from one of these library providers that specifically addressed this "endless buffering" scenario.

If you really need to apply a partial fix to your Rock instance sooner, please read the technical instructions below.

---

Technical Instructions for Partial Manual Fix

To prevent the issue for new viewers of your site (no Rock restart required):

1. On your Rock server, take a backup of the existing file at <website root>/Scripts/plyr/3.6.8/hls.min.js (copy/paste it to a folder on the desktop, for example)
2. Download and unzip the following JavaScript file onto your Rock server: https://www.dropbox.com/s/wiopvi9k5vydir6/hls.min.zip?dl=0
3. Use this downloaded file to overwrite the file at <website root>/Scripts/plyr/3.6.8/hls.min.js

To test this fix, you'll need to open Rock to a video page that previously exhibited the buffering issue and "hard refresh" the page:

macOS > Safari
[⌘ command] + [⌥ option] + [E], then [⌘ command] + [R]

macOS > Chrome -OR- Firefox
[⌘ command] + [shift] + [R]

Windows > All Browsers
[ctrl] + [F5]

The reason this will only work for new viewers is because their browser hasn't yet had a chance to download and cache the old JS file. Anyone who has already experienced the issue would have to clear their browser's cache (as instructed above) in order to receive the fix.

Once we roll out the proper fix in v15.1 Beta next week, our fix will instruct all browsers to drop their cached version of the file so the new version can be downloaded.

[frogydiak]

@jasonhendee thank you for fixing the mediaplayer. In relation to media player issue, could you also check it's behavior with audio file? I reported the issue here