模板的工作原理可以簡單地分成兩個(gè)步驟：模板解析（翻譯）和數(shù)據(jù)渲染。這兩個(gè)步驟可分別部署在前端或后端來執(zhí)行。如果放在后端執(zhí)行，則是像Smarty，F(xiàn)reeMarker這樣的后端模板引擎，而如果放在前端來執(zhí)行，則是我們要探討的前端模板。
FreeMarker是一個(gè)模板引擎，一個(gè)基于模板生成文本輸出的通用工具，使用純Java編寫，模板用servlet提供的數(shù)據(jù)動(dòng)態(tài)地生成 HTML，模板語言是強(qiáng)大的直觀的，編譯器速度快，輸出接近靜態(tài)HTML頁面的速度。這里不再對(duì)后端模版進(jìn)行描述。
前端模版提高了前端開發(fā)的可維護(hù)性（后期改起來方便）以及可擴(kuò)展性（想要增加功能，增加需求方便）；提高了開發(fā)效率提高（程序邏輯組織更好，調(diào)試方便）；最重要的一點(diǎn)就是：【視圖（包括展示渲染邏輯）與程序邏輯的分離】。好處是減輕服務(wù)器負(fù)擔(dān)，壞處是可能不利于seo以及模版錯(cuò)誤不好調(diào)試。
當(dāng)今前端模版主要有三類：
-String-based 模板技術(shù) (基于字符串的parse和compile過程) -Dom-based 模板技術(shù) (基于Dom的link或compile過程) -雜交的Living templating 技術(shù) (基于字符串的parse 和 基于dom的compile過程)。
一.前端模版的演變
傳統(tǒng)的前端開發(fā)方式是通過通過ajax獲取數(shù)據(jù)進(jìn)行繁瑣的數(shù)據(jù)渲染。隨著前端頁面的交互越來越繁雜，頁面無刷新的傳輸與頁面的顯然也越發(fā)的頻繁，導(dǎo)致頁面性能低下。即當(dāng)前端從后臺(tái)通過ajax等方式獲取到數(shù)據(jù)更新后，都需要將這個(gè)數(shù)據(jù)渲染到指定的dom元素中，需要重新進(jìn)行各種字符串拼接工作或者一系列創(chuàng)建元素的工作，這種方式是繁瑣且費(fèi)時(shí)的。這種在可讀性和維護(hù)性上也存在問題。
基于字符串的模板引擎最大的功勞就是把你從大量的夾帶邏輯的字符串拼接中解放出來了，由于它的完全基于字符串的特性，它擁有一些無可替代的優(yōu)勢(shì)。如下的字符串拼接：
延伸閱讀
- ssh框架 2016-09-30
- 阿里移動(dòng)安全 [無線安全]玩轉(zhuǎn)無線電——不安全的藍(lán)牙鎖 2017-07-26
- 消息隊(duì)列NetMQ 原理分析4-Socket、Session、Option和Pipe 2024-03-26
- Selective Search for Object Recognition 論文筆記【圖片目標(biāo)分割】 2017-07-26
- 詞向量-LRWE模型-更好地識(shí)別反義詞同義詞 2017-07-26
- 從棧不平衡問題 理解 calling convention 2017-07-26
- php imagemagick 處理 圖片剪切、壓縮、合并、插入文本、背景色透明 2017-07-26
- Swift實(shí)現(xiàn)JSON轉(zhuǎn)Model - HandyJSON使用講解 2017-07-26
- 阿里移動(dòng)安全 Android端惡意鎖屏勒索應(yīng)用分析 2017-07-26
- 集合結(jié)合數(shù)據(jù)結(jié)構(gòu)來看看(二) 2017-07-26
學(xué)習(xí)是年輕人改變自己的最好方式