渲染 - 模板技术

web

模板技术的目的主要是要将业务开发和 HTML 输出的工作分离，其核心思想就来自于单一职责思想。于 MVC 的目的一致，不过模板的目的是要将视觉、结构和逻辑分离。

其工作原理说起来其实很简单，一句话概括就是解释拼接字符串为代码。

(图片出自 深入浅出NodeJS)

其过程就如同图中所示，写好的模板加上想呈现的数据通过渲染引擎解释/编译后生成 HTML，其实际的工作其实就是在拼接字符串，就拿 JSP 为例

<h1>Hello <%= name %></h1>

被编译运行时 <%%> 中的内容就会被捕捉到，内部其实就是正常的 java 代码，执行这段 java 代码得到结果然后把它与前后字符串拼起来接着输出。

'<h1>Hello' + <%= name %> + '</h1>' 
↓
'<h1>Hello' + 'xxx' + '</h1>' 
↓
'<h1>Hello xxx</h1>'

因为在访问时，需要将模板代码转换为目标源码去执行，所以必然是需要消耗资源的，相比之下不用模板直接输出 HTML 要消耗更多，但其也有很多的优化手段，比如把目标源码缓存起来，缓存模板文件等等手段

总结起来，虽然模板技术多种多样各有优劣，其都具有四个要素

• 模板语言
• 包含模板语言的模板文件
• 拥有动态数据的数据对象
• 模板引擎

模板技术解耦了 web 页面中动态内容和静态内容，使得其互相没有了依赖关系，两者只要约定好数据结构就万事大吉了，这不仅方便了数据接口的重用也为模板代码的重用奠定基础。