Angularjs 自定义模板/指令如何影响加载时间？

我刚刚通过codeschool学会了如何使用angular创建自定义指令，这真是太棒了！它教给我的方法是在我的JS文件中生成一个指令，将它链接到一个html文件，然后在index.html文件（我的主文件）中相应地编写标记

---

我的问题是，为自定义指令创建一个全新的html文件是否会影响主页上的加载时间？如果您想引用我所在的部分，它将使用angular level 4（自定义指令）进行调整。

这取决于您是否将模板直接预编译到main.js中

如果预编译它们，则main.js的加载时间会更长，但在渲染视图时，angular不需要发送http请求来获取模板，因此渲染速度会更快

如果不预编译它们，前期加载时间会更快，但第一次呈现视图可能会更慢，因为angular需要发送http请求才能第一次获取模板。第一次加载后，它将缓存在模板缓存中

您还可以使用混合解决方案，预编译应用程序主条目所需的内容，并允许angular根据需要请求其余内容

---

哪个更好是一个不适合stackoverflow的争论。

它会对加载时间产生积极和消极的影响，这取决于您在代码库中如何包含模板。（您可以预编译它并将其包含在js中，或者让angular发送http请求来检索它）哪种方式更好？我最近安装了Grunt，虽然我不知道它能做什么，但我相信它能将您的所有代码编译成一个文件（css和js）。最好是有一个巨大的JS文件（包括所有angular bootstrap预先编写的东西，我会清除没有使用的东西），还是让angular发出请求并在另一个文件中检索它更好？这取决于具体情况。如果预编译它们并将其包含在JS中，则前期加载时间会更长，但加载后渲染速度会更快。如果不提前加载，加载时间会更快，但第一次渲染可能需要更长的时间。第三种选择是延迟加载到

$templateCache

中。最好的方法取决于应用程序的大小和应用程序的使用情况。明白了，并没有意识到有这么多的因素（这里是新手开发人员）。我最不想做的事就是开始一场辩论，但不管怎样，我感谢大家的意见，谢谢！归根结底，主要的一点是有很多选择，你必须根据你的应用程序结构和需求权衡它们之间的差异。