如何/可以避免每个Web组件发出服务器请求？
因此，有了javascript，很多人现在正在使用所谓的AMD模块加载模型，其中所有模块都是单独的javascript文件，并根据需要包含在内。例如
- main.js
-- module1/mod1.js
-- module2/mod2.js
-- module3/mod3.js
这导致对服务器的多个请求，每个javascript文件一个。这被认为对应用程序性能有害，特别是在移动设备中，因为javascript模块的数量会增加。
结果，诸如require.js之类的工具提供了一个编译器，它将自动跟踪依赖关系并生成包含其中所有模块的单个javascript文件;有效地减少了单个文件的请求开销（通常是app-min.js）。
每个Web组件都位于外部文件岛中，并使用标头中的链接标记导入：
<link rel="import" href="elements/image-gallery.html">
<link rel="import" href="elements/social-media.html">
<link rel="import" href="elements/pinmap.html">
<link rel="import" href="elements/nav-menu.html">
如果您正在使用聚合物，您可以使用硫化工具来组合聚合物组分（http://www.polymer-project.org/articles/concatenating-web-components.html），但那是因为（据我所知）聚合物是一个javascript框架，可以动态地从“聚合物”加载Web组件 - 元素“标签。
对于那些不依赖于框架工作（如x-tag或聚合物）的“vanilla”Web组件，是否有相同的方法？
答案 0 :(得分：11)
Vulcanize工具可以与vanilla Web组件（即HTML导入）以及Polymer框架一起使用。但是它有一些缺点（构建设置和令人讨厌的错误，例如不正确的SVG解析等）。
恕我直言，摆脱多次请求往返问题的最佳选择是使用SPDY (HTTP 2.0)。这允许single physical roundtrip用于所有请求响应，而不需要弄乱你漂亮而干净的代码。它适用于HTML，JavaScript，图像和Web组件。即你可以保持你的HTML和Javascript漂亮和模块化，而不会受到请求地狱的惩罚。这是最通用的方法，提供最清洁，最有效的解决方案。缺点是它需要在现代Web服务器中托管的现代服务器端应用程序。因此，如果您的服务器支持它，这是避免请求地狱的银弹，没有神秘的设置和耗时的模式。
如果这些方法都不适合您的账单，您可以通过手动连接内容来违反所有美观和可管理的内容，并以与使用vanilla Web内容相同的方式优化内容。谈到Web组件时，几乎没有什么神奇之处。实际上，最重要的是HTML文档片段通常保存在单独的文件中（使用HTML导入），但这实际上不是必需的，而是最佳实践。可以在没有Web组件的情况下使用HTML导入，并且可以在不使用HTML导入的情Web组件通常使用文档片段和Javascript，并且可以方便地将它们包装在导入中。为了避免额外的请求，您可以在一个大文件中简单地定义多个片段。您可以通过在单个HTML文件中为每个片段使用template元素来执行此操作，只需将多个脚本合并在一个文件中即可。这基本上是Vulcanize工具所做的，因为它实际上并不试图解释被连接的代码。没必要说这种方法用维护地狱取代了地狱请求。