每日最新頭條.有趣資訊

唱唱反調:風口上的技術不要盲目追

作者丨蔡芳芳

對於前端領域的開發者來說,“學不動了”雖然更多是一種調侃,但也真實地反映出了他們面對頻繁出新的前端技術時又愛又恨的心情。在經歷了移動互聯網的大爆發後,前端領域的邊界不斷擴張,新技術、新概念、新框架層出不窮。這在一定程度上迎合了開發者喜歡追蹤熱門框架和技術最新發展的天性,但同時也帶來了新問題。熱門框架那麽多,到底該選哪個?新技術引入並非毫無代價,一味追求新技術是不是合理?最火、最流行的技術一定適合你所在的團隊嗎?

在大前端領域,我們已經看到了太多技術風口,關於如何做好前端技術選型這件事,我們希望能從不一樣的視角聊一聊。為此,InfoQ 近期採訪了閱文集團技術專家、前百度 T8 資深研發工程師彭星,談談他對目前大前端發展趨勢和架構演進的理解,並總結了他在技術方向選擇和方案選型上的經驗,希望能給大家提供一些參考。另外,彭星是 GMTC 全球大前端技術大會(北京站)2020 大前端架構演進專題的出品人,該專題將通過解讀行業具體實踐案例明晰前端架構演進的路徑和未來方向,感興趣的同學可以關注。

大前端架構十年演進

彭星進入淘寶和百度實習的時候是 2010 年,到現在剛好十年。回顧過去這十年,前端領域經歷了一場不大不小的變革。

2010 年, AJAX 已經應用多年,十分成熟,雖然出現了 backbone 這樣的 MVC 框架,但真的用 MVC 框架開發用戶產品的並不多,絕大部分是內部管理系統。這個時期主流前端是開發後端模板,通過伺服器端渲染,AJAX 用來做頁面內容的局部更新。要說 2010 年前對業界影響比較大的一件事情,就是 Chrome 團隊開發的 v8 引擎,大幅提升了 JS 的性能。這時候還沒有大前端這一說法。

同年,基於 v8 引擎的 Node.js 出世,使得前端開發人員可以用 JS 編寫伺服器端代碼,接管渲染層,開啟了大前端的大門。不過 Node.js 在服務端使用真正被開發者接受是在 2012 到 2013 年左右,前後端分離開始變得流行,這時候的前端包括前端和渲染層。

再後來就是改變世界的移動時代的來臨,流量逐漸從 PC 分流到移動平台。Web 相比 Native,具有跨平台、開發成本低、周期短、發布周期短等優勢,在移動開發上贏得了不小的市場。這一時期出現了 Hybrid 混合開發 App,結合了 Web 和 Native,誰也沒能替代掉誰。

但是,Hybrid 畢竟也是 WebView,性能相比 Native App 依然存在不足,而在手機這樣小的螢幕上,用戶體驗尤其重要。想要 Native 般的體驗,又想要 Web 跨平台、動態發布等優點,並不容易,但辦法總是比困難多,React Native 的出現,將兩者的優點融合在一起。這個時候大前端的邊界再度擴大,涵蓋了前端、渲染層和端開發。

然後就是近兩年小程序和 Flutter 的流行,使得大前端的概念和範疇進一步鞏固。

這期間不斷湧現的新技術給前端開發者和前端團隊 Leader 帶來的困擾是:那麽多新框架、新技術、新編程語言,怎麽選?

盲目跟風不可取

最簡單的一種方式是互聯網大廠選什麽,跟著選就是了。這其實是在技術選型上偷懶,卻也是當前業界普遍存在的情況:很多公司在前沿技術方向上盲目跟風互聯網大廠,並沒有好好考慮這些技術方案是否真的適合自己。

比如,企業官網是不是應該用 MVVM 框架來做?彭星的答案是不應該,在他看來,企業官網需要 SEO,互動少,傳統的伺服器端渲染是最好的解決方法。雖然用 Node.js 做 React/Vue 的 SSR 也能解決 SEO 問題,但這其實是把簡單問題複雜化了,不僅費人費事還費財。

彭星認為,大廠在技術探索上投入很大的人力物力是有理由的,他們的業務模塊多且複雜,既需要保留解決方案的靈活性,也需要可維護性,但這些不應該是中小企業優先關注的問題。

彭星表示,互聯網大廠、傳統企業和中小型企業,在前端技術選型上應該有不同的側重點:

