Brightcove White paper - What makes an outstanding video player by IABM

WHAT MAKES AN OUTSTANDING VIDEO PLAYER? A Framework for Creating Positive Brand Experiences

Online video viewing continues to experience dramatic growth across all platforms. But this increase in viewing is matched by an increase in consumer expectations of the viewing experience. Slow load time frustrates consumers, who may opt to close a player rather than wait for the first frame to appear—squandering a publisher’s monetization opportunities and potentially damaging its brand. And, video players have historically relied on Adobe Flash, which has a host of speed and performance issues (e.g. it doesn’t work well on mobile devices, and performs inconsistently across browsers). All of these risks stem from one piece of technology that publishers must use in order to offer video content: the video player. And, if a video player isn’t fast and flexible, a publisher’s ability to take advantage of monetization opportunities will be hindered.

Defining an Outstanding and Flexible Video Player What makes an outstanding video player? And how can publishers create a video playback and video ad-serving environment that will take them into the future? At Brightcove, we realized that in order for publishers to deliver consistently optimal experiences for their audiences and advertisers, we needed to look beyond just the video player itself. Our philosophy demands that we address all of a publisher’s video constituencies and the needs of each one: CONSTITUENT

NEEDS

Site visitors

Speed and performance of video player

Publisher development teams

API ease of use, flexibility and documentation

Business owners

Adaptable, future-proof, revenue-optimized platform

Why We Wrote This Paper This paper examines each area—speed and performance, APIs and documentation, a flexible and future-proof platform for generating ad revenue—in depth, as well as Brightcove’s approach for addressing each one. To test our approach, we commissioned a top independent web/app development agency, with significant expertise in building video experiences for the world’s leading broadcasters, to conduct a study comparing the performance and usability of the Brightcove Player against other players on the market.

BRIGHTCOVE’S PHILOSOPHY FOR WEB VIDEO

Our top priority is to eliminate all limits on video creativity. To put it another way, we want all elements that publishers might add to their videos— interactivity, analytics, branding and custom elements, etc.—to work flawlessly in all browsers—regardless of version, platform or network conditions. We think of the web video world as a stack, with each layer contributing to the goal of delivering a positive web-based video experience for all users in all scenarios.

The Possible

The entire universe of creative experiences or monetization ideas that a video developer aims to accomplish with video.

HTML5 Extensibility

This is the extensibility layer (e.g. hooks/support for plugins, and additional capabilities developed by Brightcove) that are part of our framework to enable innovative video experiences beyond the defined HTML5 Video Spec to render and perform beautifully in HTML5.

HTML5 Video Level

This is the set of standards and specifications that HTML5 video is designed to support.

The Polyfill Layer

This is the layer within Brightcove’s video player that enables the greatest degree of functionality and performance optimizations to work across browsers. The polyfill layer ensures optimal playback, as well as the fullest monetization possible across the largest universe of web users/viewers.

The Browser Level

This refers to the elements of HTML5 Video that are supported across the various web browsers. Some browsers (like Chrome) support more HTML5 video capabilities than others where polyfill is critical to achieve scale

SPEED AND PERFORMANCE

We built our video player from the ground up around one key goal: To ensure premium viewing experiences each and every time a user clicked to view a video. Did we succeed? To find out, we engaged a top independent web/app development agency to test our video player performance against other video players in the market.

Goal

Test the Brightcove Player against Ooyala, JW Player and YouTube to address a key publisher concern: the fear of losing viewers due to subpar player speed and performance

What we measured

Player load time, time-to-video start Mobile and Desktop

Scenarios HLS/DASH video format Performance test results

The Brightcove Player consistently outperformed the other players, as measured by how quickly a player loaded and video began to play

(See Appendix A for complete performance results.)

In addition to HTML5 Video being faster to load than Flash, in the agency’s testing, Brightcove playback beat the competition from a performance perspective due to the pre-compilation we do of the player, the fact that it’s lightweight and the fact that we have built a globally distributed delivery system to ensure it always loads quickly.

How We Got Here Building a reliable and fast video player required us to make strategic decisions about our approach, such as building it in HTML5. In February 2016, we launched a new version of the Brightcove Player, allowing content owners to deliver a 100% Flash-free, HTML5 video experience to all of their audiences.

HTML5 Over Flash Brightcove has long favored open, transparent and standards-based approach to video on the web. When we decided to rebuild our video player to enhance speed and performance, HTML5 was the obvious choice as it offered: •

Faster loading and time-to-first-frame

•

Higher resolution and higher frame-rate video

•

Lower power requirements (our new video player now uses 33-50% less CPU than the previous version)

•

Platform independence through media-source extensions (MSE)

Our design vision was to make everything the developer touched about HTML5, JavaScript and CSS, but the initial versions of the player used technologies like Flash under the hood to fill in functionality that was missing. As HTML5 has matured, we have been able to remove those elements without changing the customer-facing, developer-friendly model.

Additional Optimization Although we built the video player on HTML5, we chose to optimize it in critical ways to ensure a positive brand experience for every user. For instance, the player uses all of the latest MSE to render adaptive bitrate HLS video in all modern browsers.This means that no Flash is needed on Chrome, Firefox, Internet Explorer 11 (on Windows 8), Safari, and Windows Edge. As an acknowledgement of needing to stay optimized towards business requirements, while the Brightcove Player is 100% HTML5, it can deliver a video advertising in Flash if needed (e.g. in scenarios where high-value, Flash-based VPAID creatives are served).

What is MSE? And Why Is It Important? MSE provide a framework for developing browser-independent player technology, and critically, it allows for adaptive streaming. Brightcove uses MSE to create a player that can detect and adjust to each user’s network conditions to ensure a high-quality viewing experience, rather than relying on pre-selected, inflexible, settings. Content owners can’t control how their users access their videos. Users can opt to view a video from their home, office, or in the street via a wireless network, as well as from a wide variety of devices and browsers. To the user, speed and performance in any scenario directly reflect on the publisher.

The Brightcove Edge For more perspective on the Brightcove Player’s performance, we went to its sources: the developers who build it. Here is what we learned:

Part of the explanation is our industry leadership in developing a superior HTML5 experience. Our HTML5 video player is also battle-tested by technologists at media companies around the world. That scale of use and constant feedback from some of the most sophisticated and demanding development teams out there has allowed us to optimize the player to drive performance.

Our experience with HTML5 didn’t begin with the player. Our team’s involvement in video.js since 2010 (we are a lead sponsor of the project) gave us a head start working with HTML5 video.

API FLEXIBILITY AND DOCUMENTATION A fast and reliable video player is just the start; publishers need to integrate it into their own environments and do their own customization work, including innovating their own advertising experiences on their sites. APIs are essential, as is thorough documentation that allows developers to find the answers they need quickly and easily. How did the market respond to our approach? Once again, we turned to the web/ app development agency mentioned previously for their independent analysis: Understand, qualitatively, how the leading players compared in the eyes of development teams that worked with them to build video experiences Goal The lens for the qualitative comparison was the functionality, flexibility and ease of use of a player’s APIs, and the completeness of a player’s documentation Strength of APIs and documentation What we measured

Player features and expansions options Ease of UI customization

Overall Results

Brightcove scored 9.5 out of 10 for its APIs, the highest score among all the players

Brightcove’s Approach to APIs •

Standards-Based. Our APIs are standards-based and modeled on the HTML5 Video API, so that developers can leverage their vast experience, as well as tap into the considerable experience of the community.

•

Modular Architecture. Our modular approach to the architecture is inherently extensible, making it easy for developers to customize the player to meet their needs.

•

Transparency. Transparency is a top priority for our video player, just as it was for video.js, the open source HTML5 video player we created for the market. We are dedicated to open development, as it enables us to build advanced features and slot them into a standards-based world.

Brightcove’s Approach to Documentation We don’t want to make developers work hard to find answers to their questions. For this reason, we have provided: •

Well-written and thorough documentation

•

Sample code for customer companies

•

Ability to look at the code on github and search through the issues

Business Impact for Publishers The Brightcove Player’s plugin architecture and its almost unlimited customisation options allowed us to build a lighter player than previously. It has also allowed us to share functionality across our business without dictating design.

— Kimble Young, Platform Manager, NewsCorp

Having built video distribution platforms for six years and worked with a variety of player technologies, I believe Brightcove is not only the fastest player I’ve encountered, but also provides the easiest to follow documentation and set of integration options into our third-party technology platforms.

— Norbert Horvath, CTO and Founder, Vemba

The Brightcove Edge Once again, we asked the Brightcove developers who created the player to weigh in on why the APIs and documentation were so well received within the development community. Here is what we heard:

Building to well-established standards and a well-defined interface means developers are able to use it easily, gain a lot of control, and can integrate it into every part of their consumer-facing experiences.

We’ve been tire-kicked and battle-tested by some of the most sophisticated buyers in the space. They’ve pushed us to make the player better and able to be adapted to more diverse scenarios.

FLEXIBLE AND FUTUREPROOF AD PLATFORM

Video ad revenue is critical to the long-term viability of publishers. The IAB reports that video represents an increasing share of digital and mobile ad spending, with growth driven by a substantial increase in mobile video allocations. As proof: ad spending on original digital video programming is up 114% since 2014. Digital video and video advertising are constantly changing. New devices, content consumption patterns and ad formats constantly emerge, and publishers need a flexible platform that allows them to choose the advertising approaches that work best for them. Moreover, they need their platform to evolve with them as their businesses change over time.

Brightcove’s Approach Brightcove’s approach is built around extensibility—enabling publishers to customize the video player and ad experience to meet their business requirements and the needs of their advertisers—both current and anticipated. •

•

Standards-Based. As a starting point, just as the player is customizable with standard CSS, HTML and JavaScript, it is also built to support recognized and widely used and flexible standards including VAST, VMAP, VPAID, with an early emphasis on HTML5 VPAID. Leading Ad Ecosystem Support. Beyond the easy, standard-based integrations with third-party ad systems the Brightcove Player provides: •

Native, fully supported integrations with DFP and FreeWheel.

•

Integrations with industry, critical measurement from comScore and Nielsen and viewability solutions from providers like Moat.

We’re excited about Brightcove’s move to support HTML5 VPAID ads through their player. We’ve seen substantial traction in adopting HTML5 VPAID by our customers this year. Brainient’s interactive ads help our sell-side customers increase their CPMs by an average of 30%, so Brightcove’s HTML5 VPAID support will enable publishers to run interactive video ads on their mobile inventory, which will help them charge higher CPMs and increase revenue. It’s a real win all-round. — Emi Gal, CEO, Brainient

Flexibility. Support for client-side ad calls or server-side stitched streams with cue points—via VMAP or in-stream signaling.

CONCLUSION

A video player is more than a technology that allows videos to run on a publisher’s site—it is a platform that’s vital for creating positive brand experiences for both viewers and advertisers, today and in the future. Any video player under consideration by a publisher should focus on three essential qualities: Speed and Performance •

Fully supports HTML5 in order to achieve the fastest time-to-first-frame possible

•

Lightweight with lower power requirements to ensure faster loading

•

Uses MSE to promote platform independence and ability to render adaptive bitrate HLS video in all modern browsers and enable adaptive streaming to ensure a high-quality viewing experience

APIs and Documentation •

Fully standards-based and transparent, enabling developers to leverage existing expertise and easily integrate it into their ecosystems

•

Modular architecture, so that developers have maximum flexibility to customize the player to meet their needs

•

Well-written and thorough documentation and plentiful sample code to help developers save time and resources

Future-Proof Ad Platform •

Supports core basic standards like VAST, VMAP, VPAID as well as newer standards like HTML5 VPAID

•

Integrations that extend beyond the basics to provide a complete ad platform like native integrations with DFP and FreeWheel, as well as integrations with critical tools around measurement and viewability like comScore, Nielsen and Moat

•

Flexibility around different ad serving models support for clientside or server-side stitched streams based on your business needs

APPENDIX: RESEARCH RESULTS

Performance Test Methodology Designed and Used by 3rd Party Agency Desktop Player Performance: HLS/DASH Player Load Time

Brightcove

Time to Video Start JWPlayer

Ooyala V4

YouTube MPEG-DASH 0

500

1000

1500

2000

Milliseconds

Mobile Player Performance: HLS/DASH Player Load Time

Brightcove

Time to Video Start

JWPlayer

Ooyala v4

YouTube MPEG-DASH 0

1000

2000

3000

4000

Milliseconds

Source: Independent third party research commissioned by Brightcove Test data: March 31, 2014 (Brightcove, JW, YouTube), June 30, 2016 (Ooyala v4 — Desktop), August 31, 2016 (Ooyala v4 — Mobile)

Performance Test Methodology BACKGROUND The goal of the test was to understand the performance of the various players in different production scenarios: different browsers, different file and streaming formats, web vs. desktop, etc. “Performance” was evaluated in the context of 1) Player Load Time and 2) Time to Video Start. 1. Player Load Time is the amount of time from loading scripts to the time that the player’s ready event is fired 2. Time to Video Start is the amount of time between the ready event and the player’s playing event KEY POINTS ABOUT THE METHODOLOGY For desktop browser tests 1. All desktop browser tests were run to have at minimum 1000 data points. 2. All desktop browsers allow ‘autoplay’ for videos. This made the ‘playing’ time measurement based on the time when the player sends a ‘ready’ event and when the player sends the ‘playing’ event. 3. All desktop browser tests were run with caching turned off via their respective ways to do so. For mobile browser tests 1. All mobile browser tests were run to have at minimum 300 data points. 2. Both mobile browsers do not allow ‘autoplay’ for videos. This made the ‘playing’ time measurement based on the time when the player receives a ‘play’ event and when the player sends the ‘playing’ event. 3. All mobile browsers tests were run with caching left on, as the only way to turn caching off on mobile is to run in a debugger mode, which greatly impacts performance.