Created Our Own Video Player Library

Our mobile application infrastructure is built primarily with React Native. While React Native enables rapid cross-platform development, the dependencies that come with its ecosystem have created a constant need for performance optimization. In this article, I'll discuss the technical challenges we've faced, how we solved them, and what we're doing to continuously deliver a faster experience to our users.

React Native is currently one of the best frameworks available for mobile application development. Its ecosystem is massive, and it's easy to find libraries and tools for almost any requirement. This allows us to develop features quickly and efficiently.

So if React Native is so great, what's the problem?

Imagine you're stranded in the middle of a desert and desperately need water. Nearby, there's only one person selling water from a well. Nobody is stopping you from drawing water yourself, but doing so would take time, and you need water immediately. Naturally, you buy it from the seller.

Over time, however, one glass of water is no longer enough. You keep relying on the same person every time you need water, creating a dependency. The moment that person slows down or stops drawing water, long lines begin to form.

Software dependencies work in a similar way. You can always build your own tools, but existing solutions are often more attractive because they save time. The downside is that these tools are usually designed to solve multiple problems, which means they often include features your application doesn't need. As a result, your app becomes larger, more complex, and slower. Removing the dependency may improve performance, but it often means sacrificing functionality.

Instead of developing separate applications for Android and iOS, we maintain a single React Native codebase and distribute it to both platforms.

One of the biggest challenges is that iOS devices generally execute applications more efficiently than Android devices. As a result, features that perform smoothly on iOS may struggle on Android, especially on lower-end devices.

Video playback is a core feature of our application, but React Native does not provide built-in support for it. To solve this, we rely on third-party libraries. Most of these libraries focus solely on video playback and provide little or no caching support.

Since much of our content is streamed over the internet, pages that load multiple videos simultaneously can become extremely slow and, in some cases, even cause application crashes. On top of that, many advanced features offered by these libraries are locked behind paid plans.

Whenever we need a new feature or improvement, we must submit requests to the maintainers and wait for them to prioritize and implement the changes.

We realized we weren't the only team facing these challenges, so I decided to create an organization dedicated to solving common problems in application development: Orca Runtime.

The goal of Orca Runtime is to build open-source tools that address real-world performance and development challenges. Everything released under the organization is completely free and open source.

Beyond libraries, I also plan to release additional tools and applications in the future.

Earlier, I mentioned the challenges around video playback. Here's how we solved them.

I developed a completely new library and published it as an npm package called Orca Video Player.

Instead of relying on existing solutions, the library directly bridges the native video players available on Android and iOS into React Native using Nitro Modules. In addition, it provides features such as:

Video preloading, intelligent caching, support for multiple video formats, performance-focused architecture

All of these features are available for free.

As a result, videos that previously loaded slowly or suffered from stuttering now play significantly more smoothly. At the same time, developers can write less code and manage video playback from a single optimized solution.

You can see the before-and-after comparison in the video below.

As our application continues to evolve, we'll inevitably encounter new challenges that require new solutions. Building custom tools and libraries is often the most effective way to overcome these obstacles.

We're just getting started. Stay tuned there's much more to come.

https://github.com/Orca-Runtime/orca-video-player