javascript - Node、Express + Jade 加载脚本一次

Question

我正在使用 Node、Express 和 Jade 渲染网站的 3 个页面。我只是将页面提供为:

router.get('/', function (req, res, next) {
    res.render('home');
});

router.get('/mid', function (req, res, next) {
    res.render('mid');
});

router.get('/final', function (req, res, next) {
    res.render('final');
});

我计划在“/mid”和“/final”页面上使用 jQuery，因此我只是在 mid.jade 和 Final.jade 末尾添加了以下内容:

script(type='text/javascript' src='jquery-min.js')

我的问题:如果用户打开“/mid”然后打开“/final/”，那么用户会下载 jQuery 两次。是否可以设置类似的东西而不需要 jQuery 加载两次？我可以想到多种客户端解决方案，但我很好奇我是否可以做到与当前代码有些相似？

编辑: jQuery 不是一个很好的例子，让我们假设一个场景，在“/mid”和“/final”上我有相同的脚本:

var a = [];

在“/mid”上，我将一些项目插入数组，然后在“/final”上，我想使用这些值，因此重新加载脚本并不好，因为它会清空它。

Answer 1

通用脚本标记 src 文件将简单地由浏览器缓存，因此不会在第二页上重新加载。

将内容嵌入到页面中的自定义脚本标记无法由浏览器独立缓存，因为它嵌入在页面中并且浏览器仅缓存整个文件。

如果您想在两个不同的模板中填充相同的数组，那么您实际上只需将相同的代码连接到两个模板，以便相同的代码在两个模板中填充它们。您无法“保存”一个模板的结果，然后在另一模板中使用该结果。

您可以将您的 javascript 数组放入子模板(或部分或包含或任何 jade 称之为)中，以便在两个页面中使用相同的子模板。然后，您只需在子模板中配置该数组的呈现一次，并且相同的代码将用于两个页面。

请记住，从一个页面到下一个页面，没有 Javascript 状态存在 - 为每个新页面创建一个全新的环境，因此无论您希望给定页面中的 Javascript 环境如何，您都必须自己将其初始化 - 它不会“保留”上一页的任何状态。您可以有意识地将状态从一个页面保存到下一个页面，无论是服务器端的数据库还是客户端的 cookie 或 LocalStorage，但要利用它，您必须专门编写代码将状态保存到存储位置，然后适用时从那里读取它的代码。

但是，听起来您想要的只是在两个页面中初始化相同的数组，这应该可以与子模板一起正常工作，或者只是在两个页面中引用相同的模板代码。