If you find yourself in the situation where you have to choose between native or JavaScript controls you should consider that there’s more than simply focusing on the technical advantages and disadvantages when choosing an approach. You should also bear in mind how your choice will affect the user experience.

Differences between Native and JavaScript controls

Native controls in HTML5 or hybrid apps are good, and can be used pretty easily. They are limited however. So for areas of your UI where it isn’t important to have a distinctive, custom look, you can pick the native controls.
They are created for generic usage but don’t provide a flexible API nor extensive styling capability.

In case of JavaScript controls with HTML and CSS in the background, you can fine-tune the user experience to the max and make your app “smarter” by exploiting its decision-making capabilities. You can use JavaScript to enhance HTML forms and to make it look as part of your app and consistent with your brand.

Another huge hassle is OS and browser compatibility. While the modern browsers and platforms keep up with the HTML5 specs fairly well, there can be differences in support and rendering. If you want to make sure the UX is the same on all platforms and in all browsers, running with a JS control should be your pick. Make sure to check caniuse.com to see if the native elements are supported.

Below we provide you a comparison of what we have found to be the downsides and the advantages separately for native and JS enhanced components like in the case of a date picker or select tool:

Native

Pros

Cons

JS

Pros

Cons

Conclusion

We enumerated the cons and pros that we have encountered during our working processes to help you get a detailed overview about the downsides and advantages of both approaches.

We know that it isn’t always clear and obvious which is the best of the two and the reality is that it depends. Our suggestion is that first of all you think about your product and how your choice will affect the user experience and overall feel. You should decide by weighing the advantages and disadvantages separately for Native and JS controls and consider how it will be used by your target audience and customers.

If styling and customization isn’t important and it’s OK that it might not look and work in the same way on all devices, pick native controls.

If customization, validation and enhanced user experience is important to you, JS controls are the way to go.

What controls have you used or worked with? Do you prefer Native vs. JS or maybe something else?
Do you have anything to add to our cons and pros list? Let us know in the comment section below.