The patch below is only for purpose of showing the problem and possible solution and it surely requires more work. First part in php code contains also profiling code to show the difference.
In my case it came from above 7 seconds down to 1.2 second.
I'm interested in Your opinions on this.
It's very interesting, on my box I have 50% speed up on Opera 9.27 and 10% on FF3.
I forgot to mention that I was testing it on set of 200 messages (regarding time advantage mentioned in my first post).
One more thing that appeared in the meantime. In patch given I didn't take under consideration adding new messages to the existing list. When initiating off-DOM tbody element, it should be clone of this.list.tBodies[0]. So proper init_off_list function should look like this:
init_off_list: function() { this.off_list = this.list.tBodies[0].cloneNode(true); },
That was actually a bit half-baked idea :/ This way it seems to loose event handlers.
Corrected version of patch uses former method for list updates. Will check twice next time before posting anything. Sorry for making a mess...
diff -ur roundcube/program/include/rcube_json_output.php roundcube_test/program/include/rcube_json_output.php --- roundcube/program/include/rcube_json_output.php 2008-05-19 13:19:16.000000000 +0200 +++ roundcube_test/program/include/rcube_json_output.php 2008-05-20 18:51:50.342518104 +0200 @@ -213,14 +213,18 @@ private function get_js_commands() { $out = '';
- //$out .= "timeslist = new Array();";
- //$out .= "time1 = new Date();\n"; if (sizeof($this->env)) $out .= 'this.set_env('.json_serialize($this->env).");\n";
- //$out .= "time2 = new Date();\ntimeslist[timeslist.length] = (time2 - time1);\n";
- //$out .= "time1 = new Date();\n"; foreach($this->texts as $name => $text) { $out .= sprintf("this.add_label('%s', '%s');\n", $name, JQ($text)); }
- //$out .= "time2 = new Date();\ntimeslist[timeslist.length] = (time2 - time1);\n";
//$out .= "time1 = new Date();\n"; foreach ($this->commands as $i => $args) { $method = array_shift($args); foreach ($args as $i => $arg) {
@@ -232,8 +236,11 @@ preg_replace('/^parent./', '', $method), implode(',', $args) );
}
}- //$out .= "time2 = new Date();\ntimeslist[timeslist.length] = (time2 - time1);\n";
- //$out .= "times = '';\nfor (i=0; i < timeslist.length; i++) times = times+', '+timeslist[i];\nalert(times);\n"; return $out; }
} diff -ur roundcube/program/js/app.js roundcube_test/program/js/app.js --- roundcube/program/js/app.js 2008-05-19 13:19:53.000000000 +0200 +++ roundcube_test/program/js/app.js 2008-05-20 18:05:14.679523480 +0200 @@ -373,7 +373,7 @@ }
// set eventhandler to message icon
- if ((row.icon = row.obj.cells[0].childNodes[0]) && row.icon.nodeName=='IMG')
- if ((row.icon = row.obj.getElementsByTagName('TD')[0].getElementsByTagName('IMG')[0])) { var p = this; row.icon.id = 'msgicn_'+row.uid;
@@ -3227,13 +3227,31 @@ } };
- this.prepare_message_list = function()
- {
- this.message_list.init_off_list();
- };
- this.flush_message_list = function()
- {
- this.message_list.flush_off_list();
- };
- // create a table row in the message list this.add_message_row = function(uid, cols, flags, attachment, attop) { if (!this.gui_objects.messagelist || !this.message_list) return false;
- var tbody = this.gui_objects.messagelist.tBodies[0];
- if (this.message_list.off_list)
- {
- var tbody = this.message_list.off_list;
- }
- else
- {
- var tbody = this.gui_objects.messagelist.tBodies[0];
- }
- var rowcount = tbody.rows.length; var even = rowcount%2;
diff -ur roundcube/program/js/list.js roundcube_test/program/js/list.js --- roundcube/program/js/list.js 2008-05-19 13:19:53.000000000 +0200 +++ roundcube_test/program/js/list.js 2008-05-20 23:34:04.219177552 +0200 @@ -28,6 +28,7 @@ this.DELETE_KEY = 46;
this.list = list ? list : null;
- this.off_list = null this.frame = null; this.rows = []; this.selection = [];
@@ -145,13 +146,30 @@ this.rows[uid] = null; },
+init_off_list: function() +{
- this.off_list = document.createElement('TBODY');
+},
+flush_off_list: function() +{
- this.list.replaceChild(this.off_list, this.list.tBodies[0]);
- this.off_list = null;
+},
/**
*/ insert_row: function(row, attop) {
- var tbody = this.list.tBodies[0];
if (this.off_list)
{
var tbody = this.off_list;
}
else
{
var tbody = this.list.tBodies[0];
}
if (attop && tbody.rows.length) tbody.insertBefore(row, tbody.firstChild);
diff -ur roundcube/program/steps/mail/func.inc roundcube_test/program/steps/mail/func.inc --- roundcube/program/steps/mail/func.inc 2008-05-19 13:19:56.000000000 +0200 +++ roundcube_test/program/steps/mail/func.inc 2008-05-20 23:41:52.483990480 +0200 @@ -296,7 +296,7 @@
// return javascript commands to add rows to the message list -function rcmail_js_message_list($a_headers, $insert_top=FALSE) +function rcmail_js_message_list($a_headers, $insert_top=FALSE, $use_off_list=FALSE) { global $CONFIG, $IMAP, $OUTPUT;
@@ -310,6 +310,9 @@
$OUTPUT->command('set_message_coltypes', $a_show_cols);
- if ($use_off_list)
- $OUTPUT->command('prepare_message_list');
- // loop through message headers foreach ($a_headers as $n => $header) {
@@ -355,6 +358,9 @@ preg_match("/multipart/m/i", $header->ctype), $insert_top); }
- if ($use_off_list)
- $OUTPUT->command('flush_message_list'); }
diff -ur roundcube/program/steps/mail/list.inc roundcube_test/program/steps/mail/list.inc --- roundcube/program/steps/mail/list.inc 2008-05-19 13:19:56.000000000 +0200 +++ roundcube_test/program/steps/mail/list.inc 2008-05-20 23:42:18.867979504 +0200 @@ -55,7 +55,7 @@
// add message rows if (isset($a_headers) && count($a_headers))
- rcmail_js_message_list($a_headers);
- rcmail_js_message_list($a_headers, FALSE, TRUE);
else $OUTPUT->show_message('nomessagesfound', 'notice');
List info: http://lists.roundcube.net/dev/