How We Took React Native to Roku by Playing in the Clouds
One of the most common questions I get when discussing You.i Engine One is, “Does it support Roku?” The answer is yes but with a twist. Allow me to explain You.i TV’s approach to deploying an app on Roku while sharing the same codebase with platforms like Apple TV, Samsung Tizen, Xbox One, and others.
Roku is the most popular streaming device in North America. As of a few months ago, Roku has sold over 41 million devices in the United States alone. Roku’s success is the result of a few factors.
First and foremost, it’s affordable. Flexible options range from low-end hardware like a streaming stick to the Roku Ultra 4K. If you’re a user who just wants to stream YouTube videos in HD, a $30 Roku Express Stick will meet all your needs and then some. Secondly, Roku is a relatively open platform. There are thousands of channels available, many of them free, offering movies, TV shows, kids content, and live sports feeds. Lastly, because of its early entry into the streaming space, Roku has had a headstart in acquiring viewers. Even though there are plenty of streaming devices to choose from today, Roku is familiar and sufficient enough for most users to keep them on the platform.
Deploying a streaming app on Roku is a smart investment but challenges do arise when going cross-platform. The way Roku’s development is set up requires engineering teams to build for it exclusively. If it were a one-off device, this might not be a problem, but going cross-platform means managing multiple iterations of an app on all relevant platforms. Staffing engineers solely for Roku can become costly when looking at the bigger picture.
Understanding Roku’s Development Environment
Roku’s development language is called BrightScript, a scripting language that runs above the Roku kernel. It is the sole way of interfacing with Roku hardware. Roku later introduced the SceneGraph API, an additional node based layer above the Roku API to declaratively build UI components.
You.i Engine One Architecture (left) – Roku Development Environment (right)
With this limitation in mind, and while still wanting to preserve a single codebase, we began exploring a cloud-based approach that would execute application code remotely and send the results to the hardware.
You.i Engine One, Roku, and the Cloud
Our approach to deploying on Roku is best understood by comparing it to the way a web browser works. In this case, You.i Engine One moves from being executed locally to being executed in a cloud server. When the user launches their app, much like a user navigating to a website, the app connects to a gateway that routes it to a virtual machine with an available instance of the app.
Each server can host 100 instances at least, and 200 on average. As the system reaches capacity, new servers are spun up to ensure scale. This application is run headless, meaning it produces no graphics to save on system resources. Instead, when the engine renders the scene it is transformed into SceneGraph components and serialized to the Roku. This is very similar to how a web server produces HTML to send to a browser.
When this information is received, it is decompressed and turned into the app that the developer intended to display. At this point, the components are totally local and the user can interact with them normally. When a user makes a selection, the event is forwarded to the server. This is comparable to clicking a link in a web browser. The input is processed and the new result is sent back to the client. If the change is small enough, the result can be patched into the scene rather than re-writing the description entirely. We call this technique sub-tree updating.
One side effect of this technique is that it introduces latency between the user’s click and the resulting update to the screen. On average this latency is roughly a two-second delay, similar to clicking on a link in a web browser.
Add Roku to Your Platform Strategy
It’s been an interesting R&D journey getting here, but we’re happy with the result. As of today, our Roku solution can scale to 1 000 000+ concurrent users and has performed for major events, such as the Super Bowl and March Madness. It is also under continuous improvement, with the latest optimizations squeezing an additional 2 times the number of engine instances per VM while also employing techniques such as serializing and hibernating the app during long periods of video playback.
Working with Redbox has been another milestone. Using our solution, they have become the industry’s first-ever Roku app to run entirely on React Native.
There has never been a better time to start writing an app with React Native for Roku on You.i Engine One. If you’re interested in a trial, click here for more information.
Seeing is better than believing, especially when it comes to maneuvering BrightScript. If you happen to be attending React Native EU, my colleague and I will be delivering a talk titled Taking React Native to Consoles, TVs, and Beyond Using the Dark Power of C++ on September 5th at 10 AM.
You.i TV will also be exhibiting Roku running on a single React Native codebase (and every other platform we support) at IBC 2019, September 13-17. If you are attending and want to see the demo live, please book a meeting.