JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.3/angular.min.js"></script>
<div ng-app="test" ng-controller="ctrl">
Change element with num: <input ng-model="changingIdx">
<button ng-click="go()">Set new timestamp</button><br>
<span ng-show="time">Reaction time: {{time}}</span>
<div style="overflow: auto; height: 412px;">
<ul>
<li ng-repeat="i in items">
<a ng-href="#{{i._id}}:{{i.trmtimestamp}}">{{i.trmtimestamp | date:'hh:mm:ss.sss'}}</a>
</li>
</ul>
</div><br>
<div>Events count: {{items.length}}</div>
</div>
JavaScript
angular.module('test', [])
.service('obj', function(){
this.gen = function(){
return {
_id: "51447fdee00" + new Date().getTime(),
date: new Date().setUTCHours(0,0,0,0),
sections: [
{
caption: "Foo",
address: 393220,
counters: [2, 2]
}, {
caption: "Bar",
address: 15842696,
errors: {
main: ["ERR_BADFRAME", "ERR_AB_OFF"],
dupl: ["ERR_BADFRAME", "ERR_AB_OFF"]
}
}, {
caption: "Baz",
address: 245,
warnings: {
dupl: ["DEV_SHIELD_A"]
}
}
],
srvtimestamp: new Date().getTime() + 100,
trmbias: -18000000,
trmtimestamp: new Date().getTime(),
witherror: true,
withwarning: true
}
};
})
.controller('ctrl', function($scope, $timeout, obj) {
$scope.changingIdx = 0;
$scope.items = [];
for (var i=0; i<2000; i++) {
$scope.items.push(obj.gen());
}
$scope.go = function() {
var now = (new Date()).getTime();
$scope.items[parseInt($scope.changingIdx)].trmtimestamp = new Date().getTime();
$timeout(function() {
$scope.time = ((new Date()).getTime() - now) + ' ms';
}, 0);
}
})