最近看了一篇深度好文，講的是資深老前端對(duì)于前端現(xiàn)狀的看法：2016年前端技術(shù)觀察。我覺無(wú)論是跨界還是新進(jìn)入前端行業(yè)的同學(xué)都應(yīng)該看一下。

我自己看完后感觸頗深，因?yàn)樵谏霞夜疽恢倍际窃趯懺腏avaScript，對(duì)于組件抽象、OO的思維方式以及如何成體系地編寫HTML5、CSS3和JavaScript頗有研究。

就像這篇文章所說，MVC的思路是：

{
    m: [a_m, b_m, c_m],
    v: [a_v, b_v, c_v],
    c: [a_c, b_c, c_c]
}

而組件化的思路是：

{
    a: [a_m, a_v, a_c],
    b: [b_m, b_v, b_c],
    c: [c_m, c_v, c_c]
}

組件化完全是抽象的，你不用去考慮里面的實(shí)現(xiàn)細(xì)節(jié)，只需要知道它暴露的接口（反映到相應(yīng)的屬性、方法和事件），組件化難在頁(yè)面的拆分和抽象的程度，一個(gè)組件如果太過龐大，太過業(yè)務(wù)定制化，一定是拆分和抽象做的不夠。

我認(rèn)為原子組件必須足夠抽象且足夠簡(jiǎn)單，而基于它們，再去組成高度復(fù)雜或者高度定制化的業(yè)務(wù)組件。就如同CSS拆分：

.message {border: 1px solid #ccc; padding:10px; color: #333;}
.success {border-color: green;}
.error {border-color: red;}
.warning {border-color: yellow;}

不是以class = "message-success"、"message-error"、"message-warning"來表示不同的message，而是以class = "message success"、"message error"、"message warning"這種組合的方式來構(gòu)成一個(gè)有特征的message。

最近在使用Node開發(fā)服務(wù)端，也在用React Native開發(fā)App，每天都在思考自己用的框架的好處與壞處，抱著包容但又有點(diǎn)質(zhì)疑的態(tài)度敲每一行代碼。在這個(gè)過程中發(fā)現(xiàn)，不同的場(chǎng)景適用的技術(shù)也不同，知識(shí)的深度與廣度都非常重要。

其實(shí)不想做全棧，可能是想偷懶用一門語(yǔ)言做所有的事。但是發(fā)現(xiàn)專業(yè)的領(lǐng)域還是需要專業(yè)的知識(shí)。比如服務(wù)端，有MVC的架構(gòu)體系、有登陸、有中間件、插件、有靜態(tài)資源存儲(chǔ)、阿里云CDN以及OSS、有數(shù)據(jù)庫(kù)設(shè)計(jì)（其實(shí)我喜歡SQL，對(duì)于NoSQL并不是很感冒）、有服務(wù)并發(fā)、熱發(fā)布等等概念，比如React Native，抽象地說你之所以能夠用JavaScript寫App，是因?yàn)镹ative端封裝并暴露了組件給你用，給你提供了“JavaScript運(yùn)行環(huán)境”，最終的性能優(yōu)化，調(diào)試還是強(qiáng)依賴于Native。

所以，全棧不是掌握了什么語(yǔ)言，重要的是它的思想，它的理念。不論用什么語(yǔ)言開發(fā)哪一端，不了解編程思想，就不是合格的coder。我只是恰好喜歡上了JavaScript，而它又恰好能夠開發(fā)前端、App以及服務(wù)端。

所以前端是我的深度所在，App和服務(wù)端是我的廣度，我的學(xué)習(xí)會(huì)基于這個(gè)核心思想，在這個(gè)前提下，再去深入地去學(xué)習(xí)App和服務(wù)端的開發(fā)思想。

回到前端，我一直想要把前端做到極致，把體驗(yàn)做到等于甚至超過App，但其實(shí)也受限于產(chǎn)品，他們不知道SPA可以如何應(yīng)用。比如做一個(gè)樹狀的組織結(jié)構(gòu)圖，是不是history.back就可以從當(dāng)前節(jié)點(diǎn)平滑移動(dòng)到上一次選中的節(jié)點(diǎn)，history.forward就可以把視圖平滑移動(dòng)到下一個(gè)節(jié)點(diǎn)，我們必須推動(dòng)產(chǎn)品，讓他們了解前端到底能夠做到什么程度，這會(huì)更加利于前端行業(yè)的生態(tài)與推動(dòng)。

最近還有一個(gè)概念，PWA（Progressive Web Application），不知道的同學(xué)可以Google一下，這個(gè)是Google提出的概念，漸進(jìn)式網(wǎng)頁(yè)應(yīng)用，Google自己的安卓機(jī)Nexus已經(jīng)支持。它可以把網(wǎng)站收藏到桌面圖標(biāo)，下次從桌面圖標(biāo)打開，就像打開應(yīng)用一樣，其實(shí)你會(huì)覺得它就是應(yīng)用，但是它的運(yùn)行機(jī)制是網(wǎng)頁(yè)。這個(gè)在國(guó)內(nèi)估計(jì)很難普及，因?yàn)閲?guó)內(nèi)安卓機(jī)廠商都是自己改過的操作系統(tǒng)，很難跟著Google走，但是在國(guó)外，這個(gè)已經(jīng)很普及，AliExpress就在使用PWA做應(yīng)用開發(fā)。

作為一個(gè)前端coder以及熱愛前端的人，我相信前端的應(yīng)用場(chǎng)景會(huì)越來越多，JavaScript能干的事會(huì)越來越多。說不定以后的PC應(yīng)用程序、嵌入式開發(fā)、VR、AR甚至人工智能等領(lǐng)域都會(huì)有JavaScript的身影（有些現(xiàn)在已經(jīng)有了）。

最后警醒自己：要不斷地增加前端領(lǐng)域的深度，并拓寬Native和服務(wù)端的廣度。加油~~！