Ionic react-native and native development mobile app that's good

Source: Internet
Author: User


Ionic react-native and native development mobile app that's good?

How to choose the mobile terminal development? Here is a look at the ionic,react-native,native of my eyes three types of mobile development selection comparison. you are welcome to add


One, cross-platform features

Ionic:Write once, run anywhere (one development, running anywhere, learning low cost will be HTML CSS JS can learn)

Does not involve system-level development, it is really a development run everywhere, if it involves system-level API calls and project configuration (such as iOS plist files) you need to manually write the Cordova plug-in way to achieve the effect (such as: How to open the registration file), of course, It is also possible to find ready-to-install plugins on the web.will be HTML CSS JS can learn to learn the cost of low

react-native: Learn once, Write Anywhere (one study, anywhere development)

Does not involve with native mixed words, unified JS carries on the development uses the JSX syntax to be able to do each end development, but needs to develop two sets of code for the iOS and the android.

Native:The use of native Java objective-c Development, each play each, cannot cross the platform.


Ii. mode of development


ionic:html + angularjs + CSS

Using HTML + ANGULARJS is similar to web development,the code only needs to be written once to achieve cross-platform effects, system-level calls by the Cordova plug-in solution, encapsulation is quite good, easy to use, special cases of their own hand-written plug-in is difficult, generally there is no need to manually write code plug-ins, there are more plug-ins available on the Web for download installation, available Flexbox layout. Call convenience (for example: to use the camera plug-in, only need to Cordova plugin add camera, and then you can use JS to call the native camera)

React-native:js + CSS


Common UI Whole JS development, in some cases need to use the native mixed with the way,there is no unified UI component, more iOS components, fewer Android components,There are more cases of writing JS files, simple space and logical layer can be shared,basically iOS and Android are two sets of code, the Flexbox layout is available.

Native:java + oc|swift
IOS Android different languages developed and adapted.


Third, function support


Ionic: Write the Cordova plug-in, you can achieve the full support of the native can complete functions ionic combined with Cordova can be achieved

UI interaction by the Web implementation, system-level interaction by the Cordova implementation, the current file upload download, url jump and file open methods have been done to verify the implementation, Cordova system-level call support is better, covering most of the system functions, such as camera, device information, battery, network, etc., Do not rule out potential unsupported issues.

react-native: Integrated with native to achieve full support

Android advanced components may need to be implemented on their own, system-level features can be installed through the installation of third-party plug-ins or integrated with native, basically function can fully realize


Native: all supportFully capable of achieving


Four, performance comparison

Ionic:
While performance has always been the biggest problem with HTML5 on the mobile side,but Ionic has done a great job., there is basically no way to differentiate between native apps on iOS


Android is largely invisible and native by optimizing


Ionic useionic-native-transitions Call native session basic see and native difference (for Android iOS)

Android 2G memory above the phone can not see and the original difference, performance close to the native.

Android Low-profile phone add crosswalk plugin after the experience is better, but the app packaging is too large. program run memory consumption is large (network data compared to the same product, memory consumption 100+m)



react-native:Basic proximity to native performance

JS to native need to pass the two-layer bridge, the performance and the original difference is not small (network data Compare the same product, memory consumption of more than M)

Native:developer level is importantBest Performance (network data comparison with the same product, memory consumption of +m)


Summary:Development levels are important, and HTML-developed apps may be faster than native. Mainly look at the level of developers and will not optimize




V. Comparison of pros and cons

Ionic:

Advantages:

iOS and Android can basically share code,Pure Web thinking, development speed, simple and convenient, once coded, run everywhere, if familiar with web development, it is less difficult to develop.
The document is full, the system-level support package is good, all UI components are HTML simulation, can be used uniformly.

Enables online updates to allow loading of dynamically loaded Web JS

Many documents, many developers, video tutorials how easy to learn to encounter problems easy to solve technology mature



Disadvantages:

High memory consumption (but the memory of the cell phone is large without affecting), not suitable for the game type of app, Web technology can not solve all problems, for the comparative performance of the place can not take advantage of native thinking to achieve complementary advantages, such as high experience of interaction, animation and so on.


React-native:


Advantages:

1, although can not do a code everywhere running, but basically even thetwo sets of code, also the same JSX syntax, using JS for development. User experience, higher than HTML, development efficiency 2, flexbox layouts are said to be simpler and more efficient than native's adaptive layouts
Enables online updates 2015.7.28 AppStore Audit Policy adjustment: Allow dynamic load code running on JavaScriptCore
Closer to native development

Disadvantages:

1. (citation) todeveloper requirements are high, not to understand DOT Web technology on the line, when the official packaging of the control, API can not meet the needs of the need to understand some native to expand, the extensibility is still far less than the web, and far less than directly write native code.
2, (citation) the official said very obscure: learn once, Write anywhere. I didn't say run anywhere. In fact, judging Sliderios,switchios from the official API. Wait for these controls, and then there's bound to be sliderandroid,switchandroid ...,It is very likely that multiple sets of code will be required for different platforms.
3, the development is not mature, currently many UI components only iOS implementation, Android needs to implement its own.
From native to the web, there are a lot of conceptual transformations that are bound to compromise both sides. For example, the Web to use a set of CSS version of castration, native through Css-layout to get the final style and then converted to native native expression (such as iOS Constraint\origin\center and other properties), such as animation. In addition, if Android and iOS have to do the same package, the concept of conversion is more complex 5, the document is not complete the learning curve is too high
4.documentation is less difficult to learn.


Native:

Advantage:
The best experience and functional implementation.
Complete and mature development documentation and demo.

Disadvantages:
Android Development learning curve is higher.
It is difficult to have ios,android dual platform master for separate development of each platform.
High cost of development

Ionic react-native and native development mobile app that's good

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.