代码之家 › 专栏 › 技术社区 › Matthias S

许多Vue的性能影响。js组件

vuejs2 vue.js performance javascript

Matthias S · 技术社区 · 7 年前

我们将Laravel与Vue结合使用。但是在去年,代码变得有点混乱。我们现在开始重新编写其中的大部分内容,并正在讨论如何最好地进行。

我们没有使用水疗中心,所以路线是在拉维尔定义的。由于有一些复制/粘贴,我们现在想在Vue中编写所有内容。js模块,并将所有模块放在一个js文件中。它现在起作用了,因为到目前为止,我们只有大约10个组件,但考虑到整个重写过程,我们可能最终会有100个或更多组件。

问题是: 例如,如果一个JS文件中包含100个组件,则Vue不会。js需要执行所有这些组件的代码,即使该页面只使用了其中的10个,还是只执行了实际使用的组件的代码?

如果从性能角度来看,这是一个糟糕的选择,那么除了将每个组件都放在一个大文件中(同时仍保持Laravel路由)之外,还有其他选择吗?

提前感谢:-)

1 回复 | 直到 7 年前

Daniel 7 年前

在同一个文件中包含100个或10个组件本身没有性能差异。

不同之处在于,您请求用户的浏览器加载100个组件,而不是10个。

如果使用SPA,代码拆分文件效果很好,但如果想在页面中使用Vue,显然并不理想。

但是,您可以做的是将所有组件作为一个文件加载,跨多个页面使用它们的vue实例引用它们。这样,当你从一页转到另一页时,你就不需要用户加载新的集合。

如果您想要获得实际的性能改进,可以尽可能地优化渲染,因为在那里您会发现最显著的收益。一种方法是将组件转换为功能组件,如果有很多组件频繁重新渲染,这可能会产生影响,但情况似乎并非如此。

推荐文章

Sweepy Dodo · JSON lite的格式化

4 月前

Merlin Nestler · 为什么索引中的列顺序在这种情况下会产生如此大的影响?

5 月前

giantjenga · 优化整数向量到二进制向量的转换

6 月前

Adriaantje · Powershell版本的cut-d在处理大文件时速度很慢,我是否错过了快速的方法?

6 月前

Costinean Sebastian · 如何优化使用for循环处理大型数组的MATLAB脚本的执行时间?"

6 月前

Zegarek · Postgresql递归查询未提供预期结果

6 月前

Joe · 为什么这两个查询之间的性能存在如此大的差异?

9 月前

tic-toc-choc · 在`dplyr中高效使用列表进行过滤`

10 月前

Mohan · 是否有一种更快的方法来编写代码,从1:N中提取许多随机样本?

10 月前

user2980746 · 在C#字典中键入xyz对的最有效方法是什么?

10 月前