【文章內(nèi)容簡(jiǎn)介】 么做、編碼解碼要求如何等等關(guān)鍵信息只字不提，或者開(kāi)發(fā)者也沒(méi)想過(guò)這些問(wèn)題呢。因此，我們一直在強(qiáng)調(diào)代碼的質(zhì)量和可維護(hù)性，但一直以來(lái)都未見(jiàn)效，蓋源于缺少這種“服務(wù)”意識(shí)的灌輸。這種意識(shí)在下文中還會(huì)多次提到，因?yàn)樗苡绊懩阕鍪碌拿總€(gè)細(xì)節(jié)，是最應(yīng)當(dāng)首先突破的思想糾結(jié)?！　〕艘庾R(shí)問(wèn)題，另一方面是技術(shù)問(wèn)題，即文筆。這也是工程師最瞧不上眼的問(wèn)題，難以置信這竟然是阻礙工程師突破瓶頸的關(guān)鍵所在。我已看到過(guò)數(shù)不清的人在晉升這道關(guān)卡吃了大虧，很多工程師技術(shù)實(shí)力很強(qiáng)，但就是表達(dá)不出來(lái)，要么羅列一大堆信息毫無(wú)重點(diǎn)、要么毫無(wú)趣味的講代碼細(xì)節(jié)，不知云云。除非你走狗屎運(yùn)碰到一個(gè)懂技術(shù)的老板，否則真的沒(méi)辦法逃脫碼農(nóng)的宿命。但大部分人還振振有詞不以為然。而在Web前端開(kāi)發(fā)領(lǐng)域情況更甚。前端工程師是最喜歡搞重構(gòu)的，但在快節(jié)奏的需求面前，你很難用“提高了可維護(hù)性”、“提升了性能”這類虛無(wú)縹緲的詞藻為自己爭(zhēng)取到時(shí)間來(lái)搞重構(gòu)，說(shuō)的露骨一點(diǎn)，可能你真的對(duì)某次重構(gòu)帶來(lái)的實(shí)際價(jià)值無(wú)法量化，只是“感覺(jué)代碼更整潔了”而已。我會(huì)在下文的“偽架構(gòu)”中會(huì)展開(kāi)分析前端工程師的這種浮躁獻(xiàn)媚的技術(shù)情結(jié)。而這正是前端工程師最欠缺的素質(zhì)之一：用數(shù)據(jù)說(shuō)話，用嚴(yán)謹(jǐn)科學(xué)的論據(jù)來(lái)支撐你的觀點(diǎn)，老板不傻，有價(jià)值的東西當(dāng)然會(huì)讓你去做。　　當(dāng)然，情況不總是這么糟糕，我們看到中文社區(qū)中已經(jīng)鍛煉出了很多寫(xiě)手，他們?cè)谟酶哔|(zhì)量的文字推銷自己的技術(shù)理念，這是一個(gè)好兆頭，好的文筆是可以鍛煉出來(lái)的。而在職場(chǎng)，特別是對(duì)前端工程師這個(gè)特殊職位來(lái)講，這種基本技能可以幫你反思梳理需求的輕重緩急，從凌亂的需求中把握七寸所在。因?yàn)楫?dāng)你開(kāi)始認(rèn)真寫(xiě)一封郵件的時(shí)候，這種思考已經(jīng)包含其中了?！　∷?，雅虎技術(shù)的推銷是相對(duì)成功和遠(yuǎn)播的。關(guān)鍵在于兩方面，扎實(shí)的技術(shù)功底和高超的寫(xiě)手。而真正的技術(shù)大牛一定是集兩者與一身，不僅鉆研劍道，還能產(chǎn)出秘籍。這也是Yahoo!優(yōu)雅的學(xué)院派氣息的動(dòng)力源泉。國(guó)內(nèi)很多技術(shù)團(tuán)體想在這方面有所建樹(shù)，應(yīng)當(dāng)首先想清楚這一點(diǎn)?！　　疽?guī)范的破與立 1】　　雅虎的技術(shù)運(yùn)作非常規(guī)范，剛才已經(jīng)提到，包括技術(shù)、組織、文化，一切看起來(lái)有模有樣，也堪稱標(biāo)桿，自然成了國(guó)內(nèi)很多技術(shù)團(tuán)隊(duì)和社區(qū)的效仿對(duì)象。一時(shí)間各種“規(guī)范“成風(fēng)、各色“標(biāo)準(zhǔn)“大行其道，結(jié)果是質(zhì)量參差不齊。　　我們到底需要什么樣的規(guī)范？雅虎的技術(shù)規(guī)范到底有何種魔力？以何種思路構(gòu)建的規(guī)范才是貨真價(jià)實(shí)的？規(guī)范有著怎樣的生命周期？想清楚這些問(wèn)題，能很大程度減輕很多Web前端工程師的思想負(fù)擔(dān)，看清一部分技術(shù)本質(zhì)，避免盲目跟風(fēng)?！　∥覀兊拇_需要規(guī)范，但好的規(guī)范一定是務(wù)實(shí)的，一定是“解決問(wèn)題“的。比如針對(duì)項(xiàng)目構(gòu)建的DPL可以收納公用的視覺(jué)元件以減少重復(fù)開(kāi)發(fā)、規(guī)定某OPOA項(xiàng)目的事件分發(fā)原則以確立增量開(kāi)發(fā)的代碼慣性。反之，糟糕的規(guī)范卻顯得過(guò)于“抽象“，比如頁(yè)面性能指標(biāo)、響應(yīng)式設(shè)計(jì)原則。另外，盡管他山之石可以攻玉，但拿來(lái)主義有一個(gè)大前提，就是你了解你的項(xiàng)目的關(guān)鍵問(wèn)題，你要優(yōu)先解決的是些關(guān)鍵問(wèn)題，而外來(lái)規(guī)范正好能解決你的問(wèn)題。因此規(guī)范是一本案頭手冊(cè)，是一攬子問(wèn)題的解決方案，應(yīng)當(dāng)是“字典”，而不是“教程“?？梢?jiàn)規(guī)范的源頭是“問(wèn)題”。所以，當(dāng)你想用CoffeeScript重構(gòu)你的項(xiàng)目時(shí)、當(dāng)你想引入CommonJS規(guī)范時(shí)、當(dāng)你想在頁(yè)面中揉進(jìn)Bootstrap時(shí)、當(dāng)你打算重復(fù)造輪子搞一套JS庫(kù)時(shí)、當(dāng)你想重寫(xiě)一套assets打包工具時(shí)，想想這些東東解決了你的什么問(wèn)題？會(huì)不會(huì)帶來(lái)新的問(wèn)題、把事情搞復(fù)雜了？還是為了嘗鮮？或者為了在簡(jiǎn)歷中堂而皇之的寫(xiě)上使用并精通各種新技術(shù)？　　規(guī)范之立應(yīng)當(dāng)有動(dòng)因，動(dòng)因來(lái)源于項(xiàng)目需求，項(xiàng)目需求則來(lái)自對(duì)產(chǎn)品的理解和把握，這是Web前端初級(jí)工程師走向中級(jí)甚至高級(jí)的一次重要蛻變，軟件工程領(lǐng)域早就有“架構(gòu)師”角色，而架構(gòu)師往往存在于項(xiàng)目需求分析和概設(shè)、詳設(shè)階段。我看到的情況是，Web前端工程師的思維過(guò)多的限制在“界面”之內(nèi)，向前和產(chǎn)品需求離的太遠(yuǎn)（認(rèn)為這是視覺(jué)設(shè)計(jì)師的事）、向后和數(shù)據(jù)邏輯又隔離開(kāi)來(lái)（認(rèn)為這是后臺(tái)工程師該干的事），因此前端規(guī)范也大都泛泛，無(wú)關(guān)項(xiàng)目痛癢，成了玩具?！　⊙呕⒓夹g(shù)規(guī)范的優(yōu)秀之初在于它們解決問(wèn)題。所以，學(xué)習(xí)使用規(guī)范應(yīng)當(dāng)多問(wèn)一句，“他們?yōu)槭裁催@樣做？”其實(shí)，想清楚這些問(wèn)題時(shí)，腦海中自然形成了一種“遇山開(kāi)山”的創(chuàng)造性思維?！　∪绻f(shuō)新技術(shù)的嘗鮮缺少針對(duì)性，但至少滿足程序員的某種潔癖和快感，那么“負(fù)擔(dān)”從何而來(lái)呢？對(duì)于初學(xué)者來(lái)說(shuō)，有價(jià)值學(xué)習(xí)資料可能只有這些規(guī)范，如果說(shuō)規(guī)范價(jià)值不大，那又當(dāng)從何入手呢？　　剛才我說(shuō)的不是依賴于規(guī)范，而是對(duì)規(guī)范的反思，擺脫規(guī)范灌輸給我們的思維定勢(shì)。新人們大概是看了Wiki中的很多指標(biāo)、結(jié)論、實(shí)踐，在做項(xiàng)目之初就附加了不少“八股式”的負(fù)擔(dān)，甚至影響我們對(duì)項(xiàng)目關(guān)鍵需求和關(guān)鍵問(wèn)題的洞察力和判斷力，負(fù)擔(dān)過(guò)重就無(wú)法輕裝上陣，Wiki中提到的這些指標(biāo)和規(guī)范是結(jié)論性的，是大量的實(shí)踐之后得出的，也只有經(jīng)歷過(guò)大量實(shí)踐才會(huì)真正理解這些結(jié)論，比如DomReady時(shí)間和請(qǐng)求數(shù)是否有因果關(guān)系，請(qǐng)求數(shù)增加是否真的會(huì)導(dǎo)致頁(yè)面性能下降，什么條件下會(huì)導(dǎo)致性能下降？我們從那些條文和結(jié)論中無(wú)法找到答案?！　∨e個(gè)具體的例子，Kissy剛剛出了DPL，也是一大堆結(jié)論，比如他的布局就采用了經(jīng)典的雙飛翼，使用容器浮動(dòng)來(lái)實(shí)現(xiàn)，那么，這種做法就是不可撼動(dòng)的“標(biāo)準(zhǔn)”嗎？看看淘寶車險(xiǎn)首頁(yè)，布局容器齊刷刷的inlineblock，只要頂層容器去掉寬度，布局容器自身就能根據(jù)瀏覽器寬度調(diào)整自然水平/垂直排列，輕易的適應(yīng)終端寬度了?！　≡俦热纾詫毬眯杏?jì)劃項(xiàng)目中的部署方式，也沒(méi)有完全使用Loader管理依賴，而是將依賴層級(jí)做的很少，業(yè)務(wù)邏輯使用腳本來(lái)合并，這樣就可以更容易在build環(huán)節(jié)加入語(yǔ)法檢查和代碼風(fēng)格檢查?！　☆愃七@種擺脫原有編程思維，有針對(duì)性的用新思路新方法解決問(wèn)題的做法顯然讓人感覺(jué)更加清爽，編程的樂(lè)趣也正體現(xiàn)在打破常規(guī)的快感之中，小馬曾經(jīng)說(shuō)過(guò)：“制造規(guī)范是為了打破規(guī)范”，萬(wàn)不要因?yàn)檫@些規(guī)范標(biāo)準(zhǔn)加重負(fù)擔(dān)，導(dǎo)致開(kāi)始做一個(gè)簡(jiǎn)單頁(yè)