How Netflix uses WebKit and HTML5 for connected devices

Netflix has spent the past few years trying to get its streaming service on as many devices as possible, including TVs, Blu-ray players, game consoles, streaming set-top boxes, mobile phones and tablets. It’s a monumental undertaking, given the large number of different operating systems and development tools needed across a number of different CE manufacturers.

In a post on the Netflix Tech Blog, device UI engineers Matt McCarthy and Kim Trott shared a presentation that gives a peek behind the curtain in how it’s able to do so. The key is standards-based development using WebKit, JavaScript, HTML5 and CSS3.

Cutting-edge features, dynamic updates and A/B testing

Standardizing on WebKit enables Netflix to deliver to all the major browsers — including Firefox, Internet Explorer, Opera and Safari — without worrying about cross-platform development. By basing its software development kit (SDK) for consumer electronics manufacturers on WebKit, it can also use “cutting‐edge features like querySelector API, CSS transforms, CSS transitions & animations, localStorage, CORS, getters and setters, etc.”

More importantly, by relying on common web technologies, Netflix doesn’t have to develop individual applications for each device framework it comes across. It also can improve development cycles for user interfaces on connected devices. According to the presentation, Netflix typically updates its connected apps every two weeks. By using web standards, it doesn’t need to rely on CE manufacturers to push firmware updates to fix bugs or change the UI — it can do dynamic updates by itself.

Netflix also can dynamically test user interfaces, to see how users interact with them. With web standards they can redirect different customers to different web pages, feeding them different experiences. By doing so, they can figure out which interfaces are most effective.

Different classes of devices

There’s a wide range of available processing speed and memory, from CPUs that have 600 MHz to those with 3.2 GHz of processing power, and 88 MB of available memory to 512 MB. As a result, Netflix builds in flexibility to ensure that it doesn’t overload lower-powered devices with more advanced features.

Netflix currently has three tiers of devices based on their configurations, with the lowest tier having zero animation and small cache sizes. On the top end, devices have animations, large cache sizes and frequent pre-fetching of data. According to the presentation, all devices start in the middle tier and are then throttled up or down based on performance.

Paving the way for other app makers

Netflix’s focus on standards has allowed it to provide dynamically updated user interfaces on devices like the Sony PlayStation 3 and Sony Internet TVs, Nintendo Wii, Logitech Revue and the Boxee Box from D-Link. As more streaming video app makers try to tackle the issue of device fragmentation, Netflix’s approach could provide one way to streamline app creation and maintenance.

Netflix Webkit-Based UI for TV Devices

View more presentations from mattmccarthy_nflx

Related research and analysis from GigaOM Pro:
Subscriber content. Sign up for a free trial.

  • Connected Consumer Tuned In to TVs in Q4
  • A field guide to cloud computing: current trends, future opportunities
  • Connected Consumer Q1: The Over-the-Top vs. Pay TV Battle Heats Up



GigaOM