I didn't see any choppy behavior on Linux when I forced the HTML5 media player by using a Google Chrome user agent and switched to full screen.

What is the CPU load when this happens?

There might be a problem with hardware acceleration in Firefox or in the player.

• media.windows-media-foundation.enabled
• media.windows-media-foundation.use-dxva

I notice that the player is moved down and is placed under the mushroom icon when I have the window smaller than 1200px. This happens in Google Chrome as well as in Firefox.

Hello,

sharongraylac wrote:

My embedded videos, which primarily uses HTML5 player plays back extremely choppy with Firefox (when in full screen).

I faked the user agent string to say Chrome. There were no performance issues in full screen, but there was this odd outline overlayed throughout (see attached cropped screenshot). I take it those are the rounded edges of the video on the page.

I also tried a couple of random videos on Vimeo (with the genuine user agent string). Whether HD, full screen or with page zoom above 100%, they played fine without Flash Player.

• http://vimeo.com/91605331
• http://vimeo.com/33390344

Can you toggle the status of hardware acceleration, restart Firefox, and check if the problem still occurs?

• Where to turn hardware acceleration on or off

sharongraylac wrote:

I spent several hours consulting with lead technicians at Vimeo, and they informed me that there is an incompatibility with Firefox and HTML5.

Did they mention which incompatibility? All issues are publicly viewable on Bugzilla.

• Bug 891916 - Vimeo videos image is delayed | Bugzilla Edit: This report is about Flash Player issues, sorry.
• How to report a performance problem | MDN
• All unresolved bug reports matching 'vimeo' | Bugzilla

sharongraylac wrote:

Now my CSS for the videos no longer works, and I'm still trying to figure out a work around for this as well.

I take it you mean the rounded edges for the video when not in full screen? Those showed up fine when faking the user agent string, but I just get regular square edges with the genuine user agent string (see attached screenshot).

sharongraylac wrote:

I really wish I could go back to using HTML5 for ALL of my browsers

Keep in mind Firefox's support of HTML5 video is not universal (no H.264 support on Windows XP and OS X; Linux requires addtional packages), but it is possible to detect what the browser is capable of and only use Flash Player when absolutely necessary.

Hello cor-el,

Thanks for your response!

Chrome was never choppy, only Firefox when viewed directly on my site in full screen.

I had already adjusted the hardware acceleration with no change...

Please ignore the player- that is just a css goof I need to fix for smaller monitors. Thanks for mentioning it though!

Kindly, Sharon

Thanks for the response, Gingerbread Man!

As I mentioned above, it always worked well when viewed in Chrome (unless I'm misunderstanding what you are saying)...

Thanks for mentioning the buggy lines. Yes, this is a failed attempt at working around my lost css for rounded edges. Back to the drawing board!  :)

All videos viewed directly on Vimeo (including those in question) have always worked great as well, including in Firefox. The ONLY videos that appear choppy are those viewed directly on my site in full screen mode using Firefox. I've tested this on several different computers, and even different countries, with the same results.

I'd be happy to toggle the status of hardware acceleration, but it may need to wait 'til the morning, as I am decelerating rapidly, myself...

"Advanced settings for accessibility, browsing, system defaults, network, updates, and encryption"

Not sure what I should do with that...

"Did they mention which incompatibility?"

No. They just said Firefox was having trouble reading the file in the new HTML5 embed code.

"I take it you mean the rounded edges for the video when not in full screen?"

Yes. Ever since I had to redirect Firefox to Flash instead of HTML5 player, I can no longer get my border radius CSS to work properly.

Any thoughts?

Thanks so much again for all of your help!

Kindly, Sharon

Maybe this will make things a bit more clear...

I reverted the video on this page: thenourishedcook.com/dev/about back to the original iFrame embed code.

As you can see, the rounded corners return.

However, if you play the video using full screen with Firefox, the video plays very choppy.

Any thoughts?

Thanks so much! Sharon

sharongraylac wrote:

As I mentioned above, it always worked well when viewed in Chrome (unless I'm misunderstanding what you are saying)... 

We're saying we made Firefox lie and tell your site that it's Chrome.

• https://en.wikipedia.org/wiki/User_agent#User_agent_sniffing

sharongraylac wrote:

However, if you play the video using full screen with Firefox, the video plays very choppy.

I compared with Internet Explorer 11 this time, and the video does seem more fluid in that browser. To me, the difference is subtle. I don't think if I would've ever noticed if it wasn't pointed out to me.
Also, the Play button in the center of the video didn't do anything when I clicked it in IE11; I had to click the one in the lower left corner.

Once again, in Firefox I got the rounded corners overlayed on top of the video. The difference is that this time they appeared in the four corners of the video (see attached cropped screenshot of the top left corner).

sharongraylac wrote:

Ever since I had to redirect Firefox to Flash instead of HTML5 player, I can no longer get my border radius CSS to work properly.

border-radius doesn't get applied to Flash content. If I'm reading this correctly, you're trying to overlay corners onto the video manually (#vimeoWrapper > .fiverr_container > object > .fiverr_corner). But I see no positioning information for those elements, so they don't show up on top of the video corners on the page.

• Adding border-radius for embedded YouTube video | Stack Overflow
• setting border-radius of a div containing a .swf file | Stack Overflow

Hello Gingerbread,

Thanks again for your thorough response!

Just want to make sure we are talking about the same thing... I had changed the code on the About page this morning to test things out.

Please compare thenourishedcook.com/dev/about video (HTML5 player) to thenourishedcook.com/dev video (Flash). The difference is dramatic to me...

Nice trick with Chrome! Sorry I didn't catch that- I'm an acupuncturist, not a developer..  ;)

I'm no longer using the "Fiverr" code relating to the rounded corners. I will look into your other suggestions- thank you for that...

So it sounds like (if I'm understanding you correctly) that there IS a bug between Firefox and HTML5 player?

Thanks again, Sharon

P.S. And the fact that border-radius does not work with Flash is one of the reasons I'm trying to use HTML5 player... If only it would work smoothly with Firefox! Ah well, back to the drawing board...  :)

Hello again,

sharongraylac wrote:

Just want to make sure we are talking about the same thing... I had changed the code on the About page this morning to test things out.

Here's a recording of the first ~35 seconds of the video at http://thenourishedcook.com/dev/about as it plays on my system, in Firefox without Flash Player. Note that the image quality isn't relevant. The video had to be compressed to keep the file size reasonable.

1. Go to http://www.firedrive.com/file/67F4A915BEAE8CE0
2. Click the "Continue to File" button.
3. Right-click the "Direct Download" link and choose Save Link As. Save the file somewhere handy, like the desktop.
4. Open the video in an application like Windows Media Player, Media Player Classic Home Cinema, VLC or QuickTime.

Is that what you consider choppy playback, or is it worse on your system?

sharongraylac wrote:

So it sounds like (if I'm understanding you correctly) that there IS a bug between Firefox and HTML5 player?

I'm sorry, the bug report I mentioned twice before was about Vimeo videos played through Flash Player. So it doesn't apply to your situation. You can

1. Update your graphics drivers.
2. Toggle the status of hardware acceleration under Options → Advanced → General and restart Firefox.
3. Start Firefox with Add-ons Disabled (AKA "Safe Mode").

If the problem still occurs after the troubleshooting steps above, then there may be a performance bug in Firefox specific to your hardware configuration. You can file a new bug report (click the "Report an issue with Firefox on a site that I've developed" link at step 1), but there's no telling when or if a developer will notice your report. Again, the "How to report a performance problem" link I mentioned before would provide helpful information when filing a bug report.

• Bug writing guidelines | MDN
• How to report a performance problem | MDN

sharongraylac wrote:

P.S. And the fact that border-radius does not work with Flash is one of the reasons I'm trying to use HTML5 player...

You could always add a square border to the parent element of the Flash content. That can look pretty nice too.

Wow, thank you SO much for sending me this!

Okay, now that I got things straightened out in my head again (so sorry for the confusion when I got my players switched around)....

The video you sent looks great played in Windows Media Player. No choppiness at all (aside from the desired "Super 8" style).

Does this mean the problem is not with Firefox?

Thanks!

Kindly, Sharon

I think I'm seeing a similar amount of choppiness in Firefox and Chrome. Not sure whether that means the issue was "solved" or that the results may vary between different configurations.

In which video, Jshcher2000? Thanks for chiming in!  :)

Please keep in mind, the way I have it coded at the moment is that the About page video plays with HTML5 (choppy in full screen when played directly on site), and videos on other pages (i.e. Home, Getting Started) play with Flash player (no choppiness).

Does that change anything?

Thanks! Sharon

I was using the /dev/about page, so I think both browsers were using their native players. This system has a low-end graphics chip, so that may be limiting both browsers (the video gets a bit blotchy now and then).

Are you playing the videos in full screen? Thanks!

I get the native player on the about page and the Flash player on the home page. Just judging from the right-click context menu after I full screen the video.

Ah, my bad.

I've been staring at this thing so long, I don't know if I'm coming or going anymore...  :)

The About page is HTML5 player. THIS is the choppy video. All other videos use Flash, and play smoothly.

So sorry about that... Sharon

jscher2000 wrote:

I get the native player on the about page and the Flash player on the home page. Just judging from the right-click context menu after I full screen the video. 

How in the name of all that's holy is that the solution to this thread?

sharongraylac wrote:

Wow, thank you SO much for sending me this!

You're welcome.

sharongraylac wrote:

Does this mean the problem is not with Firefox?

I refer you to my previous post (the middle chunk, specifically):

• https://support.mozilla.org/questions/995550#answer-559583

Go through the troubleshooting steps. If the problem persists, then the issue is specific to your hardware configuration, in which case file a bug report and include the aforementioned performance information.

Hi Gingerbread Man, my post was not the solution. I don't know how it got marked.

Hi sharongraylac, I tried the /dev/about video on a second Windows 7 system where I have hardware acceleration enabled, and I still get very similar results in Firefox and Chrome.

Hello Gingerbread Man,

Sorry for the delay- I've been trying to get everything else ready for my site launch...

I tried all of the trouble shooting suggestions, and the problem was NOT visible in Safe Mode.

The choppy problem DID return, however, even with upgrades and double-checking hardware acceleration.

Just to make sure I understand correctly, would this indicate that the problem is on my end? Or a Firefox glitch?

And thank you for your input, jscher2000. I'm still unclear though... What are the results you are seeing? Is the video on the About page choppy when viewed full screen in Firefox?

By the way, I'm in the process of making the site live, so the new URL for the page in question is thenourishedcook.com/about. Still transferring some of the pages...

Thank you! Sharon

Hello again,

sharongraylac wrote:

The choppy problem DID return, however, even with upgrades and double-checking hardware acceleration.

Please check with hardware acceleration ON, then turn it OFF, restart Firefox and check again (or vice-versa, depending on the current setting). You can find the "Use hardware acceleration when available" setting under Options - Advanced - General - Browsing.

sharongraylac wrote:

I tried all of the trouble shooting suggestions, and the problem was NOT visible in Safe Mode.

If it works properly in Safe Mode (inaccurately labeled "Restart with Add-ons Disabled"), then the problem is likely either with one of your add-ons or hardware acceleration. The following article has more information:

• Troubleshoot extensions, themes and hardware acceleration issues to solve common Firefox problems