Dynatree addChild - 组件作者的问题

发布于 2024-09-07 00:11:06 字数 564 浏览 10 评论 0原文

http://wwwendt.de/tech/dynatree/index.html

我想要澄清以下事项: 当调用 addChild 时 - 是否重新渲染整个树或仅修改节点(添加的节点和具有新子节点的节点)?

我收到两条相互矛盾的信息: dynatree 中的延迟加载 它表示只有受影响的节点才会重新渲染

Dynatree 速度慢时动态加载 100 多个节点 在这里它说每次使用 addChild 时它都会重新渲染

也许,我错过了一些东西?

是哪一个?

http://wwwendt.de/tech/dynatree/index.html

I would like to clarify the following:
when addChild is invoked - does the whole tree gets re-rendered or just the nodes modified (added nodes and the nodes that have new children)?

I am getting 2 conflicting pieces of info:
Lazy Loading in dynatree
it says that only affected nodes will get re-rendered

Dynatree slow when dynamically loaded with 100+ nodes
here it says that it does get re-rendered every time addChild is used

Perhaps, I am missing something?

Which one is it?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

游魂 2024-09-14 00:11:06

Dynatree 将节点存储在内部结构中。
“渲染”是创建或更新 HTML 元素的过程
DOM 到
反映树的状态。
例如分支中的最后一个节点有一个特殊的类名,所以
附加一个
节点需要从之前的“最后一个节点”中删除此类,并且
将其添加到
新的。

每次调用 .addChild(data) 都会触发渲染。
如果一次调用传递 100 个节点,则渲染仅完成一次,
所以
这总是比用一个调用它 100 次更高效
单节点。

目前(版本 0.5.4)addChild 使用此模式:

var prevFlag = tree.enableUpdate(false);
[modify the tree]
tree.enableUpdate(prevFlag);

enableUpdate(true) 调用 tree.redraw(),因此更新整个树。
这将
随着版本 1.0 的变化,但即使如此,组合起来也会更快
添加子项
来电。

另一个方面是:何时在 DOM 中创建节点。
从 1.0 开始,HTML 元素的创建被推迟到节点
变成
第一次可见(展开)。
因此可以将大量的节点加载到高效的
内部 Dynatree 数据结构,不会导致 DOM 膨胀。

如果预加载整个树或延迟加载对用户更友好
单身的
按需分支取决于服务器、网络和客户端。所以这是
总是
对不同场景进行基准测试的问题。

Dynatree stores the nodes in an internal structure.
'Rendering' is the process of creating or updating HTML elements in
the DOM to
reflect the tree's status.
For example the last node in a branch has a special class name, so
appending a
node requires removing this class from the previous 'last node' and
adding it to
the new one.

Every time you call .addChild(data), the rendering is triggered.
If you pass 100 nodes with one call, the rendering is done only once,
so
this is always more performant than calling it 100 times with one
single node.

Currently (release 0.5.4) addChild uses this pattern:

var prevFlag = tree.enableUpdate(false);
[modify the tree]
tree.enableUpdate(prevFlag);

enableUpdate(true) calls tree.redraw(), so the whole tree is updated.
This will
change with release 1.0, but even then it will be faster to combine
addChild
calls.

Another aspect is: when are nodes created in the DOM.
Starting with 1.0 creation of HTML elements is deferred until the node
becomes
visible (expanded) for the first time.
So it is possible to load a very large number of nodes into the efficient
internal Dynatree data strucure without bloating the DOM.

If it is more user friendly to pre-load the whole tree, or lazy-load
single
branches on demand depends on server, network and client. So it's
always
a matter of benchmarking the different scenarios.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文