互聯網大廠,核心技術自研非常有必要,因為只有自己掌握核心技術才能不受人製約,所以大廠在技術探索上投入很大的人力物力。大廠的二級業務才會選擇使用內部自研的或者社區影響力大的技術方案。

傳統企業,需要結合自身企業類型來選擇前端技術方案。傳統企業往往需要承接各個平台過來的流量,載體一般是網站和小程序,小程序不用多說,網站還是主要看是否需要 SEO,是否便於在主流平台進行分享傳播,一般選擇後端直出的框架配合 jQuery 即可。

中小型企業,這類型的企業有一定的研發能力,業務類型多樣,以 Native App 和小程序居多,網站只是 App 引流工具或者活動頁面。Native 的解決方案取決於業務類型,只要不是非常複雜且對可靠性要求很高的應用, Flutter、RN 等跨平台方案是很好的選擇。

綜上所述,技術選型首先還是要參考業務需求,“同時也呼籲同行,不要為了達到一些目的而大肆鼓吹,這對相信你的開發者很不負責”,彭星進一步補充。

前端技術選型經驗小結

彭星畢業後在百度工作了 9 年,期間負責百度搜索團隊的前端技術,曾主導百度搜索前端的優化和重構工作;2020 年加入閱文集團負責創新中台團隊,團隊成員共有 50 多人,包含了前端、客戶端、服務端等不同角色,是名副其實的大前端 + 的團隊,集團的新產品都從這裡孵化。雖然新老東家的前端團隊規模、主要業務均有不同,關注的技術點也有差異,但在技術選型上卻有一點是相同的,那就是以實用為主。

彭星表示,閱文對於前端技術的關注點主要是實用,要能解決業務中的問題,同時要有技術架構上的靈活性,由於業務的複雜度不高,因此技術一般都是拿來直接用,比較方便;百度的體量更大,每個大的團隊關注點也會有一些區別,彭星之前所在的百度搜索團隊,對於前端的關注點同樣是實用為主,因為搜索系統龐大而複雜,也會關注前端技術能否解決大型系統中的組織結構靈活性和可維護性問題,同時還要求性能最好,一般很少直接使用業界的技術,而是吸收加以改善,再用到項目中。

彭星在做技術選型時一般會參照以下幾個步驟:

首先看自身的主要問題是什麽, 業務需要什麽;

再看業界有什麽解決方案,一定要結合自身業務的主要訴求;

方案決定後,選擇框架,選擇社區大而活躍的。

對於大前端領域現在很火的前沿技術,如 Vue、React、Flutter 這三大框架,以及Cookrless 等,前端團隊如何判斷這些技術是否適合自己?

彭星參照上述技術選型的幾個步驟給出了一些建議:

首先看業務的形態是什麽,後台管理系統、移動端網站、移動端 App 還是其他形態。

Vue/React 解決的問題類似,主要是富互動場景,比如管理系統,或者移動端 Web App。當然他們都可以作為 Hybrid 的前端框架繼承在 App 裡,如果是在 Vue 和 React 中挑一個的話,大型系統選擇 Angular,有潔癖選擇 React。Flutter 的選擇就很簡單了,移動端想跨端、節省人力、願意學 Dart 就可以,只是 iOS 上的動態更新要費點事。Flutter 現在最主要的競品其實是 React Native,RN 由於蘋果的那條傳言已久的禁令,受到的影響不小,如果擔心這個,可以不選 RN。

彭星坦言,過去一年Cookrless 概念的火爆有點超出自己的預期。

在我看來,Serverless 還早了點,再者,它解決的問題也不是前端圈子首先應該關注的問題,我也沒覺得現在運維成本有多高,反而從現在一個容器裡將業務拆成一個個函數的一次性成本有點高。

它在一定程度上會讓開發者對架構和代碼的控制力變弱,想做優化,想做改進,很難,你只能靠雲幫你做。還是那句話,選最合適的,而不是最好的,更不是最『流行』的。

對於未來,彭星持續看好前端和端融合的方向,他負責的團隊也會在這個方向上繼續投入人力。在他看來,前端和端融合帶來的收益是最直接和明顯的,人力投入能減少 50% 左右,非常可觀。

大會推薦

GMTC 全球大前端技術大會(北京站)2020 關注前端、移動、AI 應用等多個技術領域,聚焦前沿技術及實踐經驗,旨在幫助參會者了解大前端 & 移動開發領域的技術趨勢與實踐案例。大會目前 8 折優惠報名,限時立減 960 元!聯繫票務經理魚丸:13269078023(同微信)

獲得更多的PTT最新消息
按讚加入粉絲團