RN Android 64位apk界面卡死
问题描述
- 补充：经评论区的朋友自己测试，最新版穿山甲已经修复了该问题。（本人未进行验证，还请读者自行验证）
Rn开发的程序,进行打包后的Anroid 64apk,在接入穿山甲广告之后,启动应用程序操作一段时间界面就会卡死,
具体表现为内嵌的webview可以进行点击和滑动操作,原生的界面可以上下滑动,但是不响应所有点击操作.软件也不会宕掉.
该问题只出现在64位apk中.32位apk表现正常
解决方案
先说解决方案,该问题由js引擎处于睡眠状态导致的,办法就是换一个js引擎, RN支持的引擎有JavaScriptCore和Hermes两种.该问题是在第一种引擎JavaScriptCore下出现的.所以换成Hermes引擎就可以了.
开启Hermes引擎支持
打开android/app/build.gradle文件,按照以下方式修改
project.ext.react = [
entryFile: "index.js",
- enableHermes: false // clean and rebuild if changing
+ enableHermes: true // clean and rebuild if changing
]
这里贴一个RN的官方的链接,是介绍如何开启Hermes引擎支持的
启用 Hermes 引擎
解决思路
穿山甲
首先对问题进行定位,发现只要穿山甲进行了初始化就会出现该问题.且不论穿山甲的初始化在Application还是Activity,公司同事联系过穿山甲那边,穿山甲回应说没有对RN进行过兼容性测试,让我们自己解决...我们拿到的穿山甲依赖包都是经过混淆的,也没办法查看穿山甲的初始化到底做了什么操作...我.T..M...
对RN进行调试
从问题表现来看,界面的渲染应该是没有问题的,andorid是通过主线程进行界面渲染的,所以主线程是正常运行的,而且主线程卡顿几秒之后系统就会提示应用未响应的消息,让关闭该应用.
通过查询资料发现RN一共有三个线程
- 第一个线程用来运行js引擎,跑js代码
- 第二个线程是native线程,用来运行yoga引擎,计算布局
- 第三个线程就是主线程,进行界面渲染工作.
对RN进行Debug,需要关闭RN的在线加载功能,将js代码直接打包到资源文件中
1. 关闭RN在线加载功能
打开Application类,将getUseDeveloperSupport()方法的返回值修改为false就可以,如下
@Override
public ReactNativeHost getReactNativeHost() {
if (mReactNativeHost == null) {
mReactNativeHost = new ReactNativeHost(this) {
@Override
public boolean getUseDeveloperSupport() {
return false;
}
......
};
}
return mReactNativeHost;
}
2. js代码打包至Android资源文件(index.android.bundle)
在Rn项目目录下运行如下命令行代码
react-native bundle --entry-file index.js --platform android --dev false --bundle-output ./android/app/src/main/assets/index.android.bundle --assets-dest ./android/app/src/main/res/
打包的具体方法和介绍可以在网上找到,这里我贴一个其他人博客的链接,大家可以自己查看
react native 如何打包生成Js Bundle文件（以android 为例）
在调试的时候,我们继承了ReactActivity这个类作为测试类,然后让主界面继承测试类(防止对业务代码的误修改),在测试类中拦截点击消息,系统退出消息等.拦截代码如下
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
Log.v("test","======================main======================");
MainApplication.reactManager.getCurrentReactContext().runOnJSQueueThread(() -> {
Log.v("test","======================js线程======================");
});
return super.onKeyDown(keyCode, event);
}
@Override
public boolean onKeyUp(int keyCode, KeyEvent event) {
Log.v("test","======================main======================");
MainApplication.reactManager.getCurrentReactContext().runOnJSQueueThread(() -> {
Log.v("test","======================js线程======================");
});
return super.onKeyUp(keyCode, event);
}
MainApplication.reactManager 该变量可以从Application类中保持
获取方式
MainApplication.reactManager = getReactNativeHost().getReactInstanceManager()
界面正常工作的时候日志时正常打出来的.但是界面卡死之后就只有主线程的日志可以打印,js线程无响应.
从此处再次确定是js引擎问题,分析到这里问题已经能够定位了,但是我们当时并没有想到更换其他js引擎,然后我们去抓了运行时的堆栈信息,又做了其他事情...
写到这里,不得不感叹命运之神对我的眷顾. 回家的路上我突然想到,既然js引擎有问题,那我们换一个引擎试试行不行? 可能不同的引擎有不同的表现结果? 然后我查了下资料,发现好像可行. 我把这个消息告诉了同事,约定第二天试试...
第二天没用多少时间就确定方案有效...
再次感谢命运之神对我的加持
该博客只是为了学习新知识和梳理知识,如有错漏,还请大家指正.
