react native 性能分析

Profiling Android UI Performance

Collecting a trace

$ /platform-tools/systrace/systrace.py --time=10 -o trace.html sched gfx view -a 

1、times the length of time the trace will be collected in seconds
2、sched, gfx, and view are the android SDK tags (collections of markers) we care about:
sched gives you information about what's running on each core of your phone, gfx gives you graphics info such as frame boundaries, and view
gives you information about measure, layout, and draw passes
3、-a
enables app-specific markers, specifically the ones built into the React Native framework. your_package_name can be found in the AndroidManifest.xml of your app and looks like com.example.app

Once the trace starts collecting, perform the animation or interaction you care about. At the end of the trace, systrace will give you a link to the trace which you can open in your browser.

Paste_Image.png

注意：需要python2.7，python3不支持
使用Chocolatey安装
chco python2

Reading the trace

将上步生成的地址 wrote file://*** 复制到浏览器

Paste_Image.png

官方(http://facebook.github.io/react-native/releases/0.36/docs/android-ui-performance.html#reading-the-trace)