React-native Android Systrace HTML 在 Ubuntu 14.04 中为空白答案

【问题标题】：React-native Android Systrace HTML is blank in Ubuntu 14.04React-native Android Systrace HTML 在 Ubuntu 14.04 中为空白
【发布时间】：2016-08-20 08:08:13
【问题描述】：

我使用 Android SDK 中的 systrace.py util 将我的基于 React-Native 的 Android 应用程序的跟踪记录收集到了一个 html 文件中。当我在 Chrome 50.0.2661.86（64 位）或 Firefox 45.0.2 中打开此 html 跟踪文件时，我在开发人员控制台中看到空白屏幕和 a few JavaScript errors。操作系统 Ubuntu 14.04 64 位操作系统。

但是在我的 Windows 机器上，html 跟踪在 Chrome 49.0.2623.112 中正确呈现，没有错误。

谁能帮我解决这个问题？

【问题讨论】：

FWIW，在 Win10 Chrome 50.0.2661.87 上，我的系统跟踪显示为空白，而 Ubuntu Chrome 49.0.2623.110 仍然有效。我猜 Chrome 坏了。

标签： android google-chrome ubuntu react-native systrace

【解决方案1】：

在 Chrome 49 中有一条关于 Object.observe 被弃用的警告。

https://developers.google.com/web/updates/2016/02/chrome-49-deprecations?hl=en#objectobserve-is-deprecated

在 Chrome 50 中，他们终于将其删除了。

https://www.chromestatus.com/features/6147094632988672

很遗憾，Android platform-tools 中的 systrace 没有跟进。在最新版本中（我尝试了 Android SDK platform-tools 24 rc2），它仍在生成带有 Object.observe 的 html 报告，因此从 Chrome 50 开始，我们无法打开任何报告。

我想一种方法是使用 50 之前的 Chrome 版本。

【讨论】：

在 Opera 版本 37.0 中，Systrace 对我来说很好。

【解决方案2】：

只需添加

<script src="https://rawgit.com/MaxArt2501/object-observe/master/dist/object-observe.min.js"></script>

到 HTML 文档的 head 部分，带有 trace 使其在 Chrome 50+ 中工作

【讨论】：

这对我有用。完整项目链接：github.com/MaxArt2501/object-observe
FWIW，我不建议将 GitHub 用于实验。幸运的是，这里也可以使用 polyfill：cdnjs.com/libraries/object-observe

【解决方案3】：

作为临时解决方法，您可以使用以下方法：

将 .html 转储文件保存到磁盘
在 chrome 中打开标签chrome://tracing
在跟踪控制台中加载文件

【讨论】：

失败并显示以下消息：Error: Couldn't create an importer for the provided eventData. at Import.createImporter_ (chrome://tracing/tracing.js:1348:3342) at Import.createImports (chrome://tracing/tracing.js:1343:21) at Task.run (chrome://tracing/tracing.js:2062:13) at runAnother (chrome://tracing/tracing.js:2074:136) at runTask (chrome://tracing/tracing.js:2037:57) at processIdleWork (chrome://tracing/tracing.js:2043:116) at window.requestIdleCallback.timeout (chrome://tracing/tracing.js:2031:81)

【解决方案4】：

Android SDK 中的 Systrace 已过时。您可以使用 AOSP 项目中的 systrace：

git clone https://android.googlesource.com/platform/external/chromium-trace

【讨论】：