During the development of HTML5 apps, developers may encounter various front-end problems, such as rendering problems and lagging. Because HTML5 app is loaded in the mPaaS container, you need to define whether such problems are related to the container.
Background
During the development of HTML5 apps, developers may encounter various front-end problems, such as rendering problems and lagging. Because HTML5 app is loaded in the mPaaS container, you need to define whether such problems are related to the container.
Resolution
iOS platform
The current container on the mPaaS iOS platform is implemented on WKWebView. WKWebView is configured and enabled after the 60 baseline. You can confirm whether the front-end problem is related to the container by the following method:
Simplify the code and logic of the front-end problem, then try to reproduce the problem on a simpler HTML page.
Load the offline or online page through the container to confirm whether the problem can be reproduced.
Construct another native iOS application and load the same page through native WKWebView to see whether the problem can be reproduced:
If the problem can be reproduced, there are three possibilities:
There is a problem with the front-end code.
There is a problem with WKWebView.
The front-end code and WKWebView have compatibility issues.
If the problem cannot be reproduced, it may be related to the configuration of the mPaaS container. We recommend that you search for group number 41708565 with DingTalk to join DingTalk group to contact technical support and provide HTML files for reproducing the problem.
Android platform
On the Android platform, developers can choose to use a container based on the UC browser kernel or the native browser kernel. The following method can be used to confirm whether the front-end problem is related to the container:
yyyyyyyyyyyyyyyyyyyyyySimplify the code and logic of the front-end problem, then try to reproduce the problem on a simpler HTML page.
Load the offline or online page through the UC kernel container to confirm whether the problem can be reproduced.
Load the offline or online page through the container of the native browser kernel to confirm whether the problem can be reproduced.
Construct another native Android application and load the same page through the native WebView to confirm whether the problem can be reproduced.
Through a combination of the preceding tests, developers can confirm whether the problem comes from the UC kernel, native kernel, container, or the front end.
Java Speech API (JSAPI) related issues
JSAPI is one of the features of mPaaS container. If the problem is related to JSAPI, it is inconvenient to verify through native WebView.
We recommend that you observe from the front end. Stripe the JSAPI related content and confirm whether the problem still exits.
If the problem exists, treat it as a normal front-end problem.
If the problem is highly coupled with JSAPI, we recommend that you simplify JSAPI before further investigation.
Handle with offline package pages
For the page in the offline package, if you need to verify whether there is a problem, you can extract the fallback url
of the page. Then load the fallback page through WebView to verify the problem.
The fallback base url
is located in the offline package configuration fileH5_json.json
.The fallback base url
+The relative page address
is thefallback url
of a page. See the following figure: Then load the page through the following address:https://mcube-prod.oss-cn-hangzhou.aliyuncs.com/7E3C5B0121415-beimo/20190003/1.xx.xx.2_all/nebula/fallback/www/index.html