Jade 的 sendFile('/index.html') 和 render('index') 之间的区别答案

【问题标题】：Diference between sendFile('/index.html') and render('index') from JadeJade 的 sendFile('/index.html') 和 render('index') 之间的区别
【发布时间】：2015-07-01 20:28:56
【问题描述】：

我是 JS 新手。我找到了similar question，但在其他意义上。我的问题是：模板 Jade on Express 与发送行 html 作为响应有什么区别或优势。我的意思是：为什么我会在 Express 上使用模板 Jade：

app.set('view engine', 'jade');
app.get('/', function (request, response) {
   response.render('index');});

如果我可以直接发送 html 文件作为响应：

app.get('/', function (request, response) {
   response.set('Content-Type', 'text/html');
   response.sendFile('/index.html');});

我为什么要花时间处理渲染和发送 Jade 文件而不是直接发送 html 文件。

谢谢！

【问题讨论】：

标签： html node.js templates express pug

【解决方案1】：

Jade 模板允许您创建动态 HTML。（例如，您可以在 Jade 中使用 if 语句来根据某些逻辑呈现不同的 HTML 标记）。此外，您可以将来自服务器的值插入到模板中（例如，当前登录的用户名）。

与静态 html 文件相反，您需要使用 JavaScript 在哪里拥有动态内容，并且要访问服务器变量，您需要向服务器发送 AJAX 请求并解析响应。

【讨论】：

【解决方案2】：

因为通过在每个请求中动态编译 Jade 视图，您可以使用服务器端值来扩充模板。

var jade = require('jade');
var html = jade.render('h1 #{someVar}', { someVar: 'Hi there!' });
console.log(html); // "<h1>Hi there!</h1>"

生成的 HTML 将根据您呈现模板时 someVar 的值而改变。如果您只是发送静态 HTML 文件，那么您不能方便地将数据插入到模板中。也就是说，随着 Angular 和其他前端框架变得如此流行，在服务器上扩充模板的必要性并不高。

随着单页应用程序的出现，在编译应用程序时提前渲染所有的翡翠模板通常更有意义。大多数人使用Grunt 或Gulp 来执行此操作。

【讨论】：