如何知道何时使用Chrome开发工具:性能与内存选项卡

Com*_*ode 1 google-chrome google-chrome-devtools google-chrome-app

假设我有一个网络应用程序很慢,我想找出可能的瓶颈.我首先进入网络选项卡,看看服务器是否有问题,如果网络调用没问题,那么我应该继续执行性能内存选项卡?

性能选项卡的用例和内存选项卡的用例是什么?

Kay*_*ues 5

性能选项卡的用例和内存选项卡的用例是什么?

" 性能"面板为您提供录制期间页面性能的完整视图.这包括网络请求,JS执行,解析,渲染,绘画等.

" 内存"面板为您提供有关页面如何使用内存的详细视图.人们大多使用它来调试内存问题.当页面在使用时逐渐变慢,这有时会导致内存泄漏.当页面一直很慢时,有时候这是一个使用太多内存的页面.

假设我有一个网络应用程序很慢,我想找出可能的瓶颈.我首先进入网络标签...

实际上,我建议从" 性能"面板开始.它可以显示网络活动,以及一堆其他页面活动.在确定问题是网络问题后,请转到"网络"面板.

  1. 请参阅"运行时性能入门"以熟悉" 性能"面板.
  2. 记录页面加载.

录制完成后," 性能"面板上有许多不同的部分可以帮助您发现各种瓶颈:

有关" 性能"面板的更多信息,请参见性能分析参考.