监视和调试Angular组件的性能

时间:2018-03-29 17:57:54

标签: javascript angular performance monitoring

我的一个Angular(5.1.0)组件大大减慢了整个应用程序的速度:对应用程序的每个其他视图中的click事件响应需要30ms,在这个有问题的视图中需要大约350ms。虽然桌面性能在“有问题”和“正常”视图之间几乎无法区分,但移动设备上的性能差异是显而易见的,并且性能损失是惊人的(在上面的示例中,点击事件将更像是1500ms在智能手机上。)

最近基本上增加了两个新组件。其中一个持有视图,另一个呈现一些数据(并在页面上使用两次)。我会把赌注押在后者上,但我不知道从哪里开始。 Chrome DevTools和Safari开发人员工具现在可以为我提供有意义的事件时间,但要么我不知道如何深入挖掘,要么我完全需要不同的工具或方法来确定究竟是什么导致滞后。有什么想法吗?

1 个答案:

答案 0 :(得分:1)

对于问题的“监控”方面,您可以尝试Bucky一个开源工具来监控浏览器端的webapp性能。

还有一篇关于如何使用Statsd here监控AngularJS的帖子。

如果您非常关心衡量用户体验,可以查看使用百分位数,可以找到一些信息herehere