Music streaming app for Samsung and LG

Project recap in three points

The client is:

Media entertainment company

The solution to adapt is:

Music streaming service platform

Platform support requested:

Smart TV apps for Samsung and LG TVs

Negotiating the project goals

Maintenance cost optimization was key for the client

“Working with the team to adapt our existing application for Samsung and LG Smart TV platforms is a crucial step in streamlining our development process. By unifying the code, we’re ensuring seamless support across multiple platforms while reducing maintenance costs. We’re excited to see how this project is making our team more efficient and our app even more accessible.”

Low-end TVs became a tough nut to crack

“Adapting the existing code to work with older versions of Tizen and WebOS was a challenging task. The combination of working within the constraints of web-hosted app requirements, especially with Samsung’s restrictions, and the need to support outdated Chromium versions meant we had to make some non-obvious code modifications. But through careful planning and collaboration, we were able to tackle these challenges and deliver a solution that met the client’s needs.”

Optimizing code maintenance through its modularization

The team optimized code maintenance by splitting the code into two distinct versions, ensuring better compatibility and support management. Thus, the team improved long-term maintenance efficiency, isolated device-specific issues, and ensured smooth performance across various platforms.

Legacy apps

Launched on Samsung TVs (Chromium 47-63) and LG TVs (Chromium 53).
Focused on providing support exclusively for these devices, with no ongoing updates or support planned for future platforms.

New device apps

Launched on Samsung TVs (Chromium 69+) and LG TVs (Chromium 68+).
Continued updates and improvements for newer device generations without affecting older systems.

Adapting the UI capabilities to low-end TVs

Considered compatibility of older TV models: Identified that older Samsung devices (2015-2017) didn’t support DASH streaming with PlayReady DRM.
Addressed playback issues: Resolved problems with apps using DASH streaming and PlayReady DRM on webOS 3.5, Tizen 3.0, and earlier versions.
Adjusted streaming and DRM configuration: Made changes to ensure proper playback by optimizing the streaming and DRM setup.
Changed DRM system: Switched from PlayReady to Widevine to ensure broader compatibility across devices.
Tested on multiple TV models: Verified that the app performs well across various hardware, focusing on lower-end or older models.

Eliminating performance blockers

Minimized CSS and JavaScript animations: Simplified animations, such as loaders, to prevent performance slowdowns, resulting in a more basic interface optimized for low-end TV hardware.
Reduced re-rendering processes: Optimized the handling of large caches and complex layouts by using Canvas for more efficient rendering and reducing memory usage. This allowed smoother performance on devices with limited RAM.
Implemented lazy loading: Utilized lazy loading to load content in smaller segments, enhancing the app’s responsiveness and reducing the load on low-end devices.
Adopted React Virtualized: Integrated React Virtualized to employ virtual rendering, ensuring only visible rows are rendered and reducing DOM elements, significantly improving performance.
Evaluated hardware limitations: Assessed the impact of complex rendering techniques, like Canvas, on older devices such as those running LG’s WebOS 3, which required adjusting strategies for better performance.

Aligning with Samsung’s Content Security Policy

Content security

Inline scripts are not permitted in Tizen apps due to Samsung’s Content Security Policy (CSP), as they expose the app to potential attacks.

What did we do?

The team identified and removed inline scripts in the client’s Tizen app. We used external .js files to maintain security, as these files are more difficult to manipulate, especially when minified.

Overcoming Tizen’s hosted app limitations

Obstacle

Web hosted apps aren’t approved by the app store

Samsung’s Tizen platform posed a significant challenge, particularly with versions 2.3 and older, where hosted apps are not supported. This restriction meant that our app, initially hosted, could not be directly submitted to Samsung’s app store. Additionally, while hosted apps allow for quicker updates, submission to Samsung required compliance with their approval process, potentially causing delays.

Solution

Converting to a packaged app for store submission

To resolve this, we converted the app into a packaged format, following Tizen’s guidelines for app configuration. This involved creating a package with a server link and generating an index file. After completing the necessary configurations, we submitted the packaged version to Samsung for approval. This allowed us to meet the platform’s requirements while ensuring a smooth release process for the client.

Manual testing for unparalleled quality

Cross-device and platform testing

One of the critical aspects of the testing process was performing cross-device testing. It was essential to test the application across as many devices, Chromium versions, and Smart TV versions as possible to ensure consistent behavior and functionality.

Utilization of developer tools

The QA Engineer made effective use of developer tools to launch the project, inspect code errors, and gather console outputs. This approach not only accelerated the testing process but also helped the development team quickly identify issues, ultimately saving valuable time.

Bug triage and fixes

While the total number of bugs was not the main focus, each identified bug was triaged according to its severity. All bugs categorized as major and higher were promptly addressed and fixed by the development team. This thorough approach ensured that the application was ready to meet the standards required to pass Smart TV market reviews, providing a smooth and functional user experience.

What’s now?

The project successfully met its primary objective, with the Smart TV apps being merged, tested, and handed over to the client’s development team for ongoing maintenance. Additionally, the applications were successfully launched on both the Samsung and LG app stores, marking a key milestone in the project’s completion.