軟體專案實訓及課程設計指導——如何應用Web頁面靜態化技術提高Web應用系統的響應效能
1、什麼是Web頁面靜態化技術
（1）Web頁面靜態化技術
將JSP動態頁面按照某種模板格式生成對應的*.html純靜態Web頁面的過程，稱之為Web頁面靜態化技術。
（2）何種場合需要應用Web頁面靜態化技術
當有些企業應用系統中的頁面資訊在一段時間內不發生變化時（比如內容管理系統、網上商城中的商品資訊等），可以應用Web頁面靜態化技術，這樣可以提高整個系統的響應效率——因為無須再訪問後臺資料庫系統、也不需要再次編譯處理JSP動態頁面檔案，因此能夠減少對Web應用系統的消耗和效能影響。
2、為什麼要應用Web頁面靜態化技術
目前基於B/S（Browser/Server，瀏覽器/伺服器模式）體系架構的企業應用系統基本上都是由動態Web頁面所構成的（比如由*.jsp、*.aspx、*.php等型別），正因為是動態化的Web頁面才能滿足不同的Web瀏覽者的個性化的訪問需要、並且能夠與訪問者產生相互互動。
但為了能夠產生出動態的應用效果，使用者每一次對目標頁面的HTTP請求都會在Web伺服器端對這些動態Web頁面進行編譯或者動態處理，而這些操作都是很消耗Web伺服器系統資源的。
如果目標頁面檔案（比如*.jsp）在一定的時間內，其動態顯示的內容不會發生改變（比如新聞系統中的新聞資訊顯示、網點中的商品分類和某一商品資訊的詳情頁等），那麼就沒有必要為每一次對它的HTTP請求訪問，都進行一次"新"的編譯或執行。此時可以在使用者第一次對它訪問後，就把它在這段沒有發生改變的時間內的頁面處理結果儲存到一個純靜態的頁面檔案（*.html格式）或者有靜態效果的其它格式頁面檔案（*.vm、*.ftl等形式）中，然後使用者以後每次再訪問這個動態Web頁面時，後臺Web伺服器系統程式就直接採用轉換後的靜態頁面內容進行響應。
因此，經過靜態化技術轉換處理後的結果Web頁面能夠快速地響應使用者的HTTP請求，而且還能夠大大地減少對Web伺服器系統資源的消耗。當然，為了能夠達到靜態化的功能實現目標，軟體應用系統的開發人員可以在Web應用系統的開發中應用各種模板技術——比如Velocity模板、FreeMarker模板技術等。當然，讀者如果熟悉Web頁面靜態化技術的實現原理後，也可以自己程式設計實現。
在Web應用系統的表示層開發中如何透過應用Velocity模板技術以提高Web應用系統的響應效能，作者在以前的文章中的做了詳細的介紹，有興趣的讀者可以翻看文章《軟體專案實訓及課程設計指導——如何在Web應用系統表示層開發實現中應用Velocity模板技術》。
作者在下文將為讀者介紹如何在Web應用系統的表示層開發中應用FreeMarker模板技術以提高Web應用系統的響應效能。
3、在Web應用系統的表示層開發中應用FreeMarker模板技術
（1）FreeMarker模板是什麼、怎麼理解"模板引擎"的概念
FreeMarker 和Velocity都屬於"模板引擎"（作者注："模板引擎"在J2EE平臺中一般為框架形式的系統程式和相關的系統庫），開發人員應用這些模板引擎所提供的模板語言處理相關的資料，模板引擎系統會按照開發人員的要求輸出文字，這些文字的格式可以是HTML網頁、電子郵件、配置檔案以及原始碼等形式。
如下程式碼示例為在標準的HTML頁面中內嵌FreeMarker模板語言的語句（參看其中的黑體標識的語句）的示例。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <title>showInfoTemplate.ftl</title><meta http-equiv="content-type" content="text/html; charset=gb2312"></head> <body> <h2>採用標準的方式獲得引數值： ${showResultInfo}</h2 > <br> <h2>採用FreeMarker模板的內建變數的方式獲得引數值： ${Request.showResultInfo }</h2 > <br></body></html>（2）為什麼要應用FreeMarker等型別的模板技術
談到"模板"的概念，相信讀者應該不會感覺到陌生感，在生活中大量地應用各種各樣的"模板"，應用的目的讀者也應該都會理解。同樣，在計算機軟體應用系統中也大量地提高各種模板和應用各種模板來簡化和加速某項"工作"，比如Word中的文件格式模板、程式語言中的print("%各種格式符")語句中的替換模板等等。而在J2EE系統平臺的應用系統開發中之所以應用FreeMarker模板技術：
首先，FreeMarker模板技術同樣也能夠實現Web應用系統中的表示邏輯和資料處理邏輯相互分離——這是透過在模板檔案中包裝HTML標籤實現的。
FreeMarker模板採用標準的Web Servlet程式中所提供的模型資料動態地生成目標HTML頁面檔案。在Web應用系統開發中如果應用FreeMarker模板技術，介面開發人員只需要關注於介面（也就是FreeMarker的模板檔案）的開發，而系統中的業務邏輯的開發人員也只需要負責將需要顯示的資料填入到FreeMarker的模板檔案的資料模型中。最終由FreeMarker模板引擎負責合併資料模型和模板檔案，然後產生出完整的Web頁面檔案並輸出到Web瀏覽器中。
其次，實現將基於動態化技術的各種Web頁面（如*.jsp、*.aspx、*.php等）轉換為靜態的HTML格式或其它文字格式的Web頁面，達到"動態頁面靜態化"的高效響應的應用效果。
因此，模板引擎不只是可以讓開發人員實現程式碼級別的分離（如系統中的業務邏輯程式碼和使用者介面展示控制程式碼的分離），也可以實現軟體應用系統中的資料分離（如動態可變資料與靜態固定資料相互分離），甚至還可以實現應用系統中的程式碼單元共享（程式碼重用）等效果。
4、Struts及Struts2應用框架都全面地支援FreeMarker模板技術
（1）FreeMarker模板特別適應於基於MVC體系架構模式的Web應用系統
Struts2應用框架預設採用FreeMarker作為其模板檔案，並且Struts2應用框架中所有的主題模板檔案都是採用FreeMarker模板技術編寫的。
（2）Struts2應用框架全面提供對FreeMarker模板技術的支援
在基於Struts2應用框架的Web應用系統中，開發人員只需要將專案中的Action類的配置定義中的結果<result>標籤中的type屬行設定為：type="freemarker"，就可以自動地由Struts2應用框架中內帶的FreeMarker引擎完成模型資料和模板檔案的總裝配和輸出（參看如下示例圖所示）。
（3）Struts應用框架也同樣提供對FreeMarker模板技術的支援
而在Struts應用框架中應用FreeMarker模板技術，開發人員只需要在Web應用系統的部署描述檔案web.xml中配置出與FreeMarker模板相關的FreemarkerServlet元件（參看如下示例圖所示），然後由該FreemarkerServlet元件將專案中的相關Action類中所儲存的模型資料和模板檔案相互整合組裝成最終的HTML頁面檔案、並向Web瀏覽器輸出。
作者將在下文及後續文章中為讀者介紹在J2EE Web應用系統、J2EE Struts應用框架的應用系統及J2EE Struts2應用框架的應用系統等環境中如何應用FreeMarker模板技術實現Web頁面靜態化的應用效果。作者首先在下文為讀者介紹在J2EE Web應用系統環境中如何應用FreeMarker模板技術。
5、在J2EE Web應用專案中新增一個JSP頁面檔案
（1）在Web專案的userManage目錄下新增一個檔名稱為fmtWebUserLogin.jsp的JSP頁面檔案，該頁面主要功能是模擬使用者系統登入，其中包含有一個標準的HTML表單，建立的過程參看如下示例圖所示。
（2）fmtWebUserLogin.jsp頁面檔案的程式碼示例
<%@ page language="java" pageEncoding="GB18030"%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><title>My JSP 'fmtUserLogin.jsp' starting page</title></head><body> <form action="/Struts2Web/fmtServletAction" method="post" > 您的名稱：<input type="text" name="userName" /> <br /> 您的密碼：<input type="password" name="userPassWord" /> <br /> <input type="submit" value="提交" name="submitButton" onclick="this.value='正在提交請求，請稍候'"/> <input type="reset" value="取消" /> </form></body></html>（3）fmtWebUserLogin.jsp頁面靜態預覽的效果圖如下圖所示
6、在J2EE Web應用專案中新增一個Servlet元件
在J2EE Web應用系統中使用FreeMarker模板時，應該讓J2EE Servlet元件來合併模板和資料。因此J2EE Servlet元件負責建立Configuration型別的物件例項，並負責合併模板和資料。
（1）程式包名稱為com.px1987.struts2.servlet，類名稱為FMTServletAction，建立的過程參看如下示例圖所示。
（2）將J2EE Servlet元件的URL-Pattern設定為/fmtServletAction，建立的過程參看如下示例圖所示。
（3）FMTServletAction程式類的程式碼示例
package com.px1987.struts2.servlet;import java.io.IOException;import java.io.Writer;import java.util.HashMap;import java.util.Map;import javax.servlet.ServletException;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import freemarker.template.Configuration;import freemarker.template.Template;import freemarker.template.TemplateException;public class FMTServletAction extends HttpServlet { private Configuration oneConfiguration=null; public FMTServletAction() { super(); } public void init() throws ServletException { /** 初始化FreeMarker配置，並創建出一個Configuration的例項 */ oneConfiguration = new Configuration(); //設定FreeMarker的模版檔案位置 oneConfiguration.setServletContextForTemplateLoading(getServletContext(),"userManage"); } //第一個引數是本web應用的 ServletContext,第二個引數是模板檔案的路徑 public void destroy() { super.destroy(); } public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { String resultMessage=null; String userName=request.getParameter("userName"); String userPassWord=request.getParameter("userPassWord"); boolean returnResult=userName.equals("yang") &&userPassWord.equals("1234"); if(returnResult){ resultMessage =userName+"您登入成功!"; } else{ resultMessage =userName+"您的身份資訊無效!"; } Map oneHashMap = new HashMap(); oneHashMap.put("showResultInfo", resultMessage); //取得模版檔案 Template oneTemplate= oneConfiguration.getTemplate("showInfoFMTTemplate.ftl"); response.setContentType("text/html; charset=gb2312"); Writer out = response.getWriter(); try{ //結果必須輸出到HttpServletResponse中，才能被瀏覽器載入 oneTemplate.process(oneHashMap, out); } catch (TemplateException e){ throw new ServletException("載入FreeMarker的模板檔案時出現了錯誤", e); } }}7、在J2EE Web應用專案中新增一個FreeMarker模板檔案
（1）模板檔案的名稱為showInfoFMTTemplate.ftl，建立的過程參看如下示例圖所示。
（2）模板檔案showInfoFMTTemplate.ftl的程式碼示例如下，注意其中黑體標識的程式碼
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <title>showInfoTemplate.ftl</title><meta http-equiv="content-type" content="text/html; charset=gb2312"></head> <body> <h2>採用標準的方式獲得引數值： ${showResultInfo}</h2 > <br></body></html>8、部署本Web專案並啟動測試頁面以驗證本示例的功能
（1）正確地部署完畢本Web專案後，在瀏覽器的URL位址列中輸入如下示圖中的訪問地址，啟動測試頁面 ，執行的結果參看如下示例圖所示。
（2）在測試頁面的表單中模擬使用者登入系統的狀態，輸入相關的登入引數後的執行結果參看如下示例圖所示。
從本示例的執行結果來看，在showInfoFMTTemplate.ftl頁面中同樣也可以獲得在傳統的J2EE Web應用環境中一般由動態JSP型別的Web頁面才能獲得的動態結果資料，但本示例中的*.ftl頁面是靜態效果的Web頁面。因此，最終實現和達到了"動態頁面靜態化"的高效響應的應用效果。
作者為了能夠讓讀者進一步地理解"動態頁面靜態化"的應用效果，可以透過瀏覽結果頁面相關的源程式從而確認最終是否為一個HTML格式的純靜態頁面。讀者可以在Web瀏覽器中右鍵單擊，然後在彈出的快捷選單專案中選擇"檢視原始檔"的功能子選單專案（參看如下示例圖所示）。
將在Web瀏覽器中顯示出使用者當前正在瀏覽的Web頁面的原始碼，熟悉HTML語言的讀者應該能夠看懂其中的程式碼含義——全部為HTML格式的純靜態頁面標籤。