HackerTube
HomeLongsLikedHistoryWatch laterCategoriesPlaylistsSettings

React.js Conf 2015 - Beyond the DOM: How Netflix plans to enhance your television experience

Meta Developers2 HN recommenders · recommended in 2 months, 2015-2017
YouTube
26K views · 11 years ago · talk · dated

Jafar Husain of Netflix explains at React.js Conf 2015 how Netflix runs React-style rendering without the DOM on smart TVs and game consoles. It uses a canvas-like API for performance.

Cited as the primary source on React with a custom rendering backend and on Netflix's Gibbon engine.

Web developmentSoftware performance & optimization#react#netflix#gibbon#customrenderer#smarttv#performance

6 comments from Hacker News

@sscotth2017 · in “JavaScript once had a JSX-like syntax called E4X”

Its also important to consider the environment as well since JSX is potentially much bigger than the web. JSX is much like other generic user interface markup languages[0] and like many other is simply a dialect of XML. Any interface that can be represented with XML/HTML or any other markup language can use JSX and optionally react. We are already seeing this boom with in native mobile environments with React Native, NativeScript, Titanium... Here are several examples where JSX is used that is not a browser: - Native desktop apps for Linux, Mac, and Windows (Not including Electron/NW.js)[1][2][3][4] - TVs with AppleTV apps or Netflix's Gibbon[5][6] - Command line apps as stdin/stdout with react-blessed[7]/mylittledom[8] - Direct to Canvas[9]/pixi.js[10] - Latex documents[11] - Web Audio[12] - Conole.logs[13] - Truly custom direct to hardware[14] as some C code like: `digitalWrite(led, HIGH)` I definitely believe JSX could use standardization separate from any implementation, JavaScript or otherwise. [0]: link [1]: link [2]: link [3]: link [4]: link [5]: link [6]: ▶ this video [7]: link [8]: link [9]: link [10]: link [11]: link [12]: link [13]: link [14]: link

CitesView on HN
@zappo29382017 · in “The Cost of Native Mobile App Development Is Too Damn High”

Sorry. I was under the impression after watching this video Netflix was using React across all devices. [0] [0] ▶ this video

CitesView on HN
@mikeryan2015 · in “A View of the Entire Netflix Stack”

Picking a nit, they don't use React in the browser across all devices. They actually use an internal rendering engine called Gibbon on some devices with client code written JavaScript with React but not rendering to HTML or a browser instead using their internal engine. Interestingly this has become easier with React breaking out React and ReactDOM. Interesting to note that Netflix must see Gibbon as a competitive advantage, I've been told its not likely to see an open source release. ▶ this video

CitesView on HN
@mikeryan2015 · in “Is ReactJS really fast?”

There's an interesting video by Netflix where they discuss using React in their stack. To increase performance on many of Netflix's TV or Console based UI's they have their own rendering engine they're using instead of the manufacturer's browser engine. This means any of React's "speed" improvements are a moot point so instead they use it because of its simplicity for UI layouts. ▶ this video

RecommendsView on HN
@mjjohnston2015 · in “Flipboard releases React Canvas”

It's worth mentioning that much of the code that integrates with React internals is based on the work in react-art: link This is the same technique used by Netflix for their React-based television UI. ▶ this video

CitesView on HN
@peterhunt2015 · in “First Impressions Using React Native”

If you're interested in doing it with React, here's a video explaining how to do a custom backend: ▶ this video You basically need to change BackendIDOperations and ReactEventListener to send/receive messages vs talking to the real APIs. It's already set up in the codebase to do this (because it actually worked at one time). Webpack, per usual, already thought of this and has an answer for you :) link

RecommendsView on HN
React.js Conf 2015 - Hype!31:17

React.js Conf 2015 - Hype!

Meta Developers
108K views • 11 years ago
React.js Conf 2016 - Ben Alpert - What Lies Ahead27:45

React.js Conf 2016 - Ben Alpert - What Lies Ahead

Meta Developers
50K views • 10 years ago
Pete Hunt - The Secrets of React's Virtual DOM (FutureJS 2014)35:25

Pete Hunt - The Secrets of React's Virtual DOM (FutureJS 2014)

Codegram
75K views • 12 years ago
React.js Conf 2015 - The complementarity of React and Web Components25:47

React.js Conf 2015 - The complementarity of React and Web Components

Meta Developers
22K views • 11 years ago
Lin Clark - A Cartoon Intro to Fiber - React Conf 201731:48

Lin Clark - A Cartoon Intro to Fiber - React Conf 2017

Meta Developers
216K views • 9 years ago
React.js Conf 2016 - Lightning Talks - Elie Rotenberg4:40

React.js Conf 2016 - Lightning Talks - Elie Rotenberg

Meta Developers
4K views • 10 years ago
[JSConfUS 2013] Tom Occhino and Jordan Walke: JS Apps at Facebook18:55

[JSConfUS 2013] Tom Occhino and Jordan Walke: JS Apps at Facebook

JSConf
45K views • 13 years ago
Netflix JavaScript Talks - Async JavaScript with Reactive Extensions28:39

Netflix JavaScript Talks - Async JavaScript with Reactive Extensions

Matt Marenghi
69K views • 12 years ago
Hacker Way: Rethinking Web App Development at Facebook44:36

Hacker Way: Rethinking Web App Development at Facebook

Meta Developers
900K views • 12 years ago
Dan Abramov: Beyond React 16 | JSConf Iceland33:25

Dan Abramov: Beyond React 16 | JSConf Iceland

JSConf
139K views • 8 years ago
Cheng Lou - On the Spectrum of Abstraction at react-europe 201635:32

Cheng Lou - On the Spectrum of Abstraction at react-europe 2016

ReactEurope
63K views • 10 years ago
High Performance Web Sites and YSlow1:00:34

High Performance Web Sites and YSlow

Google TechTalks
90K views • 18 years ago
Pete Hunt: React: Rethinking best practices -- JSConf EU29:32

Pete Hunt: React: Rethinking best practices -- JSConf EU

JSConf
548K views • 13 years ago
Dan Abramov - Live React: Hot Reloading with Time Travel at react-europe 201530:41

Dan Abramov - Live React: Hot Reloading with Time Travel at react-europe 2015

ReactEurope
472K views • 11 years ago
React Today and Tomorrow and  90% Cleaner React With Hooks1:35:30

React Today and Tomorrow and 90% Cleaner React With Hooks

React Conf
1.2M views • 8 years ago
React without memo12:01

React without memo

React Conf
150K views • 4 years ago
Keynote - JSON Graph: Reactive REST at Netflix54:58

Keynote - JSON Graph: Reactive REST at Netflix

Association for Computing Machinery (ACM)
41K views • 11 years ago
Chrome vs Firefox vs Safari vs Servo WebRender0:14

Chrome vs Firefox vs Safari vs Servo WebRender

Jake Archibald
121K views • 10 years ago
Progressive Performance (Chrome Dev Summit 2016)35:42

Progressive Performance (Chrome Dev Summit 2016)

Chrome for Developers
34K views • 9 years ago
Pete Hunt: React - Rethinking Best Practices (updated) - JSConf.Asia 201340:58

Pete Hunt: React - Rethinking Best Practices (updated) - JSConf.Asia 2013

JSConf
58K views • 12 years ago