2004年傅捷、王宗義和祝軍翻譯了美國塞爾達曼（Zeldman J.）的著作《網站重構》一書。這本書出來受到廣大Web愛好者的青瞇，可以說讓國內整個前端行業(那時還沒有前端這樣的職位)發生了很大的一個變化。我記得那時候，淘寶UED說:"**我們要做地球上最優秀的前端**"。 這本書稱得上是給整個行業帶來了革命性的變化，而就這場革命也造就了“21世紀最大的IT冤案”。為什么說是21世紀最大的IT冤案呢？只要2004年以后看了這本書的同學(并不是所有同學(^_^))，只要看到Web頁面源碼中有`table`標簽，就會說這個不行，寫這個頁面的人不專業，頁面也是垃圾，不符合W3C規范。其實這本書從來也沒有說網頁出現`table`標簽就是垃圾網頁，就是不符合W3C標準的頁面。 除了造成21世紀最大的IT冤案之外，還有**災難性的DIV+CSS的泛濫**。出現最多的詞就是DIV，大家覺得我會DIV，我就很高大上。而且整個頁面下來，除了DIV，就是DIV。什么P標簽、SPAN標簽基本上是找不到。這個時候就是DIV的泛濫，根本也沒有什么語義化，可讀性一說了。 甚至以前聽到過這樣的一個故事。故事是發生在一位面試官面試一位求職者，大致的對話是這樣的： 面試官：同學，你來我團隊打算做什么？ 求職者：(非常自信)我來你們公司把所有帶有`table`的頁面用DIV+CSS重構。 面試官：(很納悶)實在不好意思，我們公司所有的頁面都改成了DIV和CSS，怎么辦？ 求職者：(無語、不吭聲)... 從這個故事說明，DIV+CSS是多重的"**NB**"。從側面也說明，**只要懂DIV，都覺得懂Web，都符合W3C規范，都高大尚**。其實這個陋習直到今天都還有，在很多壇子里，討論中，甚至在很多求職者的簡歷、公司的招聘中都還能看到"懂DIV+CSS"、"將PSD轉換成DIV+CSS"之類。可想而知，難道大家就從未思考過，整個HTML就只有DIV？整個Web頁面只就是DIV+CSS了？ 隨著時間的變更，時代的進步。我們貼上的標簽不再是“**網頁設計師**”或者說“**美工**”了，而是換成了“**切圖**”、"**頁面仔**"等。同時也被認為同行業中最**沒“錢”途**。因為工作中只寫HTML和CSS，絕對沒有前途，而且待遇也低。主要是因為，很多人認為不就是寫個DIV和CSS嘛，誰都會。就算是從未接觸過這方面的同學，拿一兩本書啃一兩個星期就會寫。也造就了入門門檻非常低。 經歷過這些的時候，我坐下來重新靜下來思考：**我們Web重構到底是什么？它的價值又會是什么？**  自從2004年以后從事重構工作的同學或許只懂DIV和CSS（最起碼我就是這樣的，或許也有很多同學跟我一樣），也是自己的看家本領，或者說是吃飯的飯碗吧。最主要的工作內容也就是將PSD設計圖轉換成HTML和CSS。還有一個最大的任務就是當時引以為豪的，兼容IE5~IE6。我們能把跨瀏覽器的兼容做好，這也是我們最牛的地方。 而這個時候，我們很多重構工程師覺得自己的工作職責就是寫HTML和CSS，然后最大的任務就是將設計師的PSD設計圖轉換成Web頁面。這份工作說實話，只做一天或兩天會覺得很有意思，因為即寫即見。現再加上一些CSS3的點飾，還能做做動漫效果，也有新鮮感。但天天如此，你會還有新鮮感存在？你可能就會覺得這是多么的枯燥與機械。 加上重構是設計師、交互設計的下游，但又是后端程序的上游。這樣也造成了重構工程師是多么的苦逼。假設一個項目的工期已定，但由于各種原因，設計師耽誤了時間，而整個項目不會給你太多額外時間，也造成了重構工期的縮短。在現實工作中常常會有這樣的現象，設計師花了四天時間設計，而原型頁面次日就需要，為了不被扣上“不配合團隊合作”，“不高效”的名頭，重構也只能委屈求全，加班加點。所以很多重構工程師會認為自己在團隊不被認可、不被重視、不公平等。  其實我在思考，我們重構不只是說我們把設計圖99.99%的還原就稱作**重構**。我覺得重構是一種修改。為什么是一種修改呢？大家平時工作有沒有這樣的一個感覺，你有多少頁面是從頭到尾把設計圖轉換成Web頁面？特別是大公司、大團隊，很多時候產品或交互設計師之類會跟你說，今天是中秋節，我們要上下嫦娥的圖，你幫我換換唄。也就這樣，換個圖就完成了。那么事實上，你在做這件事情的時候有沒有想過，是每次都這樣重復做這件事情，還是有去思考，再下次出現類似需求時，不需要你來完成，讓工具或運營人員自己就能完成呢？ 還有我們做修改時，不僅僅是改變一種展示效果而以，我們更應該去思考修改的過程，思考以前代碼結構是不是合理？如果不合理，就要改，要怎么改。其實這也是一種重構。 第二種重構的意義，是讓內部結構更簡單。為什么這么說呢？可能你的上一位寫HTML和CSS同事是剛剛入行的同學，結果被你老大覺得可能不行，重新招你這位“重構大師”來掌舵。此時的你，將代碼變得更簡單，那么這個過程其實也是重構。 第三就是有節制的整理代碼。并不是代碼最少，最簡潔就是最優秀的代碼。往往很多時候，很多同學在為多一個DIV和少一個DIV爭得頭破血流。那么是否有真正的想過，多一個DIV就真正的不合理？往往很多時候，不是說你的結構少套一個DIV就合理，我們應該根據自己的業務需求去做平衡。其實這樣的一個過程也是重構。 第四就是使用Bug產生率最小化。做過IE低版本兼容的同學或許有這樣的感觸。為什么在現代瀏覽器下，頁面很完美，一到IE低版本就亂了呢？此時很多人都想盡各種hack來處理，但是否有真正的想過，自己的結構是否合理，是不是自己的代碼出了問題呢？而這樣讓Bug產生率最小化也是一種重構。 除此之外，重構不僅是還原一張設計圖，我們存在的意義需要去做更多的思考。如何讓更多的同學、更快的還原設計圖。而且還原設計圖的這個過程更簡單化、更標準化。 那么Web重構到底是什么？ 我是這么認為的(**僅個人認為，并不代表權威**)： 重構應該是一種**思想和理念**。雖然從事重構工作，活簡單，但我們也要有想法，想怎么去把事做得更好。而且我們還要有追求，不難僅追求99.99%還原設計稿，我們應該追求更多，在還原過程中想，怎么還原到讓用戶用起來更爽。 重構也是**行內分工的優化,是HTML、CSS和JS的分離及優化**。誰擅長什么就做什么？第一做起事來順手，成本也低。比如說，你讓一位擅長JS的同學去寫HTML和CSS，結果寫得不好，Bug也出來了，讓他調要調半天。從這一點來說，分工還是有好處的。正如@sofish所說**專業的人做專業的事**。這也是為什么還有一些團隊有“重構工程師”的存在。 重構是**技術、數據、情懷、人文為主導的交互優化**。雖然說重構是屌絲，但我們還是要有點追求。大家可能會說，不就是一切圖的嗎？但做我們專業揮刀切圖的人不能自己說自己的切圖的，或者自認為只切圖，如果是這樣，你可能將永遠是一切圖的。我們應該破繭而出，突破自我。