以銅為鏡，可以正衣冠;以古為鏡，可以知興替;以人為鏡，可以明得失。了解前端技術的歷史，可以幫助我們更清晰地了解這個行業的未來!

　　一、冷兵器時代

　　在很久很久以前的公元1993年，位于美國的伊利諾州誕生了一位名為NCSAMosaic的孩子。它便是傳說中的微軟IE、網景以及后續眾多網頁瀏覽器的鼻祖。可惜在當時只有少數的幸運兒才可以使用它。

　　它的初始作用，是為了方便科學家看文檔、傳論文。所以，到今天為止，學習前端的人在接觸 HTML 的時候，都會記得它的第一句有個詞是 Document。

　　次年的1994年，網景公司打造了一款名為Navigator 0.9版的瀏覽器，該產品在當時也算是轟動一時，即使該版本瀏覽器僅僅可以用于瀏覽而已，并不具備與訪問者溝通互動的能力。所以網景公司急需一種網頁腳本語言，可以使得瀏覽器與網頁互動。

　　同年，網景公司的一名叫Brendan Eich的員工，歷經10天打磨出了一款名為JavaScript的產品。據說Brendan Eich一點也不喜歡自己的這個作品。可能是他當時就已預料到JavaScript在后面相當長的一段時間中所寫出來的程序均是混亂不堪的。不過不管怎樣，瀏覽器通過JavaScript終于可以與網頁互動了。

　　那時候的互聯網開發者還被統稱為程序員。在那個年代，前后端開發是一體的，還并未分家。前端代碼只是后端代碼的一部分而已：后端接到瀏覽器的請求 => 生成靜態頁面 => 郵寄給瀏覽器。

　　當時用戶的感受：

　　提交完一個表單，瀏覽器要白屏等待許久，最后還有可能給你返回個 “用戶名錯誤”;

　　假如你有一萬篇文章，那么你要寫一萬個靜態頁面……

　　二、熱兵器時代

　　一切都要從PHP、ASP、JSP的出現開始說起，自從它們的出現才有了將數據嵌入到 HTML 中的形式，這也意味著互聯網行業正式告別了冷兵器時代，朝著熱兵器時代快速發展。

　　此時的互聯網興起了一種MVC的開發模式：

　　Model(模型層)：提供/保存數據。

　　Controller(控制層)：數據處理，實現業務邏輯。

　　View(視圖層)：展示數據，提供用戶界面。

　　在此時，前端只是 MVC 中的 V而已，可能是因為當時負責V的開發人員是所有程序員中工資偏低的，所以都喜歡稱自己為"切圖仔”。沒錯，"切圖仔”便是前端開發工程師的前身。

　　隨著時間的不斷推移，后端的工作量越來越重，無暇顧及頁面的長相問題，于是乎“切圖仔”又多了一項任務：切完圖之后，負責編寫頁面樣式，方便后端替換變量及渲染頁面。

　　……

　　自Ajax逐漸被使用到各個頁面上，也宣告了熱兵器時代巔峰的到來。此時的前端也不再只是后端的模板，它可以獨立得到并處理各種數據，也就在此時“切圖仔”們增加了一些JS的開發任務，朝著前端的道路又邁進了一步。

　　在這個時代有一位不得不提的大哥級人物： jQuery。其最擅長的功夫是操作DOM。由于在其麾下擁有著一套十分龐大的插件生態系統，使得其快速風靡了全球，并霸占JS 庫一哥的地位許久。即使至了今天，江湖上依然還存在著這位大哥的蹤跡及傳說。

　　三、核武器時代

　　伴隨著信息時代、大數據時代的到來，jQuery 在處理大量數據操作時，已經明顯力不從心了!但，web開疆拓土的步伐從未停歇過：

　　2008 年，谷歌 V8 引擎發布，終結了微軟 IE 的壟斷時代。

　　2009 年 AngularJS 誕生(隨后被谷歌收購)。

　　2009 年 Node誕生，它使 JS 在服務端語言中也有了一席之地。

　　2011 年 React 誕生。

　　2014 年 Vue.js 誕生。

　　2015 年 標準組織發布了ECMAScript 2015(ES6)

　　2017 年 微信小程序正式上線。

　　伴隨著Angular、React、Vue 等前端架構以及 Webpack的出現，使得前端一個人能夠完成的事越來越多。自此前后端分離可謂大勢所趨。

　　如今，后端負責數據，前端負責其余工作越發明顯化。它們之間的通訊，只需要后端暴露 RESTful 接口，前端通過 Ajax，以 HTTP 協議與后端通信即可。

　　此時，手機端的發展也是不可小覷的：

　　2007 年第一代 iPhone 發布。

　　2008 年第一臺安卓手機發布。

　　......

　　悄然間互聯網進入了移動時代。移動端的發展進程和PC的歷史如出一轍，一開始都是Native App的天下。但瀏覽器試圖取代操作系統的篡位之心從未消減。

　　相比原生應用，Web APP有太多好處：無須開發兩套系統版本、無須安裝、無須手動升級、無須審核……我認為最大的好處以及驅動軟件形態轉向的主要原因在于降低成本。

　　記得13年的時候韓寒說做一個APP大概需要五十萬，今天網上比較靠譜的分析評估半年時間從零做出一個稍微像樣的APP至少100萬，而開發Web App花的錢一定少得多。

　　制約Web App的因素有很多，但我們可以看到Web App一直在不斷修復缺陷、突破局限。

　　你說網頁有tab bar，好吧，給你個fullpage API。

　　你說網頁不能調取系統功能，好吧，Geolocation API、Vibration API、Luminosity API、Orientation API、Camera API……

　　你說網頁不像APP有圖標，IOS早就支持在桌面上添加網頁鏈接的快捷圖標，還得是喬幫主遠見;

　　你說網頁必須聯網，現在離線的方案也很多啊;

　　你說Web App性能差，這個……你說得對，也就是這個原因，Native App還能作為主流存在一段時間，可是如果Web App的性能逐漸趕上Native了呢?目前的Hybrid、nw.js、Electron、react native、weex等都可以看做Web App在性能方面向Native靠近的嘗試。更何況半路又殺出個微信小程序。

　　所以，前端未來可期……