如何监控AngualrJS + spring

如何监控AngualrJS + spring-boot应用程序的性能(how to monitor performance for AngualrJS+spring-boot app)

我正在研究AngualrJS + spring-boot应用程序。 我们必须向用户显示每页的性能，比如页面加载所有数据需要多长时间？

这个的任何插件？ 还没找到

阻止我们的部分是，一个请求与多个ajax调用相结合，如何计算所有这些调用并将其发回，我的意思是像chrome的网络监视器，向我们显示加载的确切时间。

I was working on AngualrJS+spring-boot app. we will have to show the performance per page to user, like how long does it take a page to load all data?

any plugins for this? not found yet

the part that block us is, one request was combined with multi ajax calls, how to calculate all of those calls and send it back, I mean like chrome's network monitor, shows us the exact time to load.

最满意答案

注意：任何请求都会增加加载时间，代码如下所示无法知道何时停止监视。

我做了一些研究，发现了这个http://www.bennadel.com/blog/2777-monitoring-http-activity-with-http-interceptors-in-angularjs.htm

我使用拦截器来创建自己的探查器：

<!--some html--> <div>{{profiler.time}}</div>

angular.module('app') .run(function ($rootScope){ $rootScope.$on('$stateChangeStart', function (event) { Profiler.reset(); $rootScope.profiler = Profiler; }); }) .config(function ($httpProvider){ $httpProvider.interceptors.push('profilerInterceptor'); }) .factory('profilerInterceptor', function ($q, Profiler) { return { request: function (request) { if (Profiler.startTime == null) { Profiler.startTime = new Date(); } return request; }, response: function (response) { Profiler.refresh(); return response; } }; }) .service('Profiler', function () { return { startTime: null, endTime: null, time: 0, reset: function () { this.startTime = null; }, refresh: function () { this.endTime = new Date(); this.time = (this.endTime - this.startTime) / 1000; } }; });

Note: Any request will increase the load time, code as below can't know when to stop monitor.

I did some research and found this http://www.bennadel.com/blog/2777-monitoring-http-activity-with-http-interceptors-in-angularjs.htm

And I use the interceptor to create my own profiler:

<!--some html--> <div>{{profiler.time}}</div>

angular.module('app') .run(function ($rootScope){ $rootScope.$on('$stateChangeStart', function (event) { Profiler.reset(); $rootScope.profiler = Profiler; }); }) .config(function ($httpProvider){ $httpProvider.interceptors.push('profilerInterceptor'); }) .factory('profilerInterceptor', function ($q, Profiler) { return { request: function (request) { if (Profiler.startTime == null) { Profiler.startTime = new Date(); } return request; }, response: function (response) { Profiler.refresh(); return response; } }; }) .service('Profiler', function () { return { startTime: null, endTime: null, time: 0, reset: function () { this.startTime = null; }, refresh: function () { this.endTime = new Date(); this.time = (this.endTime - this.startTime) / 1000; } }; });