Development. Now an App in my hand is developing UI with Cordova+React and React Native respectively.

Layer (common for logic layer code). Of course, they are all small applications, and you don't need to consider page switching as written by @ Levitt. ...

My conclusion is: pit, what a big pit, tiger pit.

A little knowledge, only summed up the following questions:

1. Performance issues

The first animation.

Whether it is CSS3 animation, Canvas animation or JavaScript DOM animation, it is stuck. This is especially true of the latter. The high-end machine is ok, and the low-end machine can be stuck into a slide show. I have recorded GIF with Taipower P88 and Quan Zhi CPU. That's about it:/upload _ images/2015/08/201508158461_ 695.gif.

Secondly, it is the DOM performance problem.

Thanks to the virtual DOM brought by React, the performance problem of DOM refresh in local area is partially solved. However, once a large area of DOM update is involved, the performance loss will be even greater (the final calculation result will still be replaced, and one more step Diff will be done).

Facebook left the HTML5 application camp in 20 12 due to performance problems (Facebook: "betting on html 5 is a mistake"). But today, there is still no improvement. In addition, share an article, you can look at the pit: mobile HTML5 game performance optimization.

Here is an example: Weizhong Bank App is Cordova+Ionic+Angular. Weizhong is very good, and the app is very stuck. what do you think?

2. Compatibility issues

At present, it is only the official system. WebView of Android system is generally updated with the Android version (of course, you can also go to the Play Store to update it yourself), and each version supports different functions. The trap is in the domestic environment and will not be updated basically. Some functions are available in the corresponding version of Chrome on PC, but not in this version of WebView.

For example, Android 4.0.4 does not support onprogress of XMLHttpRequest. So for this system, we can only use iframe instead of progress bar, just like black IE before.

For another example, the later version of WebView supports ECMAScript 6. If developers are used to writing, they will introduce Symbol and forget polyfill. In the lower version of WebView, you will get an error. Just like me:

Then, thanks to the ROM manufacturer's tampering with the WebView that comes with the system, different mobile phones have different display effects or calculation results in various small details. To make matters worse, some people even have a whole page of confusion.

How to solve it? Personally, it may be a solution to bring an X5 similar to WeChat.

As for the example of compatibility problems, it is best to use Weizhong Bank: /t/2 15728 (not compatible with the new version of WebView of iOS 9).

3. Debugging problems

First spit out: WebView in Android 5.0+ system can be debugged with Chrome for PC. But it needs to climb over the wall.

Debugging includes debugging JavaScript and interfaces.

Java Script language

On the other hand, if throw makes a mistake, you may not be able to complete the rest of the operation. The performance of the mobile phone is that it is useless and will not crash and quit. When developing, for

JavaScript reports an error, and both MUI and Cordova can check the error through adb logcat; After publishing, there is no way to find a user connection.

USB。 Tools such as weinre are useless for JavaScript debugging.

So what does Wenner do? Just to show you the DOM hierarchy or dynamically execute code. This is the debugging of UI. In this part, considering the compatibility problem, I will do my own good. ...

Cordova provides Ripple, which is really a very good solution. But it does not cover all mobile phones. ...

4. Code security issues

straight

For example. apk->； . dex->； . jar-& gt； . class->； . Java can take out all the code at once, just like. apk

-& gt； . Js is more convenient, just decompress it. Therefore, before publishing, gulp/grunt must establish workflow and make it ugly.

And stuff it all in. This part is no different from doing the front end of a web page, except that there is no need to consider code segmentation (after all, there is no network, it is all local).

However, the modification cost of this code is very low. For example, if I play a paid local game, I only need a simple modification. Js, easy to crack and verify, and then repackage it, and the cracked version of the game will be ready, much simpler than Java. Even with C++, my js won't call you, so what can you do? If there is no server verification, go and play with eggs.

5. Functional problems

Without native code, all HTML5Apps are empty shelves. Therefore, Java/Objective-C/C# is still a language that must be learned; How to develop Native App is still compulsory. For example, the following code will open a link in MUI using a native browser.

Function open in browser (originaluri) (

var Intent = plus . Android . import class(" Android . content . Intent ")；

var main = plus . Android . runtimemainactivity()；

var Uri = plus . Android . import class(" Android . net . Uri ")；

var uri = uri . parse(original uri)；

Varintention = new intention (intention. ACTION_VIEW，uri)；

main . start activity(intent)；

}

Of course, Cordova has to write plugin, which is more complicated.