参考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. [https][tls] 如何使用wireshark查看tls/https加密消息--使用keylog

    姊妹篇: [ipsec][strongswan] 使用wireshark查看strongswan ipsec esp ikev1 ikev2的加密内容 [https][tls] 如何使用wiresha ...

  2. 17.centos7基础学习与积累-003-命令练习01

    1.从头开始积累centos7系统运用 大牛博客:https://blog.51cto.com/yangrong/p5 linux命令的学习: 创建目录:mkdir mkdir /data mkdir ...

  3. 《The One!团队》第八次作业:ALPHA冲刺(三)

    项目 内容 作业所属课程 所属课程 作业要求 作业要求 团队名称 < The One !> 作业学习目标 (1)掌握软件测试基础技术.(2)学习迭代式增量软件开发过程(Scrum) 第三天 ...

  4. 神经网络MNIST数据集分类tensorboard

    今天分享同样数据集的CNN处理方式,同时加上tensorboard,可以看到清晰的结构图,迭代1000次acc收敛到0.992 先放代码,注释比较详细,变量名字看单词就能知道啥意思 import te ...

  5. Excel技巧大全

    1.一列数据同时除以10000 复制10000所在单元格,选取数据区域 - 选择粘性粘贴 - 除 2.同时冻结第1行和第1列 选取第一列和第一行交汇处的墙角位置B2,窗口 - 冻结窗格 3.快速把公式 ...

  6. 第142题:环形链表II

    一. 问题描述 给定一个链表,返回链表开始入环的第一个节点. 如果链表无环,则返回 null. 为了表示给定链表中的环,我们使用整数 pos 来表示链表尾连接到链表中的位置(索引从 0 开始). 如果 ...

  7. HDU - 3709 - Balanced Number(数位DP)

    链接: https://vjudge.net/problem/HDU-3709 题意: A balanced number is a non-negative integer that can be ...

  8. 当服务全部宕机时候的处理方法,md

    ![](https://xiahualou.oss-cn-shanghai.aliyuncs.com/img/20191219143156.png)   来自为知笔记(Wiz)

  9. Mysql 根据时间取出每组数据中最新的一条

    下策——查询出结果后将时间排序后取第一条 select * from a where create_time<="2017-03-29 19:30:36"order by c ...

  10. learning java swing 基本组件用法

    import javax.swing.*; import java.awt.*; import java.awt.event.ActionListener; import java.awt.event ...