1990年，首個(gè)web瀏覽器誕生，前端技術(shù)迎來(lái)發(fā)展；經(jīng)過(guò)20年的發(fā)展：純靜態(tài)頁(yè)面→JavaScript→小程序開(kāi)發(fā)。

?

　　1.洪荒時(shí)代（1990-1994）

　?、賥ww：（Tim Lee），共享和傳遞信息，純靜態(tài)頁(yè)面。

　?、跒g覽器：（網(wǎng)景），PHP誕生使得HTML中能嵌入動(dòng)態(tài)內(nèi)容。

　?、跩avaScript：（Brendan Eich），完善語(yǔ)言，提高性能。

　　2.瀏覽器大戰(zhàn)（1994-2005）

　?、買E vs 網(wǎng)景；②IE vs 火狐；③IE vs 谷歌； 利用UA標(biāo)記（Navigator.userAgent）；解決瀏覽器兼容性問(wèn)題。

　　3.Prototype時(shí)期（2005~2009）

　　①Prototype機(jī)制：（Sam Stephenson），解決動(dòng)畫特效與Ajax請(qǐng)求問(wèn)題，讓用戶更好的使用JavaScript基礎(chǔ)類庫(kù)。

　?、诔绦蛟抽_(kāi)發(fā)模式：選擇核心庫(kù)［封裝類］→傳入DOM→類方法操作DOM→找插件→扒腳本代碼→后端打包。

　　4.jQuery 時(shí)期（2009~2012）

　　jQuery的普及降低了前端開(kāi)發(fā)的門檻，更加方便的插件和UI庫(kù)，如Zepto.js，步入移動(dòng)互聯(lián)網(wǎng)時(shí)代。

　?、賘Query：輕量級(jí)，改善DOM/ BOM 兼容性，選擇多個(gè)DOM 作為對(duì)象→鏈?zhǔn)讲僮鳌?/p>

　　②前后端分離：jQuery只占用兩個(gè)全局變量，不污染Object原型對(duì)象和window全局變量。

　　為解決Ajax出現(xiàn)依賴時(shí)的回調(diào)地獄問(wèn)題，提出了Deffered與Promise。

　　5.后jQuery時(shí)期（2012~2016）

　?、賀equireJS：定義AMD規(guī)范模塊［js/lib/module. js ：］；支持各種插件，shim機(jī)制可加載其他JS代碼。

　　統(tǒng)一異步機(jī)制：前端模板［HTML=template（vars）］；前端路由；SPA。

　?、?a href='http://www.delux-kingway.cn/tags/node.js/' target='_blank' class='arckwlink_none'>Node.js：（Ryan Dahl），前端模塊的定義、加載、打包；包括豐富的模塊、路由、狀態(tài)管理、數(shù)據(jù)庫(kù)、MVC框架。

　?、跰VC框架：Backbone.js；

　?、躆VVM框架：比MVC多一個(gè)數(shù)據(jù)綁定功能。

　?。?）Angular（谷歌）：將函數(shù)體轉(zhuǎn)譯成setter（）、getter（）函數(shù)。

　?。?）Knockout.js（微軟）：使用函數(shù)代替屬性的技巧實(shí)現(xiàn)，它的設(shè)計(jì)影響到后來(lái)的Mobx。

　?。?）Ember.js（蘋果）：基于Object.defineProperty。

　　大公司開(kāi)發(fā)：劃歸陣營(yíng)，基于CLI （用Node.js開(kāi)發(fā)） 的項(xiàng)目開(kāi)發(fā)，利用jQuery插件模塊實(shí)現(xiàn)功能，加Script標(biāo)簽。

　　CLI： 包含腳手架生成、 打包腳本、語(yǔ)法風(fēng)格檢測(cè)、環(huán)境變量插入、代碼復(fù)雜度檢測(cè)、單元測(cè)試、 圖片壓縮等。

　　前端分化：①做后端：CNode門戶網(wǎng)站；②自動(dòng)化構(gòu)建工具：Gulp、webpack、npm-script、Grunt、FIS3、Rollup。

　　6.三大框架割據(jù)時(shí)代（2016~至今）

　?、賀eact 框架：JSX開(kāi)發(fā)界面、虛擬DOM技術(shù)、基于原生/Hybird的安卓/iOS類APP開(kāi)發(fā)、React Native （Facebook）；

　　狀態(tài)管理器、CSS-in-JS、Flow靜態(tài)類型檢查、devTool、Fetch、前后端同構(gòu)、Fiber、suspend、并發(fā)渲染；

　　復(fù)用功能：類繼承，npm，Less、Sass、PostCSS與CSS Modules等；

　　②Angular框架：將Script、Style、Template進(jìn)行融合設(shè)計(jì)，創(chuàng)造Web Components瀏覽器自定義組件技術(shù)。ionic框架

　　③Vue. js 框架：留美華人創(chuàng)造，國(guó)人擁護(hù)。Weex框架（阿里巴巴）