q3aql/webui-aria2
q3aql/webui-aria2
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Improve ngWatch time significantly

Browse Source 
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
1 changed files with 27 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
js/ctrls/download.js
View File

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