[jQuery] jtemplates performance
I am using jTemplates (jquery-jtemplates.js) to render a large xml
response by running xmlToJSON then processTemplate. Although the code
works fine, and performance in FF2.0 is acceptable (2672ms) on my test
system, I am getting a result of 9827ms when running in IE7. Is there
a known performance issue with jtemplates ? Are other templte modules
better ?
(p.s. the real world code uses jQuery Form plugin and web services,
but the sample below reproduces the issue)
Code, and template follow.
Template:
<table>
<thead><tr><th>Job#</th><th>Name</th><th>Client</th></tr></thead>
<tbody class="resultbody">
{#foreach $T.Job as row}
<tr>
<td>{$T.row.jobnum[0].Text}</td>
<td>{$T.row.jobname[0].Text}</td>
<td>{$T.row.clientid[0].Text}</td>
</tr>
{#/for}
</tbody>
</table>
Code:
...
<head>
<title>Simple XML Load Test</title>
<script type="text/javascript" src="js/jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="js/jquery-jtemplates.js"></
script>
<script type="text/javascript" src="js/jqXMLUtils.js"></script>
<script type="text/javascript">
var t1;
var t2;
function Response(responseXML, statusText) {
//Render it using the templates
$('#output2').setTemplateURL('templates/showjob.htm');
var ct1=new Date();
t1=ct1.getTime();
ret = $.xmlToJSON(responseXML);
$('#output2').processTemplate(ret);
var ct2=new Date();
t2=ct2.getTime();
alert(t2-t1);
}
$(document).ready(function(){
$('#output2').empty();
$.ajax({ success:Response, dataType: 'xml',url: 'sample.xml' });
});
</script>
</head>
<body>
<div id="output2">
</div>
</body>
...
sample.xml: 450 job nodes...
<Jobs>
<Job>
<jid>1118</jid>
<jobnum>C0001 01</jobnum>
<jobname>06-Feb</jobname>
<jobnotes>
</jobnotes>
<clientid>HAR001</clientid>
<sid>6</sid>
<atid>0</atid>
<deadline>1900-01-01T00:00:00</deadline>
<espressoNotes>
</espressoNotes>
<probability>0</probability>
</Job>
<Job>
<jid>1119</jid>
<jobnum>C0001 02</jobnum>
<jobname>06-Mar</jobname>
<jobnotes>
</jobnotes>
<clientid>HAR001</clientid>
<sid>6</sid>
<atid>0</atid>
<deadline>1900-01-01T00:00:00</deadline>
<espressoNotes>
</espressoNotes>
<probability>0</probability>
</Job>
...
...
</Jobs>