設計方案系列-如何看待前端框架選型 ?

對於前端團隊，能夠實現企業受益最大化要點。

1、技術選型的策略

一、保證產品質量

（1）功能穩健：網頁不白屏，不錯位，不卡死；操做正常；數據精準。

（2）體驗優秀：加載體驗，交互體驗，視覺體驗，無障礙訪問。

二、下降人力成本

（1）下降前期開發成本；

（2）下降後期維護成本。

 

2、前端開發模式選擇

開發模式：一、純前端開發；二、先後端分離開發；三、後端主導的開發。

一、純前端開發

主要是針對靜態頁面。沒有模板和框架參與，基本上一我的就能夠hold住，好比：官方網站，招聘站，以及設計感強烈且運營活動頁面等。自主權最大，正常是使用nodejs進行輔助開發，上線等。

二、先後端分離開發

如今不少公司的系統都是採用先後端分離的開發模式。根據項目的性質，使用nodejs進行模板渲染（ejs模板，jade模板，dot模板，artTemplate模板），要不是框架自帶的渲染的方式（vue，react），可是實質上同樣的，都是使用js對頁面進行構建。控制權很大。

三、後端主導開發

因爲不少歷史遺留問題，有的產品仍是採用後盾渲染的開發模式，好比一些內部行政系統相關的。在和他們合做的時候，交付原型的時候，須要剋制本身：

（1）不要使用sass，less產很少的前端預處理器；

（2）不使用相似於seajs之類的模塊化組件庫，而是採用效率更低的人工模塊耦合；

（3）不追求新技術，使用更基礎代碼，採用更傳統首發，良好的代碼設計保證質量【參數接口暴露在外，後端能夠輕鬆配置，而不是耦合在js中】。

這種前端屬於支援角色，後期維護一般都是與後端開發一塊兒維護。這就是有時候會出現維護很痛苦的問題。

缺點：增長開發人力成本；

優勢：自我犧牲保證項目正常維護下去，職業的體現。

 

3、前端開發技術選型

對於同一個類型的項目，採用開發模式，使用的基本框架都是一致的。

前端技術選型：

（1）外部用戶的PC站；

（2）外部用戶的mobile站；

（3）外部用戶的Native App開發；

（4）內部員工的管理後臺

 

一、外部用戶的PC站

須要有SEO，有加載體驗，採用的是先後端分離開發模式，頁面直接渲染，基於jquery。

爲何使用jquery？

（1）主要是爲了兼容IE8；

（2）是外部用戶，視覺體驗高，權重高。適合先有行，再有行。就是說視覺和行爲要儘量分離，會犧牲一點開發成本，可是用戶更重要。

（3）絕大多數頁面交互輕量用不上數據驅動。

 

二、外部用戶的Mobile站

這裏說的Mobile站主要是瀏覽器訪問爲主的，所以，頁面切換都是傳統鏈接跳轉，屬於傳統web應用，先後端分離開發模式，頁面直接渲染，採用react。大體緣由：使用react 是爲了 和APP端的react native保持同步。

 

三、外部用戶的Native App開發

前端組有直接參與 Native APP 開發的項目，使用的是 React Native 進行開發。

爲啥選擇RN，以前Hybrid模式開發有性能優化瓶頸，採用React Native性能能夠突破這個瓶頸，有原生的性能，且支持熱更新，上手不算太難，跨平臺，IOS和android代碼複用率90%。適合交互和動畫不太複雜的項目，最終要根據項目來。特別適合快速迭代的項目或者前期須要大量試錯的項目。

（1）不要隨意使用第三方庫，後期修改維護不方便，儘可能本身寫仍是本身寫；

（2）前期仍是須要客戶端幫忙配合，項目搭建。

 

四、內部員工的管理後臺

先後端分離開發，頁面側重異步渲染，使用vuejs。

大體內容是：後臺管理系統有大量的增刪改查操做，適合具備雙向綁定的類庫或者框架進行渲染。同時沒有兼容性的要求（SEO，首屏渲染），所以單頁面是合適的。能夠選擇vue，react，angular。由於vue對api，文檔對開發者更友好。選用好的UI組件，規範貫徹，拆分和按需加載，自動化測試有待增強。

 

4、總結

對於比較正式的項目，前端技術選型策略必定是產品收益最大化，用戶在首位。考慮到億級的用戶量，天然技術選型更爲謹慎，因而優先選成熟，經典的解決方案。

可是不是說，排斥熱門技術。相反，就算仍是很不成熟的新技術，只要對產品帶來收益的，必定要鼓勵應用的，好比AMP和PWA的實踐。

其實這時候也會帶來一個問題，技術人員對新技術有着自然的學習和實踐需求，由於這有助於下降心裏的焦慮和不安全感。

尤爲是對技術有着狂熱的愛好的小夥伴，這些成熟項目因爲規範約束，不能隨便亂來，很容易讓開發人員報國無門的感受，這該如何達到心理的平衡？

經過邊緣項目，實踐性的項目，以及團隊會自發發起一些有價值的內部項目來知足這樣的需求，同時積累寶貴的經驗。至關於嵌入了新的平臺，讓產品，團隊和我的都達到很是好的平衡。

產品驅動的文化下，心中想的更可能是把用戶和產品作更好，讓技術服務產品，因產品而技術，而非因技術而技術。

運營驅動的文化下，本質上是吆喝作買賣，成爲前言技術的弄潮兒就是和企業文化的契合。