前端激盪三十年(一本最詳細的編年史冊)

前端,由瀏覽器誕生的那一刻便隨之而生,通過不斷的探索如何將複雜晦澀的底層數據以人能更好理解的形式展現出去,從開始時的能用到好用,從單調到炫彩,用戶體驗愈來愈被重視,前端做爲計算機層面與用戶最近的一層必須去變革與發展。javascript


接下來從三十年前,HTML提出的那一天開始看起,看看這三十年前端經歷了哪些變革與發展才走到了今天這樣一個豐富多彩的樣子。html


  1. 1989年,伯納斯-李在一份備忘錄中提出一個基於互聯網的超文本系統,而且記錄到在1990年末寫出瀏覽器和服務器軟件。同年,伯納斯-李與CERN的數據系統工程師羅伯特·卡里奧聯合爲項目申請資助,但未被CERN(歐洲核子研究中心)正式批准,可見偉大的第一步並無那麼一路順風。前端

  2. 1990年發明了首個以超文本語言 HTML 爲基礎在 NeXT 電腦上發明了最原始的 Web 瀏覽器網頁瀏覽器WorldWideWeb,也稱之爲「所見即所得」瀏覽器。java

  3. 1991年末,HTML這一詞的首個公開描述出現於一個名爲「HTML標籤」的文件中,由伯納斯-李於說起,這時候的HTML一共有18個元素,設計的相對比較簡單。react

  4. 1992年6月,HTML DTD的首個非正式草案被提出, 後續有七個修訂版(7月15日,8月6日,8月18日,11月17日,11月19日,11月20日,11月22日),其中在11月HTML DTD 1.1被定爲初步草案,可是並不是正式草案。程序員

  5. 1993年中期互聯網工程任務組(IETF)發佈首個HTML規範的提案:「超文本標記語言(HTML)」互聯網草案。美國國家超算應用中心(National Center for Supercomputer Applications)以HTML爲基礎開發了名爲 Mosaic 的瀏覽器,於 1993 年 4 月發佈。數據庫



  6. 1994年7月 HTML 2.0 規範發佈,9 月,因特網工程任務組(Internet Engineering Task Force)設立了 HTML 工做組。11 月,Mosaic 瀏覽器的開發人員發佈了 Mosaic Netscape 1.0 beta 瀏覽器,後更名爲 Navigator。年末,由 Tim 牽頭的萬維網聯盟(W3C)成立,這標誌着萬維網的正式誕生。 此時的網頁以 HTML 爲主,是純靜態的網頁,網頁是「只讀」的,信息流只能經過服務器到客戶端單向流通,由此世界進入了 Web 1.0 時代。而且CSS也開始走進人們,CSS的最初建議由哈坤·利在芝加哥的一次會議上第一次提出了CSS的建議。同在今年「世界上最好的語言」PHP也出現了,起初一個叫Rasmus Lerdorf的加拿大人爲了維護我的網站而建立了PHP。PHP原意是Personal Home Page,宣傳語是Hypertext Preprocessor(超文本處理者)。這時PHP實現了與數據庫的交互以及用於生產動態頁面的模板引擎,是Web領域中最主流的服務端語言。npm

  7. 1995年,是前端技術發展最迅猛的一年,從CSS到javascript都涌向出來。後端

網景推出了一直被延續至今的JavaScript,實現了客戶端具有了計算的能力。起初這種腳本語言叫作 Mocha,後更名 LiveScript,後來爲了藉助 Java 語言創造良好的營銷效果最終更名爲 JavaScript。網景公司把這種腳本語言嵌入到了 Navigator 2.0 之中,使其能在瀏覽器中運行。瀏覽器

今年在W3C會議上CSS又一次被提出,CSS的創做成員所有成爲了W3C的工做小組而且盡心盡力負責研發CSS標準,層疊樣式表的開發終於走上正軌,哈坤、波斯和其餘一些人是這個項目的主要技術負責人。

HTML 3.0被提議做爲IETF的標準,但直到提案在五個月過時後仍沒有進一步的行動。它包含許多拉格特HTML+提案的功能,如對錶格的支持、圍繞數據的文本流和複雜的數學公式的顯示。W3C開始開發本身的Arena瀏覽器做爲HTML 3和層疊樣式表的試驗檯,但HTML 3.0並無得到成功。

  1. 1996年3月,Navigator 2.0內置了JavaScript 1.0,微軟也發佈了 VBScript 和 JScript。JScript 是對 JavaScript 進行逆向工程的實現,並內置於 Internet Explorer 3 中。可是 JavaScript 與 JScript 兩種語言的實現存在差異,這致使了程序員開發的網頁不能同時兼容 Navigator 和 Internet Explorer 瀏覽器。Internet Explorer 開始搶奪 Netscape 的市場份額,這致使了第一次瀏覽器戰爭。12月, W3C 推出了 CSS 1.0 規範,CSS(層疊樣式表)的第一份正式標準(

    Cascading style Sheets Level 1
    )完成,成爲w3c的推薦標準。

  2. 1997 年 6 月,ECMA 以 JavaScript 語言爲基礎制定了 ECMAScript 標準規範 ECMA-262。JavaScript 是 ECMAScript 規範最著名的實現之一,除此以外,ActionScript 和 JScript 也都是 ECMAScript 規範的實現語言。自此,瀏覽器廠商都開始逐步實現 ECMAScript 規範。HTML 4.0做爲W3C推薦標準發佈。

  3. 1998年5月,CSS推出了第二版規範。6 月,ECMAScript 2 規範發佈,並經過 ISO 生成了正式的國際標準 ISO/IEC 16262 。



  4. 1999 年 12 月,ECMAScript 3 規範發佈,在此後的十年間,ECMAScript 規範基本沒有發生變更。 ECMAScript 3 成爲當今主流瀏覽器最普遍使用和實現的語言規範基礎。同年AJAX開始進入失業,微軟推出用於異步數據傳輸的 ActiveX,隨即各大瀏覽器廠商模仿實現了 XMLHttpRequest。動態網頁技術JSP由 Sun 公司倡導和許多公司參與,旨在建立一種使軟件開發者能夠響應客戶端請求,從而動態生成 HTML、XML 或其餘格式文檔的 Web 網頁的技術標準,此時的JSP 技術是以 Java 後端語言爲基礎的。

  5. 2000年 W3C 採用了一個大膽的計劃,把 XML 引入 HTML,XHTML1.0 做爲 W3C 推薦標準發佈,開始定義了JSON格式數據,至此先後端的數據交換能夠再也不使用冗餘信息較多並且還須要來回解析的XML,轉而使用JavaScript原生就支持的JSON格式數據。

  6. 2001年,W3C 推出了 CSS 3.0 規範草案。

  7. 2002年,Mozilla項目發佈了它的瀏覽器的初版,後來起名爲Firefox,也就是咱們如今使用的獲取瀏覽器。

  8. 2003年,蘋果公司也當即進入瀏覽器市場,快速研發併發布了Safari瀏覽器的初版。



  9. 2005年初,Ajax(異步JSON和XML)技術開始被大量的使用起來,網站局部數據操做獲得實現,Web世界又往前邁進了一大步。

  10. 2006年,一代王者JQuery誕生了,John Resig發佈了JQuery工具庫的第一個版本,這個工具庫一經出世就風靡全球,一直持續到如今,是前端史上最成功的JS庫。與2000被W3C標準提出的 XHTML 2.0 最終放棄了,看起來權威機構的標準也不是那麼有力。

  11. 2007年10月,ECMAScript 4.0版草案發布,對3.0版作了大幅升級,預計次年8月發佈正式版本。草案發布後,因爲4.0版的目標過於激進,各方對因而否經過這個標準,發生了嚴重分歧。以Yahoo、Microsoft、Google爲首的大公司,反對JavaScript的大幅升級,主張小幅改動;以JavaScript創造者Brendan Eich爲首的Mozilla公司,則堅持當前的草案。

  12. 2008年1月HTML5由W3C做爲工做草案發布。雖然HTML5的語法很是相似於SGML,但它已經放棄任何成爲SGML應用程序的嘗試,除了一種替代的基於XML的HTML5序列,它已明肯定義本身的「HTML」序列。7月,因爲對於下一個版本應該包括哪些功能,各方分歧太大,爭論過於激進,ECMA開會決定,停止ECMAScript 4.0的開發(即廢除了這個版本),將其中涉及現有功能改善的一小部分,發佈爲ECMAScript 3.1,而將其餘激進的設想擴大範圍,放入之後的版本,因爲會議的氣氛,該版本的項目代號起名爲Harmony(和諧)。會後不久,ECMAScript 3.1就更名爲ECMAScript 5。看來大佬們爲了堅持本身的觀點,也會堅決果斷打破和諧,這纔是技術進步的要素。同年12月,Chrome瀏覽器發佈了,JavaScript 執行引擎 V8 編譯器也在此時誕生,這是Google公司爲Chrome瀏覽器而開發的,它的特色是讓JavaScript的運行變得很是快。它提升了JavaScript的性能,推進了語法的改進和標準化,改變外界對JavaScript的不佳印象。並且V8是開源的,任何人想要一種快速的嵌入式腳本語言,均可以採用V8,這拓展了JavaScript的應用領域。

  13. 2009 年,W3C正式宣佈了 XHTML2.0 再也不繼續,宣告死亡。大名鼎鼎的Node.js開始被瑞安·達爾(Ryan Dahl)編寫出來,12月,ECMAScript 5.0版正式發佈。AngularJS也於2009年誕生,由Misko Hevery 等人建立,後爲Google所收購,已經被用於Google的多款產品當中。同在該年,樣式層的變革也開始出現, Alexis Sellier發明的Less 被提了出來。



  14. 2010年1月,一款名爲「npm」的軟件包管理系統誕生。還有BackboneJS和RequireJS,這都標誌着JavaScript進入模塊化開發的時代。在可視化的方向也開始着落,初版three.js發佈。

  15. 2011年5月,工做小組將HTML5推動至「最終徵求」(Last Call)階段,6月,ECMAscript 5.1版發佈,而且成爲ISO國際標準(ISO/IEC 16262:2011),風靡一時的的Bootstrap由在今年中被twitter開源。

  16. 2012年10月,微軟發佈 TypeScript 公開版,2012年12月,W3C指定HTML5做爲候選推薦階段。開源的前端打包工具Webpack發佈了第一個階段。在今年Bootstrap 2也被髮布,這一版增長了十二列網格佈局和響應式組件,而且對許多組件進行了修改。樣式方面Less開始正式被髮布使用。可視化方向由國內IT巨頭百度的開源Echarts 1.0正式開源發佈,一直風靡至今,年末,全部主要瀏覽器都支持ECMAScript 5.1版的所有功能。

  17. 2013年3月,ECMAScript 6草案凍結,再也不添加新功能,新的功能設想將被放到ECMAScript 7。5月,Facebook發佈UI框架庫React,引入了新的JSX語法,使得UI層能夠用組件開發。6月,TypeScript 0.9 正式版被髮布。Bootstrap 3於8月19日發佈,開始將移動設備優先做爲方針,而且開始使用扁平化設計。12月,ECMAScript 6草案發布。百度的開源Echarts 2.0發佈完成。

  18. 2014年2月, Vuejs發佈,做者尤雨溪在Hacker News、Echo JS與Reddit的

    /r/javascript
    版塊發佈了最先的版本。10月28 日,W3C 正式發佈 HTML 5.0 推薦標準。React Developer Tools 成爲 Chrome Developer Tools 的一個擴展。



  19. 2015年4月23日,Mark Otto宣佈正在開發Bootstrap 4。6月,ECMAScript 6正式發佈,而且改名爲「ECMAScript 2015」。這是由於TC39委員會計劃,之後每一年發佈一個ECMAScirpt的版本,下一個版本在2016年發佈,稱爲「ECMAScript 2016」。同在今年,在 React.js 大會上,Facebook 發佈了 初版 React Native。阿里巴巴的以React研發的樣式庫antDesign的第一個版本發佈。一直風靡的Redux在今年被Dan Abramov 和 Andrew Clark 發佈。10月27日,Vuejs正式發佈1.0.0。Flutter第一個版本支持Android操做系統,被稱做「天空」,在Flutter開發者會議上被公佈。語法轉換工具babel 5.0和6.0相繼發佈。

  20. 2016年,1月百度的可視化庫Echarts 3.0發佈在公衆視野,獲得了一致好評。6月,阿里巴巴的移動端基於Preact / React / React Native 的 UI 組件庫mobile.ant.design正式發佈。10月份Vue 2.0 發佈完成。

  21. 2017年,ECMAScript2017正式發佈。11月,全部主流瀏覽器所有支持 WebAssembly,這意味着任何語言均可以編譯成 JavaScript,在瀏覽器運行。

  22. 2018年,1月,百度EFE團隊正式發佈了旗下知名開源產品ECharts 的最新大版本4.0正式發佈。2月,Webpack 繼續推進簡單和更快的構建,聲稱改進了 98%,Webpack 4正式發佈,它選擇了合理的默認值,在沒有插件的狀況下處理更多的開箱即用的功能,而且再也不須要開始使用配置文件。8月,Babel 官方博客在經歷了4000 次提交,發佈了50 多個預覽版本後宣佈正式推出Babel 7.0。

  23. 2019年,2月,React 16.8 帶這穩定版的 hooks發佈。8月份,Angular8.0正式發佈。Vue3.0已經在開發中,預計於今年發佈。


三十年,前端從上古時期的靜態網頁時代,發展到之後端做爲載體的MVC時代,再到AJAX興起後的單頁應用時代,一直到到如今的最流行的MVVM時代,使人感慨。

時間還在繼續,技術從未中止發展,前端從無到有,從單一到炫彩,愈來愈豐富,對於前端的將來發展也愈來愈讓人充滿興奮與美好憧憬。


若是有漏掉一些你所知道的前端技術,請在留言區留言哦,一塊兒努力補充一個完整前端史冊!


參考資料:
https://zh.wikipedia.org/wiki/HTML
https://javascript.ruanyifeng.com/introduction/history.html


若是對你有幫助不要忘了分享給你的朋友或者點個贊哦!也能夠關注做者,查看歷史文章而且關注最新動態,助你早日成爲一名全棧工程師!

相關文章
相關標籤/搜索