2

我在 AngularJS 中有一个 SPA，它将不同的模板加载到一个 SPA 中。

阅读此https://developers.google.com/web/fundamentals/performance/critical-rendering-path/measure-crp?hl=en后，我在 SPA 的正文中包含了一个 onload="measureCRP()"，其中基本上是这样的

<body onload="measureCRP()">
  <div ng-app="app">
    <div ng-view></div>
  </div>
</body>

每次加载页面时，我都可以看到构建 DOM 所花费的时间以及页面的整体加载时间。

但是当然，当视图更新时，它不会更新。我想过在所有模板中包含类似的东西，但它似乎不起作用。

关于如何做到这一点的任何想法？

编辑。

我尝试按照其他帖子 Angular js ng-view 渲染事件中的建议包括 onload 

<body>
  <div ng-app="app" ng-controller="SpaController as spa">
    <div ng-view onload="spa.measureCRP()"></div>
  </div>
</body>

但是虽然函数 measureCRP() 再次执行，但显示的值每次都完全相同，所以我的猜测是收集的时间戳保持不变。谢谢

4

1 回答 1

0

这是SPA中的一个问题。“真正的”导航只发生一次，所有其他导航都是由框架通过 AJAX 完成的。这意味着 onLoad 将在 DOM 完成时触发，但这并不意味着显示了某些内容。

我认为这个链接会帮助你

https://www.soasta.com/blog/lessons-learned-web-performance-monitoring-single-page-applications/

再见

于 2016-12-02T01:37:19.543 回答