What is Limeplay?
Limeplay is a modern, beautifully designed, and accessible component library for building highly customizable video player interfaces. It leverages the power of Shaka Player to support advanced streaming protocols like HLS and DASH.
Limeplay adopts an unopinionated approach, utilizing Shaka Player as a peer dependency. This design choice grants you full control over the Shaka Player instance, allowing for deep customization and integration according to your specific needs. Even if your project doesn't require advanced streaming features, standard native HTML5 video playback remains fully supported through Shaka Player.
Future Player Engine Support
Plans exist to support other popular player engines like hls.js, dash.js, and video.js. The goal is to create a unified adapter API that provides a consistent development experience across different players. However, developing a universal adapter presents challenges due to varying player versions and inconsistent APIs. We welcome ideas and discussion regarding this on our Discord channel.
Why Choose Limeplay?
While Shaka Player provides a default UI (view demo), it may appear dated and offers limited customization options beyond its standard configuration APIs. In modern web development ecosystems using frameworks like React or Next.js and styling solutions like Tailwind CSS, developers often require more flexibility than the default UI or native HTML elements can provide for complex, production-grade applications. HTML5 Native Media element comes with the support of basic functionality out of the box, modern playback formats like HLS or DASH streaming for Adaptive Bitrate Streaming or the support of content encryption standards like DRM or AES isn't well supported across browsers and its versions. To fill this void we decided to go with Shaka Player for the initial version.
Packages such as react-player offer helpful React wrappers around native HTML media elements, simplifying integration within the React ecosystem. However, they typically do not provide a comprehensive set of customizable UI components for the player itself. Building intricate UI elements like custom timeline sliders, interactive volume controls, or chapter markers from scratch can be time-consuming and complex.
Limeplay addresses this gap by providing a suite of well-designed, accessible player UI components. Furthermore, Limeplay utilizes the distribution model pioneered by shadcn/ui. Instead of installing a pre-compiled package from npm (which often limits deep customization), you integrate Limeplay components directly into your project's src/ directory. This gives you complete ownership of the code, allowing you to modify any style or logic to perfectly match your application's requirements. 🚀