摘要:控制數據流屬于最強的開發規范,必定會給開發業務的同學帶來巨大的思維挑戰,從系統整體質量和維護性來看,必須犧牲業務開發的編程自由度。
引入的背景
在一個龐大的商業系統中引入react這種數據驅動的模式。
希望能夠一點點重構去替換以前的模塊,逐步的將系統重要部分底層框架替換成react。
以下內容都摘自同事使用后的一些感想
心得一
從過程化開發向面向數據的開發轉化。后者要求開發者對數據結構和算法和業務需求本身要有理解。React開發的核心是設計一套數據結構使其既方便業務用戶界面的展示又能方便的實現業務功能——表現為一組操作數據結構的算法。這與傳統的前端開發很不一樣,偏激一點的說,相比以前用$搬弄DOM節點,我覺得這樣的前端開發更“嚴肅”了。我希望能夠推動團隊迎接,適應,實現這個變化,這對于一個技術人員,而不僅僅是前端技術人員都是有益的。
心得二
1.React單向數據流原則是核心中的核心,即整個系統中只存在自上至下的數據流,反向數據流通過綁定自動完成,不存在兄弟間橫向數據流。
2.控制數據流屬于最強的開發規范,必定會給開發業務的同學帶來巨大的思維挑戰,從系統整體質量和維護性來看,必須犧牲業務開發的編程自由度。目前就是自由度太高,導致出現五花八門的業務實現,代碼根本沒法看。
心得三
其實之前我們也是數據驅動視圖的,生命周期時用初始化數據渲染了視圖,自然這時有了一層數據到視圖的映射邏輯關系。數據改變之后綁定視圖映射關系會寫在model onchange handler中。
這樣會有一些問題:
1.數據到設圖的映射邏輯關系可能寫了兩遍,而且會發散在template, action, view等各個地方
2.初始化時數據和視圖的關系是同步的,但是初始化之后這兩者就可能就不一致,很可能handler沒寫用jquery直接操作DOM了。
初級階段覺得React的好處是,把映射關系收斂到render方法中,有一層封裝讓我們直接操作DOM變得更難。數據如果在任何時候都能表達視圖,是有很多事情可以想象的。
心得四
react引入的意義 活力我們需要在React方面思考的技術問題,有下面這些點:
UI組件應當有穩定一致的開發規范。
UI組件應當有充分的UT 。(并嘗試是否可以為業務組件加UT)
UI組件乃至業務組件內的數據結構是否應該有一個統一的模式(如immutable或者更輕量的模式),使得對于數據結構的任意位置的修改,都可以有事件冒出做一些統一的處理。
多個兄弟的組件之間的通信有什么范式?
父子組件之間雙向通信有什么范式?
目前實現了ER-React,即一個React模塊對外表現為一個ER模塊。未來在此基礎上,將一個ER-React模塊的父模塊實現為React后,是要脫掉ER-React的ER,變為React-React呢?還是實現為React-ER-React呢?
按照React的開發模式,隨著我們自下而上的重構業務,很自然的,下面的組件的“Model”部分會逐漸“上浮“與上層的組件的Model合并成為一個更大的Model。如此往復,我們自然會形成“整個應用只有一個大Model”的局面。我們需要在這一切發生之前想明白這個“大Model”內部要如何組織,會以何種形式存在,并以何種形式和各個組件交互。
類似,從View的角度看,我們最終會形成“整個應用就是一個大的React組件”。對于每一個業務動作,整個應用都會重新render。這個render的性能遲早我們需要關心。如何控制這個render的性能使之不會影響用戶體驗?
引入后我覺得最重要的成就就是讓一個系統擁有升級換代的活力。就像注入新鮮血液一樣,系統能夠跟上時代的變化。
對于一個龐大的商業系統而言,系統底層的穩定性是一個很重要的點。不過如果能在在系統上面做一些侵入性的改造,讓一個穩定的系統充滿活力還是很有意義的。
首先對于業務開發人員,很明顯,他們在原有系統上面開發了這么久以后,對于新技術的引入是非常歡迎的,他們是非常樂意去學習新技術的。
提高開發效率這個是寫給老板們看的,花這么大力氣去引入一個新技術對于公司的收益就是提高開發人員的效率。
當然這個提高的效率的前提是對于開發人員有更高的要求的。
提高系統的健壯性react的模式是可以在某種程度上面融入UT的。
以及一個很好的數據驅動模式維護性和擴展性是比現有系統強的。
數據驅動好處就是可以通過數據記錄用戶的頁面狀態,用數據就能恢復頁面快照,需要分析用戶行為,只需要收集到頁面的數據變化流即可。
react引入的挑戰數據驅動最合適的是從根部重構。但是目前我們只能從葉子模塊一點點往根部重構。其實是一個反向過程。
數據驅動模式對于開發人員要求比較高,能不能設計一種模式降低要求,避免出現不同水平的開發者開發出層次不齊的業務模塊。
引入新的模式一個缺點就是以前模式成為了技術債務。因為一個系統存在多種模式,意味著新人學習成本會增加很多。多種模式的共存,如果維護不好,也會出現一種很混亂的現象。
微信公眾號ps:重要開通了微信的打賞功能,大家覺得好的話,去捧個場。。。奉旨打賞^_^
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/78771.html
摘要:適當引導面試官。如果有機會來實習,如何最有效的快速成長淘寶技術部前端內部有針對新同學的前端夜校,有專門的老師授課。 阿里巴巴2019前端實習生招聘還剩最后兩周,面向2019年11月1日至2020年10月31日之間畢業的同學,在這里分享下阿里前端面試考核的關鍵點: Q:在面試過程中,前端面試官如何考核面試者?A:會看同學為什么選擇前端行業?是因為算法太難?Java、C++太難?還是因為熱...
摘要:有贊全鏈路壓測方案設計與實施詳解有贊在雙十一之前完成了全鏈路壓測方案,并把它用于大促的擴容和容量驗證,取得錯的成果。實現外部系統與蘇寧的完美對接,使業務的處理更加高效便捷。 推薦 1. Preact:一個備胎的自我修養 https://zhuanlan.zhihu.com/p/... 前一段時間由于React Licence的問題,團隊內部積極的探索React的替代方案,同時考慮到之后...
閱讀 2882·2021-11-22 09:34
閱讀 1211·2021-11-19 09:40
閱讀 3335·2021-10-14 09:43
閱讀 3566·2021-09-23 11:22
閱讀 1601·2021-08-31 09:39
閱讀 880·2019-08-30 15:55
閱讀 1414·2019-08-30 15:54
閱讀 854·2019-08-30 15:53