Improve ngWatch time significantly

Angular uses dirty-checking for data-bindings. This is OK for POD types,
but when it comes to objects, incl. arrays, just stuffing in the new
array without checking for changed content will make angular think
something has changed and update the DOM when there really was no change
at all. So do not blindly copy over objects and arrays anymore.

Also, since webui-aria2 does not use all `bittorrent` and `file` fields,
there is no point in keeping all fields around, causing unnecessary
angular invalidations.

With this commit, the update code runs in about 1/10th of the time it
did before on my system (Chrome/Firefox) when using displaying many
torrent downloads with many files.
This commit is contained in:
Nils Maier 2014-01-11 10:36:17 +01:00
parent 9297fcac35
commit 71d66758e0

View File

@ -182,14 +182,33 @@ function(
_.each([
'totalLength', 'completedLength', 'uploadLength', 'dir',
'pieceLength', 'downloadSpeed', 'uploadSpeed', 'files',
'status', 'gid', 'bitfield', 'numPieces', 'connections',
'bittorrent'
'pieceLength', 'downloadSpeed', 'uploadSpeed', 'status',
'gid', 'numPieces', 'connections', 'bitfield'
], function(e) {
if (ctx[e] != d[e])
ctx[e] = d[e];
});
var files = d["files"];
if (files) {
var cfiles = ctx["files"] || (ctx["files"] = []);
for (var i = 0; i < files.length; ++i) {
var file = cfiles[i] || (cfiles[i] = {});
file.path = files[i].path;
file.length = files[i].length;
}
cfiles.length = files.length;
}
else {
delete ctx["files"];
}
if (d.bittorrent) {
ctx.bittorrentName = d.bittorrent.info && d.bittorrent.info.name;
}
else {
delete ctx.bittorrentName;
}
// collapse the download details initially
if (ctx.collapsed === undefined)
ctx.collapsed = true;
@ -224,7 +243,7 @@ function(
// gets the progress in percentages
scope.getProgress = function(d) {
var percentage = (d.completedLength / d.totalLength)*100;
var percentage = (d.completedLength / d.totalLength)*100 || 0;
percentage = percentage.toFixed(2);
if(!percentage) percentage = 0;
@ -233,8 +252,8 @@ function(
// gets a pretty name for the download
scope.getName = function(d) {
if (d.bittorrent && d.bittorrent.info) {
return d.bittorrent.info.name;
if (d.bittorrentName) {
return d.bittorrentName;
}
return utils.getFileName(