freemark頁面靜態化
頁面靜態化
什麼是頁面靜態華
將動態頁面轉化成靜態的html，降低與資料庫的互動次數，提高頁面的訪問速度
就是伺服器在請求來之前把已經固定好的東西先編譯好了，等請求來了再動態的填資料，不要等請求來了什麼都沒做忙得半死
利用第三方提供的模板引擎,生成對應的html
thymeleaf
freemark
Velocity
為什麼要使用網頁靜態化技術
網頁靜態化技術和快取技術的共同點都是為了減輕資料庫的訪問壓力
而網頁靜態化比較適合大規模且相對變化不太頻繁的資料。另外網頁靜態化還有利於SEO。
將網頁以純靜態化的形式展現，就可以使用Nginx這樣的高效能的web伺服器來部署
Nginx可以承載5萬的併發，而Tomcat只有幾百
Freemarker
什麼是 Freemarker
freemarker是apache的一個開源的模板引擎,它基於模板來生成文字輸出。
freemaker模板引擎可以通過模板和資料生成靜態化頁面.
優點
- 提前根據模板和資料生成靜態化頁面通過io流將頁面寫入到硬碟上, 訪問的時候直接訪問.就不用訪問資料庫了, 可以大大提高資料庫的高併發讀取效能. 是資料庫訪問量降低.
- 由於頁面是提前生成好的, 所以訪問速度快, 客戶體驗好
- 由於html不需要tomcat解析瀏覽器可以直接訪問, 所以給tomcat降低高併發訪問壓力.
使用場景
新聞網站新聞頁面通過freemarker提前生成好
電商網站商品詳情頁面通過freemarker提前生成好
原則：頁面有固定的樣式, 並且一次生成多次讀取, 儘量少的改動資料
執行過程
模板
模板在freemarker中是以.ftl為字尾名的檔案, 在模板中可以使用html標籤, css, js,圖片等靜態資源
模板中可以使用el表示式獲取資料, 但是無法使用jstl標籤來判斷和迴圈, 所以模板引擎會有自己的一套
標籤庫供我們使用.
資料
資料一般儲存在關係型資料庫或者redis或者mongodb中獲取.
模板檔案中四種元素
- 文字，直接輸出的部分
- 註釋，即<#--...-->格式不會輸出
- 插值（Interpolation）：即${..}部分,將使用資料模型中的部分替代輸出
- FTL指令：FreeMarker指令，和HTML標記類似，名字前加#予以區分，不會輸出
入門程式
- 建立Maven工程
- 引入pom依賴
<dependency>
<groupId>org.freemarker</groupId>
<artifactId>freemarker</artifactId>
<version>2.3.23</version>
</dependency>
- 建立模板檔案
<html>
<head>
<meta charset="utf-8">
<title>Freemarker入門小DEMO </title>
</head>
<body>
<#--註釋內容 -->
${name},你好。${message}
</body>
</html>
- 生成檔案
建立一個測試類
TestFreemarker
public class TestFreemarker {
/*
第一步：建立一個 Configuration 物件，直接 new 一個物件。構造方法的引數就是 freemarker的版本號。
第二步：設定模板檔案所在的路徑。
第三步：設定模板檔案使用的字符集。一般就是 utf-8.
第四步：載入一個模板，建立一個模板物件。
第五步：建立一個模板使用的資料集，可以是 pojo 也可以是 map。一般是 Map。
第六步：建立一個 Writer 物件，一般建立一 FileWriter 物件，指定生成的檔名。
第七步：呼叫模板物件的 process 方法輸出檔案。
第八步：關閉流
*/
public static void main(String[] args) throws Exception {
//1.建立配置類
Configuration configuration=new Configuration(Configuration.getVersion());
//2.設定模板所在的目錄(絕對路徑)
configuration.setDirectoryForTemplateLoading(new File("D:\\java\\撩課-高新強\\分散式專案（程式碼）\\code2\\FreeMarkerPro\\src\\main\\resources\\ftl"));
//3.設定字符集
configuration.setDefaultEncoding("utf-8");
//4.載入模板
Template template = configuration.getTemplate("MyFreemark.ftl");
//5.建立資料模型
Map map=new HashMap();
map.put("name", "joker");
map.put("message", "welcome Freemarker");
//6.建立Writer物件
Writer out =new FileWriter(new File("d:\\test.html"));
//7.輸出
template.process(map, out);
//8.關閉Writer物件
out.close();
}
}
點選測試
生成檔案在D:test.html
FTL指令
assign指令
此指令用於在頁面上定義一個變數
<#assign myname="Myxq--">
${myname}
定義物件型別
<#assign info={"name":"myxqName",'age':'30'} >
電話：${info.name} 地址：${info.age}
list指令
遍歷陣列
List goodsList=new ArrayList();
goodsList.add("goods1");
goodsList.add("goods2");
goodsList.add("goods3");
Map map=new HashMap();
map.put("goodsList",goodsList);
//6.建立Writer物件
Writer out =new FileWriter(new File("d:\\test.html"));
//7.輸出
template.process(map, out);
<#list goodsList as goods>
${goods_index} --- ${goods}
</#list>
遍歷物件陣列
List userList=new ArrayList();
User user1 = new User();
user1.setName("myxq1");
user1.setAge("30");
userList.add(user1);
User user2 = new User();
user2.setName("myxq2");
user2.setAge("31");
userList.add(user2);
Map map=new HashMap();
map.put("users",userList);
//6.建立Writer物件
Writer out =new FileWriter(new File("d:\\test.html"));
//7.輸出
template.process(map, out);
<#list users as user>
${user_index} --- ${user.name}--${user.age}
</#list>
if指令
<#assign myname="myxq">
<#if myname="myxq">
<h1>大標題1myxq</h1>
<#else>
<h1>大標題2</h1>
</#if>
include指令
用於模板檔案的巢狀
<#include "header.ftl">
內建函式
內建函式語法格式
變數+?+函式名稱
獲取集合大小
共 ${users?size} 個元素
轉換JSON字串為物件
<#assign text="{'name':'myxq','age':'18'}" />
<#assign data=text?eval />
姓名：${data.name} 年齡：${data.age}
日期格式化
Map map=new HashMap();
map.put("users",userList);
map.put("today",new Date());
當前日期：${today?date} <br>
當前時間：${today?time} <br>
當前日期+時間：${today?datetime} <br>
日期格式化： ${today?string("yyyy年MM月")}
數字轉換為字串
數字直接顯示,會出現逗號
去除逗號
空值處理運算子
如果在模板中使用了變數但是在程式碼中沒有對變數賦值，那麼執行生成時會丟擲異常
可以使用"??"判斷某變數是否存在
${price?c}
<#if price??>
price變數存在
<#else>
price變數不存在
</#if>
缺失變數預設值:“!”
可以判斷是否為空值，也可以使用!對null值做轉換處理
當為空時, 會使用預設值代替
${price!'變數為空哦'}
運算子
算數運算子
FreeMarker支援的算術運算子包括:+, - , * , / , %
邏輯運算子
邏輯與:&&
邏輯或:||
邏輯非:!
邏輯運算子只能作用於布林值,否則將產生錯誤
比較運算子
1 =或者==:判斷兩個值是否相等
2 !=:判斷兩個值是否不等.
3 >或者gt:判斷左邊值是否大於右邊值
4 >=或者gte:判斷左邊值是否大於等於右邊值
5 <或者lt:判斷左邊值是否小於右邊值
6 <=或者lte:判斷左邊值是否小於等於右邊值
注意事項
=和!=可以用於字串,數值和日期來比較是否相等
=和!=兩邊必須是相同型別的值,否則會產生錯誤