聚合物1.0 dom-if vs hidden

从 https://www.polymer-project.org/1.0/docs/api/dom-if起

When if becomes falsey,the stamped content is hidden but not removed from dom. When if subsequently becomes truthy again,the content is simply re-shown. This approach is used due to its favorable performance characteristics: the expense of creating template content is paid only once and lazily.

我认为这是隐藏属性的行为,因此隐藏的比dom便宜 – 如果模板不会被隐藏的重新放大.因为’没有restamp’是默认行为dom-if,dom-if和hidden之间的区别是什么以及如何更好地隐藏性能？聚合物最佳实践指出隐藏的更便宜.

解决方法

我对它的理解是dom-if在表达变得真实之前不会加盖,但是在这样做之后它的表现就像[隐藏]那样.就这样,dom-if是一种悲观的[隐藏],它会尽可能地延迟冲压.

这种延迟加载方法在某些情况下是有利的,其中标记模板将是非常耗费资源的.例如,如果模板非常大,需要初始化多个自定义组件.如果您刚刚使用了隐藏属性,那么您只需支付创建所有DOM的性能成本,直到稍后才能看到它.

对于简单的情况,例如隐藏或显示一些文本,div或两个等,隐藏属性可能更快,因为创建这些元素然后隐藏它们的成本可能小于创建< template>.用于保存代码的实例,polymer设置监听器以监控表达式的真实性,然后,当它变得真实时,用于标记模板的所有开销,解析它以用于绑定表达式等.对于浏览器来说,尤其如此.模板>支持是polyfilled.

仔细考虑你的情况(并且理想地测试它)是最好的选择.通常情况下,这些差异可以忽略不计,但如果您的代码中的这部分恰好与大量项目或经常发生的任何事情发生重复,则需要特别小心.差异可能会加起来.

原文地址：https://www.jb51.cc/html/226069.html