在讀了這本書后對(duì)前端架構(gòu)也有了進(jìn)一步思考。
書中提到
前端架構(gòu)圍繞四個(gè)核心：代碼、流程、測(cè)試、文檔
圍繞這四個(gè)核心及項(xiàng)目經(jīng)驗(yàn)，我做了如下總結(jié)，并結(jié)合書中的內(nèi)容給出相應(yīng)的解決方案
1. 編碼規(guī)范
css類名命名無規(guī)律
問題暴露
就所在部門來講，由于前端開發(fā)能力欠缺，工程師在對(duì)css的編寫上天馬行空，一時(shí)爽就行了。
css類名的命名無規(guī)律將會(huì)導(dǎo)致可能出現(xiàn)的命名沖突，然后不同的工程師由于不清楚狀況就會(huì)通過提高自己樣式標(biāo)簽的優(yōu)先級(jí)來相互覆蓋。最后導(dǎo)致的是經(jīng)常會(huì)有某個(gè)功能合并代碼之后直接不能用，于是還得花額外的時(shí)間來查找問題。
由于命名的不規(guī)范，很多標(biāo)簽會(huì)有重名的情況，如果只想改一個(gè)標(biāo)簽的樣式，可能還會(huì)涉及到其他多處標(biāo)簽。
關(guān)于css代碼還有一個(gè)問題，就是通用屬性值沒有相應(yīng)的變量，想改網(wǎng)站的字體顏色要逐個(gè)標(biāo)簽地審查元素來找。
解決方案
css命名需要遵循某種規(guī)定，如書中提到的OOCSS、SMACSS、BEM方法
css命名盡量符合單一職責(zé)原則
減少css選擇器的層級(jí)，因?yàn)檫@不僅影響性能，還會(huì)導(dǎo)致樣式的節(jié)點(diǎn)依賴
使用css預(yù)編譯工具，如sass、less等，充分利用變量功能
2. 開發(fā)流程
代碼改動(dòng)引發(fā)災(zāi)難
問題暴露
實(shí)際項(xiàng)目中，js代碼和css代碼隨著項(xiàng)目的復(fù)雜度提高，其耦合性也相應(yīng)提高。
對(duì)于js來說，比較好的設(shè)計(jì)應(yīng)該是模塊化，所以項(xiàng)目中引入requirejs來進(jìn)行模塊化加載。
然而工程師由于對(duì)模塊化觀念的淡薄以及不熟悉requirejs，他們會(huì)自己定義
