QML vs. HTML5

July 28, 2017 Stefan Larndorfer

Guest post by Stefan Larndorfer at sequality

Mobile devices have set the standard in terms of responsiveness and user-friendliness for HMIs across industries. Manufacturers of cars, medical equipment, industrial automation systems and consumer electronics now want to replicate this great user experience for their embedded devices. To find out which technology strategy we should select we set up a test where one of our developers was allocated 160 hours to create a demo application of an embedded system using Qt & QML and same number of hours to create the very equivalent application using HTML5.

Over the past year, more and more customers have been asking us at sequality if they should use HTML5 or Qt using the QML declarative UI language to develop software for embedded devices.

In order to give the most objective advice to our customers, we decided set up a test: give the same developer 160 hours to create a demo of an embedded system using Qt and 160 hours to create the demo using HTML5. These demos would show exactly how the two technologies compare – in terms of development, performance, and sustainability – when used to create the same product. The developer tasked with creating the demos was experienced with using HMTL5 and C++, but had little experience creating user interfaces using Qt and QML. The demos were created independently without any vendor input.

QML vs. HTML 5 test results

The demos showed that although the same amount of development time was spent on both versions, implementation with Qt QML delivered a more functional and complete user interface than the HTML5 version. The testing and debugging process was found to be more straightforward with Qt QML, not least because it didn’t need testing on multiple browsers. In general, the Qt QML version responded more quickly and enabled features, like keyboard and multi-touch, that were not supported by HTML5 without additional implementation.

From an end-user perspective, the Qt QML version behaved exactly as expected regardless of the browser or screen being used to view it.

This is because Qt based applications are compiled for the target, meaning that in terms of user observation, they behave exactly the same no matter which platform they run on. HTML5-based applications, on the other hand, run on the browser of the target, for example Chrome, meaning different platforms can show different behavior as the browser might use different rendering engines depending on the platform.

In terms of the sustainability of the technology, Qt QML is a mature technology that has been developed to ensure backwards compatibility. The AngularJS framework for HTML5 is relatively new, and a valid concern is whether it will be replaced by a new framework in the future. In contrast, QML is very likely to still be supported in 5 years.

Overall, Sequality found that the development of the applications was very different and one needs to carefully consider the benefits and drawbacks of each technology before deciding which one to use.

If the outcome of such an evaluation does not show major advantages of a particular technology, we would recommend Qt over HTML5. In our showcase, the Qt based application was generally faster, more responsive, and easier to implement.

Want to know more?

Download the QML vs. HTML 5 Whitepaper.

Visit us at our booth at Qt World Summit 2017.

 

About

Stefan Larndofer is the CEO and Founder of sequality software engineering. Sequality provides high-quality software engineering services, specializing in user interaction (graphical user interfaces, touch screen software, C++/Qt, embedded Linux) technology. Sequality delivers software with a great user experience, inspired by mobile devices. www.sequality.at

The post QML vs. HTML5 appeared first on Qt Blog.

Previous Video
Creating Devices Easily with Qt for Device Creation
Creating Devices Easily with Qt for Device Creation

Creating embedded systems for devices has never been easier. Watch this video how Qt can help you cut down ...

Next Video
Qt for IoT & Medical, Wind River VxWorks 7 and Helix Cloud with Accelerated Graphics
Qt for IoT & Medical, Wind River VxWorks 7 and Helix Cloud with Accelerated Graphics

Optimize IoT Cloud Connectivity with VxWorks & Qt's Accelerated Graphics - View a home healthcare system wi...