在成都網(wǎng)站建設(shè)中，我們常常遇到DIV+CSS,網(wǎng)頁CSS重構(gòu)(Refactoring)這個(gè)詞最初由Martin Fowler 和 Kent Beck給下的定義，它是一種修改，使軟件的內(nèi)部結(jié)構(gòu)更容易理解，在不改變軟件的可見行為方式前提下使軟件更容易變更…它是一種有節(jié) 制的整理HTML代碼、使bug產(chǎn)生幾率最小化的方法。

網(wǎng)頁CSS重構(gòu)的結(jié)果是引用了快捷方法、去除了重復(fù)HTML代碼和死HTML代碼，使設(shè)計(jì)和邏輯更加清晰。是在更好的、更聰明的使用編程語言。是在 優(yōu)勢利用你現(xiàn)在知道、但當(dāng)時(shí)的開發(fā)程序員并不知道——或并沒有加以利用的信息。不斷的簡化HTML代碼，讓它們更容易理解。不斷的使 它們在將來的變更變得更容易、更安全。

在這個(gè)過程中發(fā)現(xiàn)了bug、修改bug，這不是網(wǎng)頁CSS重構(gòu)。優(yōu)化不是網(wǎng)頁CSS重構(gòu)。強(qiáng)化異常捕捉、增加預(yù)防性HTML代碼不是網(wǎng)頁CSS重 構(gòu)。讓HTML代碼更容易測試不是網(wǎng)頁CSS重構(gòu)——盡管網(wǎng)頁CSS重構(gòu)能達(dá)到相同的效果。這些所有的事都是有益的。但這些都不是網(wǎng)頁CSS重構(gòu)。 ? 　　程序員，特別是做維護(hù)工作的程序員，清理HTML代碼是他們的日常工作之一。這是基本工作，是必須要做的。Martin Fowler等人的貢獻(xiàn)是使網(wǎng)頁CSS重構(gòu)HTML代碼的最佳實(shí)踐方法格式化，并把常見的、證明切實(shí)有效的網(wǎng)頁CSS重構(gòu)模式——網(wǎng)頁CSS重構(gòu)的目標(biāo)和 網(wǎng)頁CSS重構(gòu)的步驟——進(jìn)行歸檔分類。

網(wǎng)頁CSS重構(gòu)很簡單。盡可能在寫HTML代碼前先寫測試能夠防止你犯錯(cuò)誤。小規(guī)模的、獨(dú)立的、穩(wěn)妥的對HTML代碼進(jìn)行結(jié)構(gòu)上的調(diào)整，每次調(diào)整完 后都要進(jìn)行測試，確保你沒有改變HTML代碼的行為特征——功能和以前一樣，只是HTML代碼上看著不同。網(wǎng)頁CSS重構(gòu)模式和現(xiàn)代化的IDE里的網(wǎng)頁 CSS重構(gòu)工具使網(wǎng)頁CSS重構(gòu)變得容易、安全和代價(jià)低廉。

不要為了網(wǎng)頁CSS重構(gòu)而網(wǎng)頁CSS重構(gòu)

網(wǎng)頁CSS重構(gòu)可以被當(dāng)成一種能給你的HTML代碼變更帶來幫助的措施。HTML代碼網(wǎng)頁CSS重構(gòu)應(yīng)該在你進(jìn)行HTML代碼變更前進(jìn)行，這樣能讓 你確信你對HTML代碼理解了，使你更容易、更安全的把變更引入HTML代碼。對你的網(wǎng)頁CSS重構(gòu)動作進(jìn)行回歸測試。然后進(jìn)行糾正或變更。再次測試。之 后可能需要對更多的HTML代碼進(jìn)行網(wǎng)頁CSS重構(gòu)，使你HTML代碼變更的意圖變得更加清晰。再次進(jìn)行全面測試。網(wǎng)頁CSS重構(gòu)，再變更?；蜃兏缓?網(wǎng)頁CSS重構(gòu)。

你不是為了網(wǎng)頁CSS重構(gòu)而網(wǎng)頁CSS重構(gòu)，你網(wǎng)頁CSS重構(gòu)是因?yàn)槟阆胱銎渌氖虑椋W(wǎng)頁CSS重構(gòu)能幫助你完成這些事情。

