Smart Rendering in dhtmlxTreeGrid

Smart Rendering functionality allows to increase performance of the TreeGrid, when it has a lot of nodes per level.
First two items in this sample have 500 child nodes.

Select 255th child of the first item
Select 455th child of the first item
Select 200th child of the second item

Source

<link rel="STYLESHEET" type="text/css" href="../../../dhtmlxGrid/codebase/dhtmlxgrid.css">
<link rel="stylesheet" type="text/css" href="../../../dhtmlxGrid/codebase/skins/dhtmlxgrid_dhx_skyblue.css">
<script  src="../../../dhtmlxGrid/codebase/dhtmlxcommon.js"></script>
<script  src="../../../dhtmlxGrid/codebase/dhtmlxgrid.js"></script>
<script  src="../../../dhtmlxGrid/codebase/ext/dhtmlxgrid_srnd.js"></script>
<script  src="../../../dhtmlxGrid/codebase/dhtmlxgridcell.js"></script>
<script  src="../../codebase/dhtmlxtreegrid.js"></script>
 
<script>var mygrid;
function doOnLoad() {
    mygrid = new dhtmlXGridObject('gridbox');
    mygrid.imgURL = "../../../dhtmlxGrid/codebase/imgs/icons_greenfolders/";
    mygrid.setHeader("Column A,Column B,Column C");
    mygrid.setInitWidths("*,100,80");
    mygrid.setColAlign("left,left,left");
    mygrid.setColTypes("tree,ed,txt");
    mygrid.setColSorting("str,str,str");
    mygrid.enableSmartRendering(1);
    mygrid.init();
    mygrid.setSkin("dhx_skyblue");
    mygrid.loadXML("../common/smartrend.xml");
}
function selectAndShow(id) {
    mygrid.selectRowById(id);
    mygrid.openItem(mygrid.getParentId(id));
    mygrid.showRow(id);
}</script>
 
 
<div id="gridbox" width="500px" height="200px"></div>
 <a href="javascript:void(0)" onclick='selectAndShow("r0_255")'>Select 255th child of the first item</a><br/>
 <a href="javascript:void(0)" onclick='selectAndShow("r0_455");'>Select 455th child of the first item</a><br/>
 <a href="javascript:void(0)" onclick='selectAndShow("r1_200");'>Select 200th child of the second item</a><br/>