Taking a Native-Centric Approach to Hybrid Mobile App Development

Over the past year, I have been exploring Cordova/PhoneGap, React Native, and NativeScript for hybrid/cross platform mobile development with JavaScript. As part of this exploration, my key question was, “Can I access the power of the native mobile platform while also leveraging the openness of JavaScript to maximize code reuse across platforms?”.

This led me down the road of a taking what I call a native-centric hybrid approach to developing iOS and Android apps. The philosophy behind this approach is that since Users expect an intimate UX on their devices, Developers should be diligent to get intimate with the platforms they are targeting while also striving to maximize code reuse to reduce overall development costs. The essence then is to mix native code (i.e. iOS, Java) with JavaScript code in the “right way” and strike a balance between UX and code reuse. In general, I discovered that things can get tricky mixing native code and JavaScript code, especially if there is a high degree of interaction between components.

However there are merits to this approach if care and attention is followed. In general,

  • Consider using native tech for app flow, transitions, animations, UI components with rich, complex interaction
  • Consider using HTML/CSS/JS for content rich UI components, services & business logic
  • React Native is a friendlier option for mixing Pure Native and Cross-platform JavaScript than Cordova
  • NativeScript with TypeScript/Angular 2 is an opinionated framework that takes a JavaScript first approach to cross platform mobile development
  • In the end, not sure the added complexity of mixing Cordova and Native is worth it. If you need to mix, React Native is a better option.

Presentation Slides and Demo Code

You can further explore my discoveries through the presentation slides and demos I put together by cloning the publicly accessible GitHub repository located at Native-Centric Hybrid GitHub Repository.

Once you clone the repository, checkout the README file for details on setting up your Macbook to run the demo examples.

I also encourage you to review the slides as context before going through the demo code. For convenience, the most recent slide deck (pdf format) can be found at Presentation Slides – 2016.

Places to Look for Inspiration

About the Author

Torey Lomenda profile.

Torey Lomenda

VP - Solution Delivery

Torey has over 26 years of software development experience.  As VP of Solution Delivery he blends his skills as a solution architect and pragmatic hands-on technologist to deliver working software solutions. He enjoys collaborating with clients and team members to develop enterprise software systems that provide right-fit solutions for the business.

 

As an architect he has expertise working with key stakeholders to drive common understanding leading to structured solutions that meet business, technical, and operational objectives. He follows a practical approach to modeling systems, applications, components, data and the flows between them to frame solutions that are feasible to implement.

 

As a technologist he has a solid foundation in web and mobile, cloud native APIs, and enabling modern platforms with the help of AWS and Kafka technologies. He has led the development of many mission-critical, end-to-end applications using a diverse set of technologies and supports a pragmatic delivery approach leveraging agile methodologies

 

Expertise: iOS and Android development, Web technologies (HTML, CSS, JavaScript, Ionic/Angular, Vue.js), APIs and enterprise applications (Spring Boot, Kotlin, Node.js, SQL, NoSQL).

 

Practical Experience: Cloud infrastructure (AWS, Google) and container orchestration (Docker, Rancher, Kubernetes), messaging (RabbitMQ) and data streaming (Kafka)

 

Interests: Micro-services architecture, cloud-based platforms and services, native & hybrid mobile development

Leave a Reply

Your email address will not be published. Required fields are marked *

Related Blog Posts
An Exploration in Rust: Musings From a Java/C++ Developer
Why Rust? It’s fast (runtime performance) It’s small (binary size) It’s safe (no memory leaks) It’s modern (build system, language features, etc) When Is It Worth It? Embedded systems (where it is implied that interpreted […]
Getting Started with CSS Container Queries
For as long as I’ve been working full-time on the front-end, I’ve heard about the promise of container queries and their potential to solve the majority of our responsive web design needs. And, for as […]
Simple improvements to making decisions in teams
Software development teams need to make a lot of decisions. Functional requirements, non-functional requirements, user experience, API contracts, tech stack, architecture, database schemas, cloud providers, deployment strategy, test strategy, security, and the list goes on. […]
JavaScript Bundle Optimization – Polyfills
If you are lucky enough to only support a small subset of browsers (for example, you are targeting a controlled set of users), feel free to move along. However, if your website is open to […]