角度材料 - 扁平树和嵌套树之间的差异

Question

平树:

在平面树中,层次结构是扁平的; 节点不会在彼此内部呈现,而是按顺序呈现为兄弟节点

嵌套树:

在嵌套树中,子节点放在DOM中的父节点内.父节点有一个插座,用于保留所有子节点.

我有一个800元素的命名法,我用平面树显示.
我首先尝试使用嵌套树,因为它看起来像是最合适的树.它需要眨眼才能构建它,但是DOM需要5秒才能加载树,所以我尝试了扁平的树,它现在完美地工作了.

问题是,如果扁平树的结果相同,那么使用嵌套树有什么意义呢？树正确呈现,DOM理解其层次结构.

平树的DOM:

嵌套树更难构建,并且每次显示时都会明显重载DOM.嵌套树可以做什么,平树不能做什么？材料文档不清楚.

Answer 1

无论 HTML 是通过 Angular 动态呈现还是简单的平面文件呈现，嵌套树都有一些明确的主要好处。

• 您可以利用事件冒泡，这可以大大减少为捕获用户与 DOM 的交互而需要编写的代码量。此外，当您需要捕获多个事件时，嵌套也可以使这变得更容易。
• 通过将样式应用到将由子元素继承的父节点，您可以更好地控制格式。
• 使用 LESS 或 Sass 等 CSS 预处理器时，嵌套树有很大的好处。大大减少了需要编写的样式数量。
• 虽然渲染两个树之间的性能可能相同，但当您必须考虑连接速度慢或移动服务差的用户时，经验法则是 DOM 元素越少越好。