XTemplate unexpected recursive rendering

[Jacob]

This is not an effective bug (because there's an easy workaround) but I decided to add this post anyway to share my experience on this very particular behaviour of XTemplates.

When your template contains "openning-closing tags" like "<div/>", you may obtain a recursive kinf of rendering that lead FireFox to crash when too many dataItems are to be processed.

Examples
The following template :


var lexiconTemplate=new Ext.XTemplate(
'<tpl for=".">',
'<div class="smartLexiconsRow">',
'<tpl if="backLink==true">',
'<a href="#" onclick="navigate(\'{id}\')">',
'<div class="iconContainer backLink"/>',
'</a>',
'</tpl>',
'<tpl if="backLink!=true">',
'<a href="javascript:alert(1)">',
'<div class="iconContainer lexiconLaunchLink"/>',
'</a>',
'<div class="lexiconLink">',
'<tpl if="leaf==false">',
'<a href="#" onclick="navigate(\'{id}\')">',
'{text}',
'</a>',
'</tpl>',
'<tpl if="leaf==true">',
'{text}',
'</tpl>',
'</div>',
'</tpl>',
'</div>',
'</tpl>'
);
will produce the following rendering :
[code]
<DIV id="lexiconsTargetDiv" name="lexiconsTargetDiv">
<DIV id="ext-gen7" style="WIDTH: auto; HEIGHT: auto">
<DIV class="smartLexiconsRow" _nodup="30806" viewIndex="0">
<A onclick="navigate('LEXICON_00000008')" href="medias.aspx?INSTANCE=EXPLOITATION">
<DIV class="iconContainer backLink"></DIV>
</A>
<DIV class="smartLexiconsRow" _nodup="30806" viewIndex="1">
<A href="javascript:alert(1)">
<DIV class="iconContainer lexiconLaunchLink">
<DIV class="lexiconLink">Administrations publiques</DIV>
</DIV>
</A>
<DIV class="lexiconLink">Administrations publiques</DIV>
<DIV class="smartLexiconsRow" _nodup="30806" viewIndex="2">
<A href="javascript:alert(1)">
<DIV class="iconContainer lexiconLaunchLink">
<DIV class="lexiconLink">Agronomie</DIV>
</DIV>
</A>
<DIV class="lexiconLink">Agronomie</DIV>
<DIV class="smartLexiconsRow" _nodup="30806" viewIndex="3">
<A href="javascript:alert(1)">
<DIV class="iconContainer lexiconLaunchLink">
<DIV class="lexiconLink">Arch