HTML5 Promises Simpler Embedded Videos and Better Performance

By: Morpheus Data

Embedding videos in web pages is simpler and playback quality improved via HTML5’s new video specification.

TL;DR: The new HTML standard was along time coming, but now that it has arrived, developers can put HTML5’s advanced video features to good use. Use these sites to determine how compatible your browser is with HTML5, how to embed an open-source HTML5 video player in your pages, and how to make best use of all the attributes associated with HTML5’s new “video” tag.

Let’s face it: Adobe’s Flash player is trouble. It’s trouble because Flash is susceptible to so many zero-day attacks, making your systems more vulnerable to malware. It’s also trouble because it’s everywhere: Flash was the long-time de facto standard for streaming Web animations and other media on PCs and, to a lesser extent, mobile devices. (Emphasis on was.)

YouTube’s recent decision to dump Flash in favor of HTML5 is the stake in the heart of a proprietary technology that has outstayed its welcome. In a January 28, 2015, article, CNET’s Stephen Shankland describes the ascendance of HTML5 video. Flash will survive for a short time as a vestigial browser extension needed to accommodate sites that haven’t converted to the new video standard. (Note that Google Chrome has used a built-in Flash player since 2010.)

However, Flash’s ultimate demise may not be far off. Mozilla is developing a version of Firefox that doesn’t need the Flash player, as Tech Times’ Timothy Torres reports in a February 16, 2015, article. The trend is away from browser extensions generally and the Flash player in particular.

In October 2014, the W3C’s final recommendation for the HTML5 specification was released. You can get a sense of how well your browser is prepared for the new web standard by visiting the HTML5 Test site. The service generates a numerical score indicating your browser’s degree of support for HTML5. The top score is 555. Below the overall score are category tables showing how well your browser scored in such areas as parsing, video, audio, elements, forms, storage, 2D and 3D graphics, and user interaction.

The HTML5 Test site automatically generates an overall score of your browser’s support for HTML5, and shows how well your browser does in specific categories. Source: HTML5 Test

The test doesn’t attempt to cover all aspects of HTML5 and its many extensions. You can also view the aggregate scores of other desktop, tablet, and mobile browsers. On desktops, Google Chrome scores highest overall, followed by Opera, Firefox, Safari, and Internet Explorer.

The aggregate scores of browsers’ support for HTML5 indicate that Chrome supports the new standard best, followed by Opera, Firefox, Safari, and IE. Source: HTML5 Test

Open-source HTML5 video player, and an HTML5 video tutorial

The site supporting the open-source Video.js HTML5 video player offers a primer on the spec’s “video” tag, which works much like the “img” tag in earlier HTML versions. The goal is to allow developers to embed videos in their pages without being concerned about which players site visitors have installed. Video performance is enhanced because the browser doesn’t need to call a separate plug-in or extension to play the video.

HTML5 Rocks’ Pete LaPage put together an extensive HTML5 video tutorial that covers everything from the spec’s simple embedded playback controls to using the “source” element to specify multiple source files. For example, you’ll optimize video performance by including the type attribute in the source element.

Use the type attribute in the “video” tag’s source element to improve the performance of videos embedded in web pages. Source: HTML5 Rocks

The tutorial also covers using the “track” element to add subtitles and other text to a video, and special “video” attributes, such as autoplay, preload, loop, muted, and height & width. As you might expect, the tutorial includes several videos that demonstrate the techniques it presents.

Using a browser to manage your heterogeneous databases doesn’t get any simpler than by using the new Morpheus Virtual Appliance. The Morpheus database-as-a-service (DBaaS) provides a single dashboard for provisioning, deploying, and monitoring MySQL, MongoDB, Redis, and ElasticSearch databases via a simple point-and-click interface.

Morpheus lets you work with SQL, NoSQL, and in-memory databases across hybrid clouds in just minutes. Each database instance you create includes a free full replica set for built-in fault tolerance and fail over. You can migrate existing databases from a private cloud to the public cloud, or from public to private. A new instance of the same database type is created in the other cloud, and real-time replication keeps the two databases in sync.

Visit the Morpheus site for pricing information and to create a free account.