“ 最近由于工作太忙导致都没有时间写一些工作中遇到的有趣的技术内容，接下来我分享的是关于公司用到的模板引擎handlebars。”

模板引擎对于前端开发者想必不会陌生，在这里我就不介绍了，下面我会说一下模板引擎handlebars在项目中有什么作用，这里仅是相对于我公司使用的一套机制来说一下。（ps：这里默认你会node，express框架作为示例）
by the way，讲得不好勿喷，大家可以在评论下相互探讨。

1. handlebars模板引擎与前端框架的区别

其实最开始的时候认为模板引擎和框架应该没有什么区别，就比如说Vue框架是使用双花括号（）来渲染的，而handlebars模板引擎也是使用双花括号渲染的，其实它们之间是有很大区别的。
这里我就不卖关子了，下面就是它们的相关区别：
首先最重要的一点就是如果你想搜索引擎优化好（seo），那么就可以使用模板引擎；
模板引擎开发效率较低，而前端框架进行相关的组件化开发，其开发效率是很快的；
对于较为复杂的前端应用（比如后台系统），这种就是页面级多且灵活，那么就需采用前端框架，而那种偏向展示性页面并且业务逻辑不复杂的，就可以采用模板引擎。
vs

handlebars模板引擎vs前端主流框架

2. handlebars模板引擎与node擦出的爱情

其实在前端和后端都可以使用模板引擎，如果我们在后端使用模板引擎来生成html页面，那么这样一个过程我们称为ssr，即服务端渲染。在我们公司使用的项目流程机制中，后端是java，而node只是作为一个中间件来处理，模板引擎是handlebars。
首先在node端会使用handlebars模板引擎生成页面，然后会将一些优先在页面中展示的数据放到handlebars模板引擎的script标签中，这个时候前端就可以将拿到的数据放到window下面以及放到全局的redux下面，这样做的好处在于：如果你将首次渲染的数据放到前端进行渲染，那么如果你在didMount生命周期中进行给页面传值然后渲染会出现一个很大的问题—闪屏，这样给用户会造成很不好的体验，因此这个时候就充分的体验到我们的模板引擎的好处了。

3. 服务端渲染SSR

这一小节讲一下题外话：SSR服务端渲染，ps：需要后端密切配合的。
首先来对比一下客户端渲染和服务端渲染：
客户端渲染：html仅仅作为静态文件，客户端在请求时，服务端不做任何处理，直接以原文件的形式返回给客户端客户端，然后根据html上的JavaScript，生成 DOM插入html；

服务端渲染：当用户第一次请求页面时，由服务器把需要的组件或页面渲染成 HTML 字符串，然后把它返回给客户端。客户端拿到手的，是可以直接渲染然后呈现给用户的 HTML 内容，不需要为了生成 DOM 内容自己再去跑一遍 JS 代码。使用服务端渲染的网站，可以说是“所见即所得”，页面上呈现的内容，我们在 html 源文件里也能找到。

ssr服务端渲染流程图

今天先简短的介绍handlebars模板引擎的一些内容，在下一章节中我会着重介绍一整套使用流程，然后带领大家来搭建一个属于自己的前端框架加上handlebars模板引擎以及node中间件，下一章是很有趣的一章哟，期待与大家见面。

参考链接：服务端渲染（SSR)