在 Meteor 中延迟加载有什么用？

Question

我有以下应用程序结构：

client/
---- main.js
imports/
---- startup/
-------- client/
------------ routes.js
---- ui/
-------- login/
------------ login.html
------------ login.js
-------- register/
------------ register.html
------------ register.js

文件内容如下：

client/main.js

import "/imports/startup/client/routes.js";

imports/startup/client/routes.js

import "../../ui/login/login.js";
import "../../ui/register/register.js";
// other routing code

imports/ui/login/login.js

import "./login.html";
// other login code

imports/ui/register/register.js

import "./register.html";
// other register code

当我运行我的流星应用程序检查 app.js 在 Chrome DevTools 的源代码中加载的 JS 文件时，我发现登录和注册模板都已加载。我明白为什么会这样。

我不明白的是在这种情况下延迟加载的意义。我的所有模板和 HTML 都以与预先加载相同的方式加载。

我的应用程序结构有问题吗？我遵循流星指南中建议的应用程序结构：https://guide.meteor.com/structure.html#example-app-structure

或者我没有正确理解延迟加载？

Answer 1

我知道这是一个老问题，但这是 "meteor lazy load" 的第三高搜索结果，所以我想将此讨论更新为最新。

原题混淆了"lazy loading"和"lazy evaluation"。写题的时候Meteor刚刚实现了"lazy evaluation"而不是延迟加载。目前 Meteor 支持 eager evaluation、lazy evaluation 和 true lazy loading（按需下载资源）。

有关完整讨论，请参阅流星指南中有关 Application Structure 的部分。

热切评价

Meteor 的目标之一一直是非常易于使用和快速上手，因此从一开始它就支持 "eager evaluation" 个源文件：它将自动评估所有 javascript/html/css/coffeescript/jade/react/etc它可以找到的文件。（现在有特殊情况，例如 imports 目录，见下文。）这让初学者可以快速启动应用程序，而无需担心加载顺序或在移动或重命名文件等时更新引用。

懒惰评价

从 Meteor v1.3（2016 年 3 月）开始，您还可以使用 "import" 和 "export" 的标准 ES2015 和 CommonJS 语法明确控制何时评估文件。这就是常规节点应用程序的工作方式，并且有利于维护更大的代码库。

为了仍然支持急切求值，Meteor 通常只会惰性求值 'imports' 目录中的文件。从 Meteor v1.7 开始，您还可以通过为客户端和服务器指定显式入口点来选择对整个应用进行完全惰性评估。有关更多信息，请参阅 Meteor 1.7 announcement post，位于 "custom entry point modules".

下

延迟加载

从 Meteor v1.5（2017 年 5 月）开始，Meteor 现在可以真正延迟加载客户端资产。这使您不仅可以控制何时评估文件，还可以控制何时通过线路将文件内容发送到客户端。

您可以在博客 post 上阅读更多相关信息： https://blog.meteor.com/announcing-meteor-1-5-b82be66571bb

基本要点是您使用 import() 而不是常规 import ... 来按需下载和加载 javascript 文件。这使您可以控制何时将资产发送到客户端，并且非常适合加速您的主要用例，而无需下载管理页面等额外内容。

对于那些想知道如何使用 Blaze 模板执行此操作的人，请让您的 myTemplate.js 文件执行常规 import './myTemplate.html' and/or import './myTemplate.css'。然后使用新的 await import('/imports/client/myTemplate') 语法在需要时将其全部拉下。然后将提取 Blaze 模板并正常使用。

好处：现代浏览器的有效负载更小

从 Meteor v1.7（2018 年 5 月）开始，Meteor 现在将自动为现代 "evergreen" 浏览器（自动更新的浏览器）提供优化的捆绑包。这意味着 babel 等项目通常包含的所有额外的 polyfill 和变通方法，以便让旧浏览器上的现代代码语法运行甚至不会包含在客户端有效负载中！

非常令人兴奋的内容，请在此处阅读更多信息：

https://blog.meteor.com/meteor-1-7-and-the-evergreen-dream-a8c1270b0901

在 Meteor 中延迟加载有什么用？

What is the use of lazy loading in Meteor?

lazy-loading

node.js

meteor

meteor-blaze

flow-router