导入Handlebar模板和获取它们之间的区别? [英] Difference between importing Handlebar templates and fetching them?

问题描述

我已经看到人们使用获取请求来获取.hbs文件，这些文件已经在服务器内部，并且可以使用导入语法简单地导入.为什么会这样呢?从服务器内部获取文件是否有意义?简单地 export const studentTemplate ="*模板*" 会更好吗?难道不是允许简单地导出已编译函数而不是模板本身吗?导入会以某种方式变慢吗(据我所知，它们不应该作为获取请求来处理网络)?

I've seen people use fetch requests to get .hbs files that are already inside the server and could simply be imported using the import syntax. Why would that be? Is there a point to fetching files from inside the server? Wouldn't it be better to simply export const studentTemplate = "*the template*"? And wouldn't that allow for the simple export of the compiled function instead of the template itself? Are imports somehow slower (as far as I know, they shouldn't be as fetch requests deal with the network)?

例如而不是进行所有这些活动-从服务器内部获取文件，注册所有必要的部分，然后编译要使用的功能-在必须输出HTML的文件内部，最好不要使用单独的文件-导入车把模板而不是获取它，注册所需的部分，编译函数并仅导出函数-然后只是导入已编译的函数?

E.g. instead of doing all theses activities - fetching the file from inside the server, registering all the partials necessary and then compiling the function to use - inside the file which has to output the HTML, wouldn't it be better to have a separate file which - imports the handlebars template instead of fetching it, registers the partials needed, compiles the function and only exports the function - and then just import the compiled function?

推荐答案

执行此操作的唯一原因是减少初始页面加载时间(通过减小HTML/JS请求的大小).模板可以是:

The only reason to do this is to decrease initial page load time (by decreasing the size of a HTML/JS request). The templates can then either be:

• 当用户执行需要呈现该模板的操作时按需加载，但这可能会导致一些延迟(需要微调器)
• 或按照可能呈现模板的顺序逐一预加载，但这可能会导致不必要的数据获取(也将是静态导入).

最佳解决方案是在构建过程中对模板进行预编译，并将其作为动态导入(包含在webpack的更高版本中)包含在JS软件包中，或使用AMD样式该解决方案消除了所有开销的网络和编译延迟，不必要的数据提取，并且维护起来最容易.

The best solution would be to precompile the templates as part of the build process, and include them in a JS bundle as dynamic imports (which the later versions of webpack support) or using AMD-style requires.This solution eliminates all overhead network and compilation latency, unnecessary data fetching and is most maintainable.

注意:正如其他答案所断言的那样，它与防止阻止javascript执行"无关.您也可以直接将模板直接嵌入HTML中的 template 或< script type ="text/template"> 标记中，并推迟对其的解析/编译内容，但这会增加初始请求的加载时间.

Note: it has nothing to do, as the other answer asserts, with preventing "blocking javascript execution". You could just as well embed the templates directly in the HTML in template or <script type="text/template"> tags and defer parsing/ compilation of their contents, but that would increase the load time of the initial request.

这篇关于导入Handlebar模板和获取它们之间的区别?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！