参考API:

http://miniui.com/docs/api/index.html#ui=datagrid

http://miniui.com/docs/api/index.html#ui=treegrid

Mini所有节点配置数据方式(集合数组——没有构造成树的数据结构):

1.1. MiniUI测试树结构全部加载效率测试-8s左右

1.2. MiniUI测试树结构全部加载仅展开根节点-150ms左右

1.2.3实现HTML示例代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>TreeGrid 树形表格</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" /><link href="../demo.css" rel="stylesheet" type="text/css" /> <script src="../../scripts/boot.js" type="text/javascript"></script> </head>
<body>
<h1>TreeGrid 巡护员树测试</h1>
<input type="button" value="测试" onclick="reload()"/>
<div id="treegrid1" class="mini-treegrid" style="width:100%;height:580px;"
url="../data/xht_tree.json" showTreeIcon="false"
treeColumn="taskname" idField="id" parentField="parentId" resultAsTree="false"
allowResize="true" expandOnLoad="false"
>
<div property="columns">
<div type="indexcolumn"></div>
<div name="taskname" field="name" width="160" >巡护员</div>
<div field="value" width="80">操作</div>
</div>
</div>
<script type="text/javascript">
function reload(){
mini.parse(); var treegrid = mini.get("treegrid1");
treegrid.url="../data/xht_tree.json?res="+Math.random();
var start=new Date().getTime();
console.info("reload....");
treegrid.loading();
treegrid.load();
var node=treegrid.getRow(0);
treegrid.expandNode(node);
treegrid.unmask();
var end=new Date().getTime();
console.info("completed time:"+(end-start)+"ms");
} </script> </body>
</html>

异步加载方式参考:http://www.blogjava.net/grid/archive/2012/12/13/392948.html

MiniUI treeGrid 树节点展开和不展开的性能差别很大的更多相关文章

  1. 展开easyui 树节点到某个点

    $(function () { $('#tt').tree({ url: '/IS/Department/JsonTree?companyID=@(Request.QueryString[" ...

  2. 【zTree】zTree展开树节点

    今天在做zTree树的时候想着将第一级tree展开,于是利用下面方法: /** * 展开树节点的第一层 */ function openFirstTreenode(){ // 获取树对象 var tr ...

  3. ElementUI如何展开指定Tree树节点

    原文:https://blog.csdn.net/gaojie_csdn/article/details/80738488 [问题] 在页面使用ElementUI的时候,想做出一个主动展开树节点的效果 ...

  4. ExtJS6 TreePanel树节点合上展开显示不同图标

    TreePanel的节点如包含子节点,可在展开/合上时显示不同的图标,增强客户端效果,提高用户体验.非常简单,使用TreePanel的两个事件:beforeitemexpand和beforeitemc ...

  5. extjs4.0 treepanel节点的选中、展开! 数据的重新加载

    1.extjs4.0API较3.0有非常大变化2.多级子父节点的选中和展开.3.数据的重新加载.tree.getStore().load4.节点的移除,从树中根据ID获取节点 tree.getStor ...

  6. 康拓展开 & 逆康拓展开 知识总结(树状数组优化)

    康拓展开 : 康拓展开,难道他是要飞翔吗?哈哈,当然不是了,康拓具体是哪位大叔,我也不清楚,重要的是 我们需要用到它后面的展开,提到展开,与数学相关的,肯定是一个式子或者一个数进行分解,即 展开. 到 ...

  7. ext 树节点操作

    ext 树节点操作 tree :树    node:节点 1.全部展开 tree.expandAll(); 2.全部收缩 tree.collapseAll(); 3.得到父节点 node.parent ...

  8. ExtJs 4.2 treePanel 点击树节点 传送参数到后台(多个参数)

    //***********************************************左边树开始********************************************** ...

  9. Extjs 树节点操作常用属性

    tree: 树     node:节点 1.全部展开  tree.expandAll(); 2.全部收缩  tree.collapseAll(); 3.得到父节点 node.parentNode 4. ...

随机推荐

  1. 快速入门 Python 数据分析实用指南

    Python 现如今已成为数据分析和数据科学使用上的标准语言和标准平台之一.那么作为一个新手小白,该如何快速入门 Python 数据分析呢? 下面根据数据分析的一般工作流程,梳理了相关知识技能以及学习 ...

  2. Centos7.4(阿里云环境)挂载数据盘

    Centos7.4(阿里云环境)挂载数据盘 2018.08.29 10:19 947浏览 查看数据盘 disk -l 磁盘 /dev/vda:42.9 GB, 42949672960 字节,83886 ...

  3. 采用MySQL-MMM做DB高可用时,遇到的一个小坑

    一.服务器分布   二.MySQL-MMM 配置 (1).公共配置[所有DB节点:Master1.Master2.Slave1.Slave2   Monitor节点] # vim /etc/mysql ...

  4. idou老师教你学istio 31:Istio-proxy的report流程

    Istio-proxy的report主要是将envoy采集到的连接attributes的信息上报给控制面的mixer,它的入口在request_handler_impl.cc文件中,这里需要打开ena ...

  5. Redis面试基本问题

    Redis有哪些数据结构? 字符串String.字典Hash.列表List.集合Set.有序集合SortedSet.如果你是Redis中高级用户,还需要加上下面几种数据结构HyperLogLog.Ge ...

  6. 使用笔记:TF辅助工具--tensorflow slim(TF-Slim)

    如果抛开Keras,TensorLayer,tfLearn,tensroflow 能否写出简介的代码? 可以!slim这个模块是在16年新推出的,其主要目的是来做所谓的“代码瘦身” 一.简介 slim ...

  7. Java方法注意事项

    使用方法的注意事项: 1.方法应该定义在类中,方法中不能再定义方法,也就是不能嵌套定义,但方法可以中可以调用方法 2.方法定义的前后顺序无所谓,执行的先后顺序只与调用有关 3.方法定义之后不会执行,如 ...

  8. 学习Spring-Data-Jpa(五)---可嵌入对象和元素集合的使用

    1.场景一:地址信息(省.市.县.详细地址)在很多实体中都需要,比如说作者有地址,订单也有地址,但是他们的地址并不能独立与他们存在,所以地址不能映射为实体,那么我们就需要在作者实体和订单实体中都添加这 ...

  9. http健康状态检查

    来自为知笔记(Wiz)

  10. go协程的特点

    go奉行通过通信来共享内存,不像c和c++通过共享内存来通信 协程是轻量级的线程,编译器做优化** 有独立的栈空间 共享程序堆空间 调度由用户控制 协程是轻量级的线程 并行:多个cpu共同执行 并发 ...