網(wǎng)頁CSS重構(gòu)的范圍應(yīng)該受你需要實(shí)施的HTML代碼變更或HTML代碼修正來決定——為了讓HTML代碼變更更安全和更簡潔，你應(yīng)該做些什么?換句話說：不要為了網(wǎng)頁CSS重構(gòu)而網(wǎng)頁CSS重構(gòu)。不要對那些你不打算進(jìn)行變更或不會變更的HTML代碼進(jìn)行網(wǎng)頁CSS重構(gòu)。

為理解而做簡略網(wǎng)頁CSS重構(gòu)(Scratch Refactoring)

Michael Feather的《Working Effectively with Legacy Code》這本書里提到了簡略網(wǎng)頁CSS重構(gòu)(Scratch Refactoring)的概念;Martin Fowler稱之為“為理解而網(wǎng)頁CSS重構(gòu)”。這是用來對付那些你不理解的(或不能忍受的)HTML代碼，清理它們，這樣在你打算真正動手修改它前，你 能對它們是干什么的有了更好的理解，同樣也對你debug這些HTML代碼有幫助。一旦你能清楚了一個(gè)變量或方法的真正意圖，重命名它們，給它們一個(gè)更合 適的名稱，刪除那些你不喜歡看的(或覺得沒有用的)HTML代碼，拆解復(fù)雜的條件語句，把長程序分解成數(shù)個(gè)容易理解的小程序。

不要惦記著復(fù)查或測試這些改動。這是為了讓你的網(wǎng)頁CSS重構(gòu)快速的推進(jìn)——這能讓這些HTML代碼以及它們的運(yùn)行原理在你的大腦里產(chǎn)生一個(gè)快速但 不完備的原型。從中學(xué)習(xí)，然后丟掉它們。簡略網(wǎng)頁CSS重構(gòu)還能讓你嘗試各種不同的網(wǎng)頁CSS重構(gòu)途徑，學(xué)到更多的網(wǎng)頁CSS重構(gòu)技巧。Michael Feathers建議說，在這個(gè)過程中要留意那些看起來沒什么用處、或者特別有用的東西，這樣當(dāng)你完成此練習(xí)后、要真正修改它們時(shí)，才能把事情做正確—— 修改時(shí)一點(diǎn)一點(diǎn)來，講究方法，邊修改邊測試。

什么是“大規(guī)?！本W(wǎng)頁CSS重構(gòu)?

對HTML代碼進(jìn)行簡單的但又明顯的網(wǎng)頁CSS重構(gòu)：消除重復(fù)，修改變量和方法名稱使其更有意義，提煉方法使HTML代碼更易懂、更易復(fù)用，簡化條 件邏輯，把無意義的數(shù)字換成命名的變量，把相似的HTML代碼集中到一起。通過這些網(wǎng)頁CSS重構(gòu)，在HTML代碼的可理解性和可維護(hù)性上，你能得到巨大 的回報(bào)。 ? 　　相對于這些較小的、行內(nèi)的網(wǎng)頁CSS重構(gòu)，更加重大的設(shè)計(jì)上的網(wǎng)頁CSS重構(gòu)與之有明顯差異——這就是Martin Fowler所指的”大型網(wǎng)頁CSS重構(gòu)”。大的、代價(jià)很高的變動，附帶有大量的技術(shù)風(fēng)險(xiǎn)。這不是你編程過程中的清理HTML代碼和設(shè)計(jì)改進(jìn)：這是根本性 的重新設(shè)計(jì)。

有些人喜歡把對一個(gè)系統(tǒng)的重新設(shè)計(jì)或重寫或重新搭建平臺或返工叫“大規(guī)模網(wǎng)頁CSS重構(gòu)”。因?yàn)榧夹g(shù)上講，這些并不改變軟件功能特征——業(yè)務(wù)邏輯、軟件輸入和輸出仍和以前一樣，“只是”設(shè)計(jì)和HTML代碼實(shí)現(xiàn)變了。它和常規(guī)網(wǎng)頁CSS重構(gòu)的區(qū)別看起來就是：一個(gè)是重寫了一段HTML代碼，一個(gè)是重寫 了一個(gè)系統(tǒng)，只要你是一步一步做下來的，你都可以稱之為“網(wǎng)頁CSS重構(gòu)”——不管你是長年累月被困于將一個(gè)老系統(tǒng)換成新HTML代碼，還是對系統(tǒng)架構(gòu)進(jìn) 行大規(guī)模的改造。

“大規(guī)模網(wǎng)頁CSS重構(gòu)”會變的很糟糕。你可能需要花數(shù)周、數(shù)月(甚至數(shù)年)才能完成，需要你對軟件的很多部分進(jìn)行改動。軟件會因此不能運(yùn)行，需要 分多次發(fā)布這些變更，需要你做臨時(shí)的臺架(scaffolding)和變通方案——尤其是你采用短周期的敏捷開發(fā)方法時(shí)。這時(shí)Branch by Abstraction這樣的實(shí)踐方法就派上用場了，它能幫你在長周期內(nèi)管理HTML代碼中的變化。

而且在開發(fā)新HTML代碼的同時(shí)你還要維護(hù)舊HTML代碼，這使得HTML代碼版本控制很麻煩，變更起來不方便，致使HTML代碼很脆弱，易犯錯(cuò) ——這正和網(wǎng)頁CSS重構(gòu)所預(yù)期的目的背道而馳。有時(shí)這樣的情況會一直持續(xù)下去——這種新舊HTML代碼交替的過程永遠(yuǎn)不能完成，因?yàn)槟塬@得大利益的部 分都是最先完成，或者因?yàn)樽畛鯉磉@個(gè)想法的顧問已經(jīng)干別的去了，或者是預(yù)算被消減，而且你也討厭維護(hù)這樣一個(gè)拖拉的項(xiàng)目。 ? 　　這些是網(wǎng)頁CSS重構(gòu)——那些不是

在這種重型的項(xiàng)目開發(fā)過程中混入網(wǎng)頁CSS重構(gòu)的概念是不對的。它們從根本上就是另外一種工作，帶有完全不同的開發(fā)成本和風(fēng)險(xiǎn)。它混淆了人們對什么是網(wǎng)頁CSS重構(gòu)、網(wǎng)頁CSS重構(gòu)能干什么的認(rèn)識。

網(wǎng)頁CSS重構(gòu)可以、也應(yīng)該融入到你寫HTML代碼或維護(hù)HTML代碼的過程中——作為日常開發(fā)/質(zhì)量管理的組成部分，就像寫測試和HTML代碼審 查一樣。網(wǎng)頁CSS重構(gòu)應(yīng)該被安靜的，持續(xù)的和低調(diào)的完成。它需要我們把工作精力分出一部分給它，它需要在我們的工期評估和風(fēng)險(xiǎn)評估中考慮到它的存在。如 果做的正確，你不需要去解釋或向外人驗(yàn)證這部分工作。

花幾分鐘、一兩個(gè)小時(shí)做網(wǎng)頁CSS重構(gòu)，就像是你開發(fā)過程中的一種修改，是工作的一部分。如果它讓你花了數(shù)天時(shí)間，或者更長，那不是網(wǎng)頁CSS重 構(gòu);那是重寫，或重新設(shè)計(jì)。如果你需要明確的留出一部分時(shí)間(或整個(gè)sprint周期)來網(wǎng)頁CSS重構(gòu)HTML代碼，如果需要為清理HTML代碼而申請 批準(zhǔn)，或把清理HTML代碼作為一個(gè)開發(fā)需求，那你不是在網(wǎng)頁CSS重構(gòu)——即使你用了網(wǎng)頁CSS重構(gòu)的技術(shù)和工具，你仍然做的是另外一種工作。

本文來源于成都網(wǎng)站建設(shè)公司與成都網(wǎng)站設(shè)計(jì)制作公司-創(chuàng)新互聯(lián)成都公司！

網(wǎng)站欄目：網(wǎng)頁重構(gòu)的意義
文章位置：http://www.rwnh.cn/news49/317699.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供標(biāo)簽優(yōu)化、網(wǎng)站營銷、服務(wù)器托管、ChatGPT、網(wǎng)站內(nèi)鏈、域名注冊

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源： 創(chuàng)新互聯(lián)