(3)-窥探开发者选项

> 参考文章:  > [debug](https://facebook.github.io/react-native/docs/debugging.html#content)  > [Memory leak in profile](https://github.com/facebook/react-native/issues/1452) ## react-native的开发者选项 在模拟窗口上按`Ctrl+Command+z`或者`Command+d`会调出`react native`的开发者选项:  ## Reload 重新运行程序，类似于在Xcode中按`Command+R`. ## Debug in Chrome 在Chrome浏览器下调试，在chrome浏览器下输入`http://localhost:8081/debugger-ui`,再按`Alt+Command+j`出现浏览器debug窗口如下：  这一部分的知识属于chrome浏览器如何调试的知识，有兴趣可以单独学习。 ## Debug in Safari 在Safari浏览器下调试,safari还没找到具体的事例。 ## Show FPS Monitor 打开FPS监控器，如下图底部的状态栏:  ## Inspect Element 可以用来查看页面中元素的结构以及属性，以及性能相关信息：  点击该选项后出现：  然后我们选择一个控件：   然后选择`perf`一览，可以查看脚本下载以及执行时间(还有一个TTI是什么鬼，以后再说)：   ## Enable Live Reload 修改js文件后，app立即显示修改后的效果。  ## Start Profiling 进行性能分析，一段时间后点击`Stop profiling`会提示如下信息：  说明我们的分析结果已经在服务器保存了，那至于这个到底分析的是什么呢？首先我们找到该文件，根据控制台输出信息：   我们打开浏览器中输入`file://tmp`可以看到如下界面:  点击我们刚才保存的文件：    google提供了工具[`trace-viewer`](https://github.com/google/trace-viewer)将这个json文件转化为html文件，方便我们分析数据,转化后的结果如图：