利用jqxTreeGrid代替jqxTree或其他树结构控件解决数据多加载慢的问题

背景：使用jqwidgets的jqxTree同步加载树结构发现
数据300多条时(后台加载数据很快不到2秒左右的时间)
但是前台界面半天大概1分多(毫不夸张)渲染树结构。
这使软件的可用性大大降低，用户体验度极差，就尝试
使用jqwidgets的jqxTreeGrid代替jqxTree发现这个东西
很好用。

准备工作：
var height = xxPX;
//项目树
var source = {
datatype : "json",
datafields : [
{ name : 'id'},
{ name : 'parentId'},
{ name : 'label'}
],
hierarchy:
{
keyDataField: { name: 'id' },
parentDataField: { name: 'parentId' }
},
id : 'id',
url : rootUrl //这是你后台取数据的地址
};
var dataAdapter = new $.jqx.dataAdapter(source);
var proTplTree = $('#projectTree');
proTplTree.jqxTreeGrid({
showHeader: false,//默认会有表头这里将它去掉
width: '235px',//树结构的宽度
height: height,//树结构的高度
source: dataAdapter,//数据源
selectionMode: 'singleRow',//一次只能选一条记录
ready: function(){
},
columns: [
{ text: 'label', dataField: 'label', width: 700}
]
});

实际效果:

 300多条数据基本上是一瞬间加载出来。

如果大家有什么疑问或是更好的想法，欢迎您一起来和我探讨交流