摘要:純前端開發(fā)主要是針對靜態(tài)頁面。自主權最大,正常是使用進行輔助開發(fā),上線等。大致原因使用是為了和端的保持同步。四總結對于比較正式的項目,前端技術選型策略一定是產品收益最大化,用戶在首位。
對于前端團隊,可以實現(xiàn)企業(yè)受益最大化要點。
一、技術選型的策略1、保證產品質量
(1)功能穩(wěn)?。壕W(wǎng)頁不白屏,不錯位,不卡死;操作正常;數(shù)據(jù)精準。
(2)體驗優(yōu)秀:加載體驗,交互體驗,視覺體驗,無障礙訪問。
2、降低人力成本
(1)降低前期開發(fā)成本;
(2)降低后期維護成本。
二、前端開發(fā)模式選擇開發(fā)模式:1、純前端開發(fā);2、前后端分離開發(fā);3、后端主導的開發(fā)。
1、純前端開發(fā)
主要是針對靜態(tài)頁面。沒有模板和框架參與,基本上一個人就可以hold住,比如:官方網(wǎng)站,招聘站,以及設計感強烈且運營活動頁面等。自主權最大,正常是使用nodejs進行輔助開發(fā),上線等。
2、前后端分離開發(fā)
現(xiàn)在很多公司的系統(tǒng)都是采用前后端分離的開發(fā)模式。根據(jù)項目的性質,使用nodejs進行模板渲染(ejs模板,jade模板,dot模板,artTemplate模板),要不是框架自帶的渲染的方式(vue,react),但是實質上一樣的,都是使用js對頁面進行構建??刂茩嗪艽?。
3、后端主導開發(fā)
由于很多歷史遺留問題,有的產品還是采用后盾渲染的開發(fā)模式,比如一些內部行政系統(tǒng)相關的。在和他們合作的時候,交付原型的時候,需要克制自己:
(1)不要使用sass,less產不多的前端預處理器;
(2)不使用類似于seajs之類的模塊化組件庫,而是采用效率更低的人工模塊耦合;
(3)不追求新技術,使用更基礎代碼,采用更傳統(tǒng)首發(fā),良好的代碼設計保證質量【參數(shù)接口暴露在外,后端可以輕松配置,而不是耦合在js中】。
這種前端屬于支援角色,后期維護通常都是與后端開發(fā)一起維護。這就是有時候會出現(xiàn)維護很痛苦的問題。
缺點:增加開發(fā)人力成本;
優(yōu)點:自我犧牲保證項目正常維護下去,職業(yè)的體現(xiàn)。
三、前端開發(fā)技術選型對于同一個類型的項目,采用開發(fā)模式,使用的基本框架都是一致的。
前端技術選型:
(1)外部用戶的PC站;
(2)外部用戶的mobile站;
(3)外部用戶的Native App開發(fā);
(4)內部員工的管理后臺
1、外部用戶的PC站需要有SEO,有加載體驗,采用的是前后端分離開發(fā)模式,頁面直接渲染,基于jquery。
為什么使用jquery?
(1)主要是為了兼容IE8;
(2)是外部用戶,視覺體驗高,權重高。適合先有行,再有行。就是說視覺和行為要盡可能分離,會犧牲一點開發(fā)成本,但是用戶更重要。
(3)絕大多數(shù)頁面交互輕量用不上數(shù)據(jù)驅動。
2、外部用戶的Mobile站這里說的Mobile站主要是瀏覽器訪問為主的,因此,頁面切換都是傳統(tǒng)連接跳轉,屬于傳統(tǒng)web應用,前后端分離開發(fā)模式,頁面直接渲染,采用react。大致原因:使用react 是為了 和APP端的react native保持同步。
3、外部用戶的Native App開發(fā)前端組有直接參與 Native APP 開發(fā)的項目,使用的是 React Native 進行開發(fā)。
為啥選擇RN,之前Hybrid模式開發(fā)有性能優(yōu)化瓶頸,采用React Native性能可以突破這個瓶頸,有原生的性能,且支持熱更新,上手不算太難,跨平臺,IOS和android代碼復用率90%。適合交互和動畫不太復雜的項目,最終要根據(jù)項目來。特別適合快速迭代的項目或者前期需要大量試錯的項目。
(1)不要隨意使用第三方庫,后期修改維護不方便,盡量自己寫還是自己寫;
(2)前期還是需要客戶端幫忙配合,項目搭建。
4、內部員工的管理后臺前后端分離開發(fā),頁面?zhèn)戎禺惒戒秩?,使用vuejs。
大致內容是:后臺管理系統(tǒng)有大量的增刪改查操作,適合具有雙向綁定的類庫或者框架進行渲染。同時沒有兼容性的要求(SEO,首屏渲染),因此單頁面是合適的??梢赃x擇vue,react,angular。因為vue對api,文檔對開發(fā)者更友好。選用好的UI組件,規(guī)范貫徹,拆分和按需加載,自動化測試有待加強。
四、總結對于比較正式的項目,前端技術選型策略一定是產品收益最大化,用戶在首位??紤]到億級的用戶量,自然技術選型更為謹慎,于是優(yōu)先選成熟,經(jīng)典的解決方案。
但是不是說,排斥熱門技術。相反,就算還是很不成熟的新技術,只要對產品帶來收益的,一定要鼓勵應用的,比如AMP和PWA的實踐。
其實這時候也會帶來一個問題,技術人員對新技術有著天然的學習和實踐需求,因為這有助于降低內心的焦慮和不安全感。
尤其是對技術有著狂熱的愛好的小伙伴,這些成熟項目由于規(guī)范約束,不能隨便亂來,很容易讓開發(fā)人員報國無門的感覺,這該如何達到心理的平衡?
通過邊緣項目,實踐性的項目,以及團隊會自發(fā)發(fā)起一些有價值的內部項目來滿足這樣的需求,同時積累寶貴的經(jīng)驗。相當于嵌入了新的平臺,讓產品,團隊和個人都達到非常好的平衡。
產品驅動的文化下,心中想的更多是把用戶和產品做更好,讓技術服務產品,因產品而技術,而非因技術而技術。
運營驅動的文化下,本質上是吆喝做買賣,成為前言技術的弄潮兒就是和企業(yè)文化的契合。
【注:我是saucxs,也叫songEagle,松寶寫代碼,文章首發(fā)于sau交流學習社區(qū)https://www.mwcxs.top),關注我們每天閱讀更多精彩內容】
文章版權歸作者所有,未經(jīng)允許請勿轉載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉載請注明本文地址:http://m.hztianpu.com/yun/104866.html
摘要:而利用進一步提高了序列化速度,降低了數(shù)據(jù)包大小。帶來的最大好處是精簡請求響應內容,不會出現(xiàn)冗余字段,前端可以決定后端返回什么數(shù)據(jù)。再次強調,相比和,是由前端決定返回結果的反模式。請求者可以自定義返回格式,某些程度上可以減少前后端聯(lián)調成本。 1 引言 每當項目進入聯(lián)調階段,或者提前約定接口時,前后端就會聚在一起熱火朝天的討論起來??赡?99% 的場景都在約定 Http 接口,討論 URL...
摘要:三性能優(yōu)化處理做工具類的項目,性能是非常大的挑戰(zhàn),我總結了以下幾個常見的性能優(yōu)化點數(shù)據(jù)緩存。防抖,節(jié)流,事件委托內存釋放。 內容大綱: 1、功能介紹 2、技術架構 3、性能優(yōu)化 4、細節(jié)分享 5、開源說明 一、項目功能介紹 很久沒寫過技術類的文章了,這次給大家分享一個近期的項目,采用react+mobx+jquery構建的大型工具類項目。查看項目網(wǎng)址。 如果用過易企秀,maka或者...
摘要:三性能優(yōu)化處理做工具類的項目,性能是非常大的挑戰(zhàn),我總結了以下幾個常見的性能優(yōu)化點數(shù)據(jù)緩存。防抖,節(jié)流,事件委托內存釋放。 內容大綱: 1、功能介紹 2、技術架構 3、性能優(yōu)化 4、細節(jié)分享 5、開源說明 一、項目功能介紹 很久沒寫過技術類的文章了,這次給大家分享一個近期的項目,采用react+mobx+jquery構建的大型工具類項目。查看項目網(wǎng)址。 如果用過易企秀,maka或者...
摘要:作者兩年經(jīng)驗第一家任職的是個小公司第二家算是二線互聯(lián)網(wǎng)公司各待了一年吧能有機會去阿里面試很驚喜先來和大家分享一下面試經(jīng)歷電話面試初探因為還在職的緣故電話面試從晚上點鐘開始持續(xù)了半個小時左右一開始的時候特比緊張甚至聲音略有些顫抖簡單自我介紹做 作者兩年經(jīng)驗, 第一家任職的是個小公司, 第二家算是二線互聯(lián)網(wǎng)公司, 各待了一年吧... 能有機會去阿里面試很驚喜! 先來和大家分享一下面試經(jīng)歷....
閱讀 1310·2021-11-22 13:54
閱讀 1517·2021-11-22 09:34
閱讀 2792·2021-11-22 09:34
閱讀 4185·2021-10-13 09:39
閱讀 3410·2019-08-26 11:52
閱讀 3419·2019-08-26 11:50
閱讀 1593·2019-08-26 10:56
閱讀 2002·2019-08-26 10:44