web開發(fā)早期
在web開發(fā)的早期時代(據(jù)史書記載,那段不堪回首的歲月被稱之為web1.0時代
(╯▽╰)),開發(fā)過程十分的簡單明快,構建web應用的大致過程就是,瀏覽器向服務器端發(fā)送請求,然后由服務器端響應請求并返回頁面內容,基本可以概括為:朕(服務器)給你(瀏覽器)的是你的,朕不給你的你不能搶。
這種模式下開發(fā)者無需關心瀏覽器端發(fā)生了什么,通常5個人以內,不分前后端就可以close掉一個小項目,當然是在業(yè)務不太復雜的情況下。然而業(yè)務往往是會變復雜滴(個人感覺這和熵增原理存在著某些必然聯(lián)系(¬_¬)),當業(yè)務變得復雜時,很多開心的事就會發(fā)僧了,Because往往業(yè)務一復雜,人就得多,人一多,花樣就多,花樣一多,維護的成本就會變大...
還有一個就是用戶體驗問題,在這種模式下很難打造出極佳的用戶體驗,因為無論用戶想做點什么,都需要向服務器發(fā)請求,并等待服務器端的響應,這會導致用戶失去在頁面上所積累的狀態(tài)。畢竟我們是服務行業(yè),服務行業(yè)的主旨是什么?——客戶就是上帝。上帝要是不開心了,你還想不想吃小饅頭了。因此為了小饅頭,,,Σ( ° △ °|||)︴,,,啊呸,不對,是為了更好的用戶體驗!!人們開始開發(fā)類庫。
類庫
為了更好的用戶體驗,人們開始開發(fā)類庫,使用JavaScript在瀏覽器端渲染應用。這些類庫使用的方法也不盡相同,簡單的使用帶參數(shù)的模板,復雜的就完全掌控整個應用。隨著開發(fā)者在越來越大的項目中使用這些類庫,應用也變得越來越難以把握,因為這些應用是一系列相互作用的結果。
React簡介
React 是一個 Facebook 和 Instagram 用來創(chuàng)建用戶界面的 JavaScript 庫。發(fā)源自FaceBook的PHP框架XHP的一個分支,XHP作為一個PHP框架,其主旨在于每次有請求進來時渲染整個頁面。React的產生是為了把這種重新渲染整個頁面的PHP式工作流帶到客戶端應用中來。
React本質上是一個“狀態(tài)機”,可以幫助開發(fā)者管理復雜的隨著時間而變化的狀態(tài)。它以一種精簡的模型實現(xiàn)了這一點。React只關心兩件事:
- 最小化重繪DOM
- 單事件處理器
最小化重繪DOM
React不處理Ajax,路由和數(shù)據(jù)存儲,也不規(guī)定數(shù)據(jù)的組織方式。如果非要問它是什么,我們可以把它看做MVC里的“V”。React的精簡允許你將其集成到各種各樣的系統(tǒng)中。我們幾道,在頁面渲染過程中,頻繁的操作DOM元素,會導嚴重影響頁面性能。而React通過一個虛擬的DOM實現(xiàn)了一個非常強大的渲染系統(tǒng),在React中可以做到對DOM的最小化重繪(_( ?Д?)?江湖傳言可以做到只更新不讀取...)。
React把視圖更新簡化為一個render函數(shù),render函數(shù)只關心兩個參數(shù),分別是配置項和狀態(tài)。render函數(shù)讀入當前狀態(tài),并返回一個快速的DOM描述。只要React被告知狀態(tài)有變化,其會重新運行函數(shù),計算出新的DOM描述,然后判斷差異后,進行最少的必要更新。
單事件處理器
在web開發(fā)過程當中,過多的事件處理器會增大程序的開銷,影響應用的性能。通常我們會使用事件委托來減少事件處理器的數(shù)量。而React在整個應用中只使用單個的事件處理器,并且會把所有的事件委托到這個事件處理器上,這一點也大大提升了React的性能。
參考
【1】《React引領未來的用戶界面開發(fā)框架》
【2】Web 研發(fā)模式演變
【3】為什么使用 React?