Performance: Chrome Downloads 2 Poster Images When Crossorigin Attribute (Anonymous) Present on Video

Posted on EST by Michael "Spell" Spellacy

Browser: Chrome 53.0.2785.116 (64-bit)
Operating System: OS X 10.11.5

This issue also present on most stable release of Chrome for Windows.

Issue:

The poster image on a video element appears to be downloaded twice when a crossorgin attribute with a value of "anonymous" also exists on same element.

This attribute and value are required to get our video captioning to render from our CDN.

Code

<video crossorigin="anonymous" preload="none" poster="https://tbcdn.talentbrew.com/company/3401/v1_0/media/case-study-microsoft.jpg" controls>

    <source src="https://tbcdn.talentbrew.com/company/3401/v1_0/media/case-study-microsoft.mp4" type="video/mp4">
    <track label="English" kind="subtitles" srclang="en" src="https://tbcdn.talentbrew.com/company/3401/v1_0/media/case-study-microsoft.en.vtt">

</video>

Attribute: Present

https://screencast.com/t/95Kwa5fd8IGq

Attribute: Not Present

https://screencast.com/t/IAei3CZDJ

Reported

About the Author

Michael Spellacy

I am Michael "Spell" Spellacy, Director of User Interface Design and Development at TMP Worldwide. If you have any questions, feel free to contact me on Github or follow me on Twitter.

Moderators

Contributors

If you wish to contribute, fork this project, make some changes, and create a pull request.

New to GitHub? Learn the basics with the guide and learn the GitHub flow.

Quality Assurance and Accessibility

All patterns, layouts, and functionality are tested against our supported browsers. We also look for accessibility issues via automated and manual testing tools. TMP is committed to the accessibility of its websites and products and strives to meet as much of WCAG 2.0 Level AA as possible. If you discover any problems with our work, please open up an issue and let us know about it or contact Michael Spellacy.

Return to top