《Refactoring HTML: Improving the Design of Existing Web Applications》是一本精彩的HTML重構(gòu)指南，作者給出了HTML重構(gòu)的實(shí)踐路線和方法。本文是《Refactoring HTML》的讀書筆記，按照我的理解將全書的分為：戰(zhàn)略篇，戰(zhàn)術(shù)篇，工具篇。

　　本文是戰(zhàn)略篇：全局方略的角度介紹重構(gòu)的內(nèi)涵，原因，時(shí)機(jī)，目標(biāo)

　　嗯哼，我們開始：

　　進(jìn)行重構(gòu)就像打一場(chǎng)仗，而戰(zhàn)爭(zhēng)的發(fā)起是要慎重考慮的，《孫子兵法》里面講“兵者，國(guó)之大事，死生之地，存亡之道，不可不察也。”所以動(dòng)手重構(gòu)之前首先要回答下面幾個(gè)問題：

• 什么是重構(gòu)？
• 為什么進(jìn)行HTML重構(gòu)？
• 什么時(shí)候進(jìn)行HTML重構(gòu)？
• HTML重構(gòu)的目標(biāo)是什么？
• 面對(duì)質(zhì)疑：還要重構(gòu)么？

　　什么是重構(gòu) Refactoring?

　　本書側(cè)重實(shí)戰(zhàn)，沒有《UML Distilled》那樣高屋建瓴的抽象，即使有抽象，抽象層面牽扯的細(xì)節(jié)過多(這一點(diǎn)在后續(xù)的閱讀中也可以發(fā)現(xiàn))。這一部分內(nèi)容我援引了《Refactoring: Improving the Design of Existing Code》對(duì)重構(gòu)的定義：

　　Refactoring (noun): a change made to the internal structure of software to make it easier to understand and cheaper to modify without changing its observable behavior.

　　Refactor (verb): to restructure software by applying a series of refactorings without changing its observable behavior.

　　為什么進(jìn)行HTML重構(gòu)？

　　抽象地講，HTML重構(gòu)的可以讓代碼更能適應(yīng)變化，應(yīng)對(duì)系統(tǒng)和領(lǐng)域需求為新功能的開發(fā)提供更優(yōu)秀的基礎(chǔ)。

　　具體地講，HTML重構(gòu)可以：

• 讓代碼更具有可讀性，更容易理解
• 重構(gòu)過程中往往有意外的收獲：發(fā)現(xiàn)隱藏的系統(tǒng)Bug
• 增強(qiáng)頁面可用性， 關(guān)注點(diǎn)從設(shè)計(jì)者開發(fā)者轉(zhuǎn)移到使用者
• 縮短提高頁面的呈現(xiàn)時(shí)間(Slow pages -Rendering Times)
• 解決頁面瀏覽器不兼容問題
• 搜索引擎優(yōu)化Search Engine Optimization

　　進(jìn)行HTML重構(gòu)的時(shí)機(jī)?

• 每一次進(jìn)行重新設(shè)計(jì)之前；新功能將構(gòu)建在一個(gè)更穩(wěn)固的基礎(chǔ)之上
• Refactor When You Need to Fix a Bug
• Refactor As You Do a Code Review
• 一個(gè)原則:勿以善小而不為；重構(gòu)的過程往往是斷斷續(xù)續(xù)的，很少有一個(gè)連續(xù)的時(shí)間給我們進(jìn)行重構(gòu)。所以我們只要有機(jī)會(huì)進(jìn)行重構(gòu)，就動(dòng)手去做吧

　　HTML重構(gòu)的目標(biāo)（What  Refactor To） ?

• XHTML
  理由：XHTML更加嚴(yán)格，瀏覽器不再解析亂作一團(tuán)的標(biāo)簽而是格式規(guī)范的頁內(nèi)容，這時(shí)負(fù)擔(dān)從瀏覽器轉(zhuǎn)移到頁面開發(fā)者。內(nèi)容聚合，搜索引擎優(yōu)化，樣式表都可以更好的應(yīng)用基礎(chǔ)。開發(fā)者能夠更容易調(diào)試和解決問題，因?yàn)閱栴}更容易定位了。XHTML不能完全解決瀏覽器兼容問題，但是它能夠消除大部分的瀏覽器不兼容問題已經(jīng)居功甚偉。主流HTML編輯器都提供對(duì)XHTML的支持。XHTML是未來Web應(yīng)用提供堅(jiān)實(shí)的基礎(chǔ)，如：MathXML MusicXML SVG。
•  CSS

　　理由：將展現(xiàn)層從內(nèi)容中分離出來。為不同的閱讀者提供高可讀性。減少代碼重復(fù)，節(jié)省帶寬。

• REST

　　REST(Representational State Transfer表述性狀態(tài)轉(zhuǎn)移)是一種針對(duì)網(wǎng)絡(luò)應(yīng)用的設(shè)計(jì)和開發(fā)方式，可以降低開發(fā)的復(fù)雜性，提高系統(tǒng)的可伸縮性。REST提出了一些設(shè)計(jì)概念和準(zhǔn)則：

　　1.網(wǎng)絡(luò)上的所有事物都被抽象為資源（resource）；

　　2.每個(gè)資源對(duì)應(yīng)一個(gè)唯一的資源標(biāo)識(shí)（resource identifier）；

　　3.通過通用的連接器接口（generic connector interface）對(duì)資源進(jìn)行操作；

　　4.對(duì)資源的各種操作不會(huì)改變資源標(biāo)識(shí)；

　　5.所有的操作都是無狀態(tài)的（stateless）。

　　REST之所以能夠提高系統(tǒng)的可伸縮性，是因?yàn)樗鼜?qiáng)制所有操作都是stateless的，這樣就沒有context的約束，如果要做分布式、做集群，就不需要考慮context的問題了。同時(shí)，它令系統(tǒng)可以有效地使用pool。REST對(duì)性能的另一個(gè)提升來自其對(duì)client和server任務(wù)的分配：server只負(fù)責(zé)提供resource以及操作resource的服務(wù)，而client要根據(jù)resource中的data和representation自己做render。這就減少了服務(wù)器的開銷。

　　重構(gòu)的目標(biāo)不是金科玉律，你沒有必要逐一進(jìn)行實(shí)踐。你可以按照XHTML->CSS-->Rest的順序按部就班步步為營(yíng)，也可以根據(jù)實(shí)際情況調(diào)整重構(gòu)目標(biāo)和計(jì)劃。但是只要你做了，你就可以從重構(gòu)過程中得到好處。

　　面對(duì)質(zhì)疑：還要重構(gòu)么？

　　重構(gòu)的本質(zhì)決定了它不是生產(chǎn)性的，重構(gòu)的完成并沒有新功能的產(chǎn)生。所以重構(gòu)往往面臨來自各方面的質(zhì)疑：

• 重構(gòu)就是在浪費(fèi)時(shí)間，我們還是開發(fā)新功能吧

面對(duì)質(zhì)疑我們給出這樣的答案：

• HTML重構(gòu)從長(zhǎng)遠(yuǎn)來看為后續(xù)開發(fā)提供了一個(gè)良好的基礎(chǔ)，實(shí)際上是節(jié)省了時(shí)間。因?yàn)橄到y(tǒng)更容易添加新功能，更容易維護(hù)。重構(gòu)的過程能讓開發(fā)者對(duì)以前的工作有一個(gè)思考，對(duì)新人是一個(gè)熟悉系統(tǒng)的機(jī)會(huì)。
• HTML重構(gòu)本身并不會(huì)占用太多的時(shí)間，因?yàn)槲覀冇泻芏嘧詣?dòng)化的工具可用。
• HTML重構(gòu)不需要一個(gè)連續(xù)的時(shí)間，斷斷續(xù)續(xù)的時(shí)間未嘗不可，對(duì)于開發(fā)者來說，進(jìn)行重構(gòu)就像日行一善。

NET技術(shù)：HTML重構(gòu)：戰(zhàn)略篇，轉(zhuǎn)載需保留來源！

鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。