第七节：框架搭建之页面静态化的剖析
一. 前言
拋磚引玉：?提到項目性能優(yōu)化，大部分人第一時間就會想到緩存，針對“讀多寫少”的數(shù)據(jù)，可以放到緩存里，設(shè)置個過期時間，這樣就不用每次都去數(shù)據(jù)庫中查詢了，?減輕了數(shù)據(jù)庫的壓力，比如：商城項目的物品分類目錄，不會經(jīng)常變化，就可以放到緩存里。
詳細分析：緩存的引入減輕了數(shù)據(jù)庫的壓力，但還是要訪問服務器端的接口，需要執(zhí)行接口中的代碼，需要從緩存中讀取數(shù)據(jù)，我們有沒有辦法直接訪問一個頁面，不再執(zhí)行服務器端代碼的業(yè)務呢？
答案是顯然的，肯定有，那就是頁面靜態(tài)化。
1. 什么是頁面靜態(tài)化？
針對每個用戶看到的頁面顯示的數(shù)據(jù)都是一樣的情況，可以考慮把該頁面直接生成一個html頁面，存放到服務器的硬盤中，該html頁面中是有數(shù)據(jù)的，其他用戶直接訪問該頁面地址即可，這樣既減輕了數(shù)據(jù)庫的
?
壓力，還不需要執(zhí)行服務器端業(yè)務代碼，顯然是要比緩存好的。（通俗點說就是把原先要從數(shù)據(jù)庫查詢的數(shù)據(jù)寫死到html中保存，用戶直接通過服務器存放的地址進行訪問）
案例：比如博客園，博主發(fā)表一篇文章，文章的內(nèi)容對每個用戶來說看到的內(nèi)容都是一樣的，這樣的話新增文章的時候，內(nèi)容固然要存到數(shù)據(jù)庫，但同時將內(nèi)容寫到一個html頁面里，保存到服務器硬盤上，?博主更新博客的時候，同樣要更新原先的html靜態(tài)頁面，這樣其他用戶訪問的時候，直接通過這個頁面的地址進行訪問即可。
PS：分享一個博客地址，https://www.cnblogs.com/yaopengfei/p/9216229.html 可以看出來最后都是 xxx.html ,顯然是靜態(tài)頁面。
2. 頁面靜態(tài)化的適用范圍？
? 首先靜態(tài)頁的性能比緩存好，在條件適用的情況下，能用靜態(tài)頁就用靜態(tài)頁，靜態(tài)頁適用于相同地址所有人看到的內(nèi)容都是一樣的這種情況。
?
二. 案例剖析
? 模擬一個簡單的blog案例，來說明頁面靜態(tài)化在實際項目中的使用，該案例分為列表頁和詳情頁面，包含的功能有：增加信息、修改信息、查看詳情功能，同時簡單的設(shè)計一下數(shù)據(jù)庫，數(shù)據(jù)庫內(nèi)容如下：表blogs，表信息分別是：主鍵、博客標題、博客內(nèi)容、博客其它信息、添加時間。
?
核心剖析：?
? 事先準備一個查看詳情頁面的模板，每次增加信息或者修改信息的時候，調(diào)用【頁面渲染為html字符串的方法】和【寫入文件的方法】，將最新的信息保存到html中，進而存到硬盤上，供用戶直接訪問。
?渲染Html頁面為字符串的方法如下，注意收藏哦：
1 /// <summary>2 /// 將頁面渲染成html字符串3 /// </summary>4 /// <param name="context">傳入this.ControllerContext</param>5 /// <param name="viewPath">靜態(tài)頁面的模板路徑</param>6 /// <param name="model">往模板中傳入實體，進行賦值</param>7 /// <returns></returns>8 static string RenderViewToString(ControllerContext context, string viewPath, object model = null)9 { 10 ViewEngineResult viewEngineResult = ViewEngines.Engines.FindView(context, viewPath, null); 11 if (viewEngineResult == null) 12 { 13 throw new FileNotFoundException("View" + viewPath + "cannot be found."); 14 } 15 var view = viewEngineResult.View; 16 context.Controller.ViewData.Model = model; 17 using (var sw = new StringWriter()) 18 { 19 var ctx = new ViewContext(context, view, context.Controller.ViewData, context.Controller.TempData, sw); 20 view.Render(ctx, sw); 21 return sw.ToString(); 22 } 23 }調(diào)用時候的代碼：（修改與之類似）
?
三. 詳細步驟和效果展示
?1. 主頁面展示列表、包含查看詳情、增加信息、修改信息三個操作。
前端代碼分享
?View Code
服務端代碼分享
?View Code
效果展示
?2. 增加信息，比如依次輸入：66、.Net多線程、很神奇、敬請期待，點擊增加按鈕，插入數(shù)據(jù)庫的同時，會生成一個以id來命名靜態(tài)頁面存放StaticHtml文件夾下。
后臺代碼分享：
1 /// <summary>2 /// 增加博客3 /// </summary>4 /// <returns></returns>5 public ActionResult AddBlog(blogs b)6 {7 try8 {9 //1.數(shù)據(jù)庫保存操作 10 b.addTime = DateTime.Now; 11 db.blogs.Add(b); 12 db.SaveChanges(); 13 14 //2. 生成靜態(tài)頁面操作 15 string myHtmls = RenderViewToString(this.ControllerContext, @"~/Views/Home/TempIndex.cshtml", b); 16 System.IO.File.WriteAllText(Server.MapPath(@"~/StaticHtml/" + b.id + ".html"), myHtmls); 17 return Content("ok"); 18 } 19 catch (Exception) 20 { 21 return Content("error"); 22 } 23 } 24 /// <summary> 25 /// 獲取所有數(shù)據(jù) 26 /// </summary> 27 /// <returns></returns> 28 public ActionResult InitInfor() 29 { 30 List<blogs> blogslist = db.blogs.OrderByDescending(u => u.addTime).ToList(); 31 return Json(blogslist); 32 }模板頁面代碼
1 @{2 Layout = null;3 }4 5 <!DOCTYPE html>6 7 <html>8 <head>9 <meta charset="UTF-8"> 10 <meta name="viewport" content="width=device-width" /> 11 <title>詳情頁面</title> 12 </head> 13 <body> 14 <div> 15 <p>id：@Model.id</p> 16 <p>題目：@Model.blogTitle</p> 17 <p>內(nèi)容：@Model.blogContent</p> 18 <p>其他：@Model.blogOther</p> 19 <p>時間：@Model.addTime</p> 20 21 </div> 22 </body> 23 </html>運行結(jié)果
?
3. 修改信息，修改數(shù)據(jù)庫數(shù)據(jù)的同時，進行修改靜態(tài)頁面的內(nèi)容。
?代碼分享
1 /// <summary>2 /// 編輯博客3 /// </summary>4 /// <param name=""></param>5 /// <returns></returns>6 public ActionResult EditBlog(blogs b)7 {8 try9 { 10 //1.數(shù)據(jù)庫修改操作 11 blogs b1 = db.blogs.Where(u => u.id == b.id).FirstOrDefault(); 12 if (b1 == null) 13 { 14 return Content("error"); 15 } 16 b1.blogTitle = b.blogTitle; 17 b1.blogContent = b.blogContent; 18 b1.blogOther = b.blogOther; 19 b1.addTime = DateTime.Now; 20 db.SaveChanges(); 21 22 //2. 生成靜態(tài)頁面操作 23 string myHtmls = RenderViewToString(this.ControllerContext, @"~/Views/Home/TempIndex.cshtml", b1); 24 System.IO.File.WriteAllText(Server.MapPath(@"~/StaticHtml/" + b.id + ".html"), myHtmls); 25 26 return Content("ok"); 27 } 28 catch (Exception) 29 { 30 return Content("error"); 31 } 32 }4. 查看詳情，在沒做頁面靜態(tài)化的時候，是這樣處理的：獲取該條數(shù)據(jù)的id→傳到控制器的Action中→進行數(shù)據(jù)查詢→頁面渲染并顯示頁面。
?
而有了頁面靜態(tài)化后，直接通過地址打開頁面即可。
?
?
?
總結(jié)
以上是生活随笔為你收集整理的第七节：框架搭建之页面静态化的剖析的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 信用卡有过逾期还能贷款买房吗？信用卡逾期
- 下一篇： 利率可超5％的结构性存款，与利率在4％左