2016前端技術觀察有感

最近看了一篇深度好文,講的是資深老前端對于前端現狀的看法:2016年前端技術觀察。我覺無論是跨界還是新進入前端行業的同學都應該看一下。

我自己看完后感觸頗深,因為在上家公司一直都是在寫原生的JavaScript,對于組件抽象、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]
}

組件化完全是抽象的,你不用去考慮里面的實現細節,只需要知道它暴露的接口(反映到相應的屬性、方法事件),組件化難在頁面的拆分和抽象的程度,一個組件如果太過龐大,太過業務定制化,一定是拆分和抽象做的不夠。

我認為原子組件必須足夠抽象且足夠簡單,而基于它們,再去組成高度復雜或者高度定制化的業務組件。就如同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"這種組合的方式來構成一個有特征的message。

最近在使用Node開發服務端,也在用React Native開發App,每天都在思考自己用的框架的好處與壞處,抱著包容但又有點質疑的態度敲每一行代碼。在這個過程中發現,不同的場景適用的技術也不同,知識的深度與廣度都非常重要。

其實不想做全棧,可能是想偷懶用一門語言做所有的事。但是發現專業的領域還是需要專業的知識。比如服務端,有MVC的架構體系、有登陸、有中間件、插件、有靜態資源存儲、阿里云CDN以及OSS、有數據庫設計(其實我喜歡SQL,對于NoSQL并不是很感冒)、有服務并發、熱發布等等概念,比如React Native,抽象地說你之所以能夠用JavaScript寫App,是因為Native端封裝并暴露了組件給你用,給你提供了“JavaScript運行環境”,最終的性能優化,調試還是強依賴于Native。

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

所以前端是我的深度所在,App和服務端是我的廣度,我的學習會基于這個核心思想,在這個前提下,再去深入地去學習App和服務端的開發思想。

回到前端,我一直想要把前端做到極致,把體驗做到等于甚至超過App,但其實也受限于產品,他們不知道SPA可以如何應用。比如做一個樹狀的組織結構圖,是不是history.back就可以從當前節點平滑移動到上一次選中的節點,history.forward就可以把視圖平滑移動到下一個節點,我們必須推動產品,讓他們了解前端到底能夠做到什么程度,這會更加利于前端行業的生態與推動。

最近還有一個概念,PWA(Progressive Web Application),不知道的同學可以Google一下,這個是Google提出的概念,漸進式網頁應用,Google自己的安卓機Nexus已經支持。它可以把網站收藏到桌面圖標,下次從桌面圖標打開,就像打開應用一樣,其實你會覺得它就是應用,但是它的運行機制是網頁。這個在國內估計很難普及,因為國內安卓機廠商都是自己改過的操作系統,很難跟著Google走,但是在國外,這個已經很普及,AliExpress就在使用PWA做應用開發。

作為一個前端coder以及熱愛前端的人,我相信前端的應用場景會越來越多,JavaScript能干的事會越來越多。說不定以后的PC應用程序、嵌入式開發、VR、AR甚至人工智能等領域都會有JavaScript的身影(有些現在已經有了)。

最后警醒自己:要不斷地增加前端領域的深度,并拓寬Native和服務端的廣度。加油~~!

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 230,247評論 6 543
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 99,520評論 3 429
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事?!?“怎么了?”我有些...
    開封第一講書人閱讀 178,362評論 0 383
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 63,805評論 1 317
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 72,541評論 6 412
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 55,896評論 1 328
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,887評論 3 447
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 43,062評論 0 290
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 49,608評論 1 336
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 41,356評論 3 358
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 43,555評論 1 374
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 39,077評論 5 364
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,769評論 3 349
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 35,175評論 0 28
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 36,489評論 1 295
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 52,289評論 3 400
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 48,516評論 2 379

推薦閱讀更多精彩內容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 172,737評論 25 708
  • Spring Cloud為開發人員提供了快速構建分布式系統中一些常見模式的工具(例如配置管理,服務發現,斷路器,智...
    卡卡羅2017閱讀 134,826評論 18 139
  • 【體態矯正姿勢評估】治療師操作指引 評估姿勢 ①可以幫助理清是否有哪些肌力或肌筋膜失衡,以及這些失衡是否造成個案的...
    舒涵vivian閱讀 5,504評論 0 15
  • 中午我和媽媽去大本家吃的烤肉,我還聽了我最喜歡聽的歌,我覺得很好聽。我一邊吃烤肉一邊聽,感覺我的心情比較...
    吳卓逸閱讀 428評論 0 2
  • 久聞東野圭吾大名已久,昨天買了他的一本書?;氐綄嬍冶闫炔患按拇蜷_閱讀,一開始閱讀便停不下來,花了一下午的時間便將...
    關家大小姐閱讀 510評論 2 2