-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy path03-zone-instrumentation.html
69 lines (56 loc) · 2.32 KB
/
03-zone-instrumentation.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>AngularJS Zone Instrumentation Example</title>
<script src="angular.js"></script>
<script src="zone.js"></script>
<script type="text/javascript">
'use strict';
(function (app, z) {
z.customZone = (function () {
var timer = performance ? performance.now.bind(performance) : Date.now.bind(Date),
showTime = function (time) {
return Math.floor(time * 100) / 100 + 'ms';
};
return {
asynchronousCount: 0,
startTime: timer(),
taskStart: [],
beforeTask: function () {
this.taskStart = timer();
this.asynchronousCount += 1;
},
afterTask: function () {
var totalTime = timer() - this.startTime,
taskTime = timer() - this.taskStart;
console.log(this.asynchronousCount + ' total Tasks run.');
console.log('Total running time: ' + showTime(totalTime));
console.log('Last task time: ' + showTime(taskTime));
}
};
})();
zone.fork(Zone.customZone).run(function (){
app.run(['$rootScope', '$timeout', function ($rootScope, $timeout) {
var incrementCount = function () {
$rootScope.count += 1;
$timeout(incrementCount, 1000);
};
$rootScope.count = 0;
$timeout(incrementCount, 1000);
}]);
setTimeout(function () {
angular.bootstrap(document, ['angularApp'])
}, 1);
});
})(angular.module('angularApp', []), Zone);
</script>
</head>
<body>
<h1>Angular Debugging and Performance</h1>
<h2>Instrumentation with Zone</h2>
<p>Example of instrumentation with Zone. Note the Angular app is completely disconnected from the Zone, then view the
console to see that the Zone is intercepting asynchronous requests to measure them.</p>
<p>Count: {{count}}</p>
</body>
</html>