sampotts / plyr

A simple HTML5, YouTube and Vimeo player

Home Page:https://plyr.io

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

The poster file gets downloaded several times

tobireif opened this issue · comments

The poster file gets downloaded three times.

Here's a screenshot (Chrome):

screenshot

I had found the ticket #1355 "Poster is loaded twice", but in this case here it gets downloaded three times.

The page is password-protected, but I can answer any questions regarding my Plyr setup.

Here's the code:

HTML:

<video playsinline="playsinline" muted="muted"
  poster="images/video_cover.png">
  <source src="the_video.mp4" type="video/mp4"/>
</video>

JS:

function initPlayer() {
  var player = new Plyr("video", {
    iconUrl: "../../vendor/plyr/plyr.svg",
    controls: ["play-large", "play", "progress", "current-time"],
    blankVideo: "../../vendor/plyr/blank.mp4",
    fullscreen: {enabled: false},
    hideControls: false,
    storage: {enabled: false}
  });
}

window.addEventListener("load", initPlayer);

It would be great if the poster file would get downloaded only once, max twice, but not three times and one after the other (see the screenshot).

Perhaps Plyr could detect whether it already got loaded, and in that case not download it again?

It would be great if the poster file would get downloaded only once.

commented

I am seeing this three times as well. Twice from plyr and once from the dom. This is for a hosted video.

I wonder what is the benefit of the progressive enhancement to have the poster set as a DIV in addition to on the video element? Is the use-case mostly for youtube, vimeo, etc?

... and could there be an option for disabling anything that causes the additional downloads? (I also have a hosted video scenario.)

It would be great if this could get fixed.

This should be fixed in v3.5.7 but report back if not 👍

I tried v3.5.7, but there were two issues:

The poster file gets downloaded two times. That's better than three times (thanks!), but one time would be better. Please re-open this ticket - it should stay open until the poster file gets downloaded only once.

The other issue: The player at https://tobireif.com/posts/layout_fun_with_css_grid/ gets destroyed.

Before:

screenshot_before

With v3.5.7:

screenshot_after

It would be really great if you could ensure that updates don't break things 😀

The release notes contain this text: "This update contains CSS changes." I'd rather be able to update Plyr without having to dig through all the CSS changes and adapt my CSS.

Also reported at #1680 .

It gets loaded once for me on https://plyr.io/ - anyone else seeing issues? If they are then I'll re-open the issue. Feel free to dig into the code to take a look.

image

Chrome screenshot of https://tobireif.com/posts/layout_fun_with_css_grid/ :

screenshot

Chrome screenshot of https://plyr.io/ :

screenshot_2

Firefox downloads it just once. I'll report the Chrome issue.

It may be something else. I’ll check Chrome.

If you find anything (eg a Plyr fix for the issue observed in Chrome), please also post the info at https://bugs.chromium.org/p/chromium/issues/detail?id=1050569 , so that they can close their ticket if it is/was a Plyr-issue and not a Chrome-issue.

At https://bugs.chromium.org/p/chromium/issues/detail?id=1050569 they requested a network log capture ( https://www.chromium.org/for-testers/providing-network-details ), and then wrote "That log only shows it being downloaded once".