使用Cordova开发Android应用

最近的项目使用Cordova框架开发,主要运行目标是Android平台。我们一开始面临的问题是从无到有构建一个混合架构下的程序,在简单学习JavaScript和AngularJS后,开始了功能的构建。一段时间后发现程序因为内存不足而崩溃,开始进行性能调优。

前期开发中一直使用alert和console.log进行调试,竟然也实现了许多功能。但总是需要打许多log,一遍遍的运行程序。后来偶然发现Cordova可以使用chrome dev tool调试,简直太方便了。

下边将依次介绍我们采用的调试方法和性能调优方法。

调试

chrome remote debug

  1. 打开Android手机开发者选项中的USB调试。

  2. 打开chrome的开发者工具。 屏幕快照 2016-05-05 21.03.00

3.打开开发者工具中More tool中的Inspect device。
屏幕快照 2016-05-05 21.03.20

4.左侧会显示连接的设备,点击一个设备名,右侧会显示如图,罗列能够调试的程序。 屏幕快照 2016-05-05 21.03.45

5.点击Inspect,进入调试界面。这里就与chrome开发者工具的操作一样了,可以查看网络请求情况(Network栏),进行断点调试(Source栏)。调试窗口的左边会有一个屏幕,是和Android设备同步的,在Android设备上的操作会反映到这里,在这里也可以直接操作,会反映到Android设备上。 屏幕快照 2016-05-05 21.05.02

特别注意

我在点击Inspect后打开了一个空白页面,并且过很久都没有任何响应,各种搜索后,在这里找到了问题所在。原来打开这个页面后,有请求被GFW屏蔽了,导致没有下文。我的解决办法是让对应请求走代理。

性能优化

时间调优

在需要profile的代码段前后加入如下代码:

console.time("first");
...
...
console.timeEnd("first");

在chrome console里就会打出time到timeEnd期间消耗的时间。这个方法对于JavaScript这种有大量异步执行的语言非常合适。

内存调优

在遇到内存不足崩溃的情况后,我们开启了Android中的largeHeap,程序暂时不崩溃了,但是优化内存占用还是有必要的。

Android部分

由于目标平台是Android,因此主要想查看在Android下的内存占用。 Investigating Your RAM Usage是Android官方对查看内存介绍。 我们用到了其中的一个命令

adb shell dumpsys meminfo <package_name|pid> [-d]

能够看到程序占用的内存大小,以及heap大小。

JavaScript部分

chrome dev tool中有个profile栏,里边有对heap的统计,通过这个功能,我们可以看到当前时刻,JavaScript heap中的对象。

Loading Disqus comments...
Table of Contents