Web簡史

Surmon發表於2017-04-11

你可能認為web就是javascript?是,但不單單是。

這篇文章可能有點長,涉及大量歷史資料,建議安排一個充裕的時間 + 充足的興趣 + 充足的耐心來通讀(預估10分鐘)。

在今天的程式設計領域,web已然是一顆明星,當然,你也可以覺得他很快不那麼火了,but whatever,它確實已經產生了足夠大的影響力,並對社會、職業產生了很深的影響,看街邊小廣告培訓班、網上滿天飛的高薪就業班就知道大概一二了。

好了,言歸正傳!我們先從頭開始

計算機的誕生

二戰時期,美國軍方為了計算炮彈彈道,讓科學家Mauchly和其學生Eckert造出歷史上第一臺計算機ENIAC。

ENIAC誕生於1946年2月14日,佔地170平,重30噸,每秒能跑5000次加法運算和500次乘法運算。

來看看這大傢伙,滿滿的電容晶體電氣哈

Web簡史

網際網路的起源

網際網路的前身是阿帕網(ARPANET),是隸屬於美國國防部高階計劃署( ARPA – – Advanced Research Projects Agency )的一個網路。

冷戰期間,美國國防部擔心如果唯一的的軍事指揮中心被蘇聯摧毀,全國的軍事指揮會癱瘓,有必要設計一個分散的指揮系統──它由一個個分散的指揮點組成,當部分指揮點被摧毀後其它點仍能正常工作,而這些分散的點又能通過某種形式的通訊網取得聯絡。(跟現代CDN挺像)

1969年,ARPA開始建立阿帕網,把美國的幾個軍事及研究用電腦主機聯接起來。起初,ARPAnet只聯結4臺主機,從軍事要求上是置於美國國防部高階機密的保護之下,從技術上它還不具備向外推廣的條件。

直到1983年,ARPA和美國國防部通訊局研製成功了用於異構網路的TCP/IP協議,加州伯克萊分校把該協議作為其BSD UNIX的一部分,使得該協議得以在社會上流行起來,從而誕生了真正的Internet。

要從物理層面說,就是用分別分佈在不同層級的訊號解碼編碼裝置(網路卡/路由器/交換機/貓...)將光/電訊號不斷地轉換為二進位制脈衝傳送,再不斷地接受並轉換回來,給計算機拿去計算渲染展示。

那幾年,各種協議、系統也便隨之誕生和應用。

網路時代

當時的網際網路只是一群極客的玩具。

1994-95年兩家創業公司的出現改變了一切。

  1. 網景公司(Netscape) 在1994年10月推出第一款瀏覽器
  2. 雅虎於1995年3月推出的免費檢索服務

先說雅虎:

楊致遠,生於臺灣,10歲移民加州,自小天資稟賦...成績優異,高中畢業時柏克萊、史丹佛、加州理工以豐厚獎學金搶著錄取;

在史丹佛讀書的時候,這哥們經常在圖書館做兼職,做的最多的就是給圖書館的圖書系統地分類整理。

沒幾年,矽谷軟體業開始火了,讀博的時候,便選擇了CS專業,還遇到了David Filo,倆人一見如故,都愛運動,愛數學,愛科學,很快成了莫逆之交。

留學完,楊致遠和Filo發現網站越來越多但彼此孤立,互不連結,想要找到想要的內容非常不便。

於是產生一個想法:把眾多網站收集起來,分門別類地連結到一個站點上。

隨後,倆人建立了以兩人名字命名,統稱為“傑裡和大衛的全球資訊網嚮導”(Jerry & David’s Guide to the World Wide Web)的站點。

說白了就是個超級簡易版的hao123的網址導航吧,找了個圖:

Web簡史

最早,哥倆把程式跑在史丹佛校內網。訪問人數太多,影響到學校電腦的訪問,被驅逐了。

接著就進駐了當時最著名的網際網路公司“網景”,並從“網景”的瀏覽器得到一個按鈕位置(類似今天的書籤或主頁按鈕吧)。

在網景里長這樣:

Web簡史

藉助網景瀏覽器的龐大使用者規模,楊致遠和費羅的站點迅速爆紅。到1994年秋,他們的站點訪問量已突破100萬人次。
楊致遠和費羅從小聽著矽谷神話長大,對這裡的玩法非常熟悉。
網站訪問量和影響力的成倍增加,讓他們看到創業的可能。1995年3月,風險投資公司Sequoia Capital給了楊致遠和費羅200萬美元,4月,他們成立了自己的公司:Yahoo!。

2000年的時候,雅虎已經是人類史上的第一家千億美金網際網路公司了。

谷歌也是在那會誕生的,不過由於雅虎自身原因,終被擊敗。(吳軍老師《浪潮之巔》中的觀點)

如果不是雅虎,網際網路可能將在很長一段時間裡成為富人的奢侈品。

再說網景

這麼說吧,網景公司誕生那會 Mark Zuckerberg 還在讀中學,網景第一個版本瀏覽器釋出時,微軟剛出Windows95,IE還是自帶的1.0版本。

由於當時軟體的匱乏和瀏覽器的跨平臺特性,當時的網景曾一度是微軟的威脅,98年時市場佔有率超50%,(相當今天的chrome了哈),不過次年就下滑了。

當年的網景瀏覽器長這樣:

Web簡史

當年也是一場“瀏覽器惡戰”,網景瀏覽器當時是收費的,Windows也是收費的,但IE屬於免費附贈的,倆廠商為了超越彼此,拿下Web市場,拼命往瀏覽器加功能,
甚至加一些不管能不能用用不用得到的功能,版本號也是火速飆升,很快地,IE出了3.0、4.0,到了4.0的時候,由於微軟的資金、人員儲備大大勝於網景,IE勝出,佔有率超過網景成瀏覽器市場老大。

當然網景失敗也是有必然原因的,比如這樣...

Web簡史

題外話了,有興趣去讀吳軍老師的《浪潮之巔》

語言的誕生

這有個小插曲:1994年,網景釋出了Navigator0.9版,這是世界上第一款比較成熟的網路瀏覽器,轟動一時。
但是這是一款名副其實的瀏覽器--只能瀏覽頁面,瀏覽器無法與使用者互動。
比如你登入一個網站輸入完使用者名稱點選提交的時候。瀏覽器並不知道你是否輸入了,也無法判斷。只能傳給伺服器去判斷。
網景急於解決瀏覽器與使用者互動這個問題。當時解決這個問題有兩個辦法,一個是採用現有的語言,比如Perl、Python、Tcl、Scheme等等,允許它們直接嵌入網頁。另一個是發明一種全新的語言。
這兩個選擇各有利弊。
第一個選擇,有利於充分利用現有程式碼和程式設計師資源,推廣起來比較容易;
第二個選擇,有利於開發出完全適用的語言,實現起來比較容易。

到底採用哪一個選擇,網景公司內部爭執不下,管理層一時難以下定決心。
就在這時,1995年Sun公司將Oak語言改名為Java,正式向市場推出。Sun公司大肆宣傳,許諾這種語言可以"一次編寫,到處執行"(Write Once, Run Anywhere),它看上去很可能成為未來的主宰。
網景公司動了心,決定與Sun公司結成聯盟。它不僅允許Java程式以applet(小程式)的形式,直接在瀏覽器中執行;甚至還考慮直接將Java作為指令碼語言嵌入網頁,只是因為這樣會使HTML網頁過於複雜,後來才不得不放棄。
總之,當時的形勢就是,網景公司的整個管理層,都是Java語言的信徒,Sun公司完全介入網頁尾本語言的
決策。 因此,Javascript後來就是網景和Sun兩家公司一起攜手推向市場的,這種語言被命名為"Java+script"並不是偶然的。

此時,34歲的系統程式設計師 Brendan Eich 登場了。

來看看祖師爺長啥樣:

Web簡史

1995年4月,網景公司錄用了他。祖師爺 哦不 是 Brendan Eich 的主要方向和興趣是函數語言程式設計,網景公司招聘他的目的,是研究將Scheme語言作為網頁尾本語言的可能性。祖師爺本人也是這樣想的,以為進入新公司後,會主要與Scheme語言打交道
僅僅一個月之後,1995年5月,網景公司做出決策,未來的網頁尾本語言必須"看上去與Java足夠相似",但是比Java簡單,使得非專業的 網頁作者也能很快上手。 這個決策實際上將Perl、Python、Tcl、Scheme等非物件導向程式設計的語言都排除在外了。
Brendan Eich被指定為這種"簡化版Java語言"的設計師。

但是,他對Java一點興趣也沒有。為了應付公司安排的任務,他只用10天時間就把Javascript設計出來了。
由於設計時間太短,語言的一些細節考慮得不夠嚴謹,導致後來很長一段時間,Javascript寫出來的程式混亂不堪。如果Brendan Eich預見到,未來這種語言會成為網際網路第一大語言,全世界有幾百萬學習者,他會不會多花一點時間呢?
總的來說,他的設計思路是這樣的:

  1. 借鑑C語言的基本語法
  2. 借鑑Java語言的資料型別和記憶體管理
  3. 借鑑Scheme語言,將函式提升到"第一等公民"(first class)的地位
  4. 借鑑Self語言,使用基於原型(prototype)的繼承機制
    所以,Javascript語言實際上是兩種語言風格的混合產物----(簡化的)函數語言程式設計+(簡化的)物件導向程式設計。 這是由Brendan Eich(函數語言程式設計)與網景公司(物件導向程式設計)共同決定的。
    如果不是公司的決策,Brendan Eich絕不可能把Java作為Javascript設計的原型。

作為設計者,他一點也不喜歡自己的這個作品:
"與其說我愛Javascript,不如說我恨它。它是C語言和Self語言一夜情的產物。
十八世紀英國文學家約翰遜博士說得好:

它的優秀之 處並非原創,它的原創之處並不優秀。

The part that is good is not original, and the part that is original is not good.

標準化程式

網景在1997年和微軟競爭的過程中,便率先向當時的 ECMA(歐洲計算機制造商協會)提交了 Javascript 的草案以作為 ECMAScript 的第一個版本標準,
此後的 ECMAScript 每次更新均以此為基石,同時也不斷地有瀏覽器廠商,如 Google、Apple、微軟等加入進來共同發展維護;
這在當時對網景是極其有利的,IE當年就幾乎是一副我行我素的模樣,在今天我們都能知道IE老版本瀏覽器上留下的獨一無二非標準API有多麼麻煩,
當年的的IE嘗試過想要自己主導標準,模仿網景在IE上創造並內建了Jscript 直譯器,導致當時寫網頁甚至要對兩種瀏覽器分別寫兩套指令碼;
無奈網景先行一步,此後的 Jscript 才開始向 ECMAScript 標準靠攏,事實上今天我們所使用的不同瀏覽器核心引擎各有不同的實現,但都是遵照 ECMAScript 標準實現的,微軟最新的 Edge 瀏覽器是目前對 ES6 支援率最高的瀏覽器。

1998年初,網景競爭失敗,IE佔據了市場主導地位,為了挽回市場,網景宣佈旗下軟體免費,並將網景瀏覽器核心引擎Gecko開源,成立了Mozilla(這會的Mozilla還是個非正式機構);
然而,年末時網景便被美國線上(AOL)收購了,2000年又和時代華納合並,03年網景公司(這會是AOL的子公司)正式宣佈解散,當天也正式成立了Mozilla基金會;

當時,Mozilla基金會只有一個目的:保證Mozilla可以在沒有網景以後能繼續生存下去
在今天,Mozilla基金會所宣稱的目的是:讓瀏覽器市場保持著競爭的壓力,不會再出現像IE6時代這樣一家獨大的,用他們自己的說法就是“一個致力於在網際網路領域提供多樣化選擇和創新的公益組織
注意,Mozilla基金會下轄有一家叫Mozilla的子公司,這家公司專門還用來開發和維護Firefox瀏覽器,哈,就是我們開發者常用的火狐啦。

BTW:今天差不多每家大公司都有自己的 developer network,我們常去的較為權威的 MDN,也是因為祖師爺大大就一直就職在 Mozilla,是 ECMA 主力的推動者,近幾年Apple、Google也帶動 ECMA 建立了許多新標準。

在這裡我強烈安利一部紀錄片:《Code Rush》(奔騰的程式碼)

發展歷程

Dom時代

最早的網頁都是服務端渲染或者壓根沒服務端就是個頁面,資料組合後吐出html,國內的如dedecms、帝國、discuz、phpwind...各種亂七八糟的程式,有的被收購,有的完蛋...,國際上wordpress是最經典的代表,今天也依然是CMS中的No.1。

前端層面,以DOM模型為核心,一切基於Dom,JQuery是Dom時代當之無愧的霸主,那會的各種“框架”基本上就是各類封裝好的函式庫(包含UI庫),如EXT.js、prototype.js、JQuey...

最早的動畫幾乎都是通過Dom操作實現的,JQuery的animate也是封裝了setTimeout/setInterval,而js中setTimeout/setInterval的精度也僅在16ms左右,又因為js單執行緒,且dom重繪需要大量計算,基本無法實現出較為流暢的動畫,卡幀極為嚴重

如果是電影時代,這會應該算處於最早的“膠片電影”。

H5C3

H5和CSS3幾乎同時出來的,CSS3中增加了許多新的特性,包括大量可以代替dom動畫的特性,相比dom動畫:

  • CSS和Dom渲染為分開的獨立執行緒,不會因為dom操作而阻塞動畫
  • CSS對Dom的修飾/動畫,只要不涉及dom重繪,會非常流暢(如opacity、transform...)
  • CSS可優先使用GPU進行加速渲染,如果不支援則自動降級為CPU,而無需程式碼處理

H5也同時帶來了極具生產力的Canvas,甚至誕生了以Canvas為核心渲染方式的框架,就不細說。

這會已經進入“數字電影”時代。

應用化

Angular.js(Angular1)無疑是最成功的開山之作,帶我們進入MV*時代的大門。

今天,Angular1已經完成它的歷史使命。
它曾是最全面最強大的前端框架,
它啟發了很多人第一次以工程的角度去思考Web,
它讓 web app 更加普及,基於它的 ionic 讓 web 移動端的實踐更加普及,
它也讓很多Web開發者有機會認識到複雜web應用的狀態管理問題,
沒有它就沒有今天的Vue,
它是Web開發程式中的一個里程碑,價值不可否認。

這會可以比作 VR 電影時代了。

元件化

感覺又返璞歸真了,高內聚低耦合的工程結構極大提高了程式碼複用性和團隊分工開發效率。

代表作:Ng4、React、Vue

這會算是 AR 增強體驗電影時代。

今天

今天我們常說一句話:“像1995年那樣編寫程式碼”。

最早,有條件的公司,我們使用一些基於 Python、其他工具來完成部分Web開發工程化的探索和實踐。

到今天,從 Node.js 的出現,從 Grunt、Gulp 到 Webpack ...,我們能極高效率地將Web開發真正地工程化。

從開發、構建、編譯、測試、整合、部署、運維...,能覆蓋軟體開發的完整生命週期。

哦,對了,一兩年前就有基於 Node.js 的 NodeOS 和 嵌入式開發系統了。

應用領域

由於Js天生非同步的特性和在服務端優異的成績,Node.js 早已頻頻被應用於大型商業應用中。

WebView裡無法獲得的能力:“體驗增強”與“端基本能力”,現在也有React Native等各類框架在實踐。

未來

web-components、web-service、web-vr...都是開發者在Web開發道路上種下的一顆顆種子,當它成長為參天大樹那一天,將不斷為軟體開發領域孜孜不倦地輸出生產力和貢獻。

就像 Stackoverflow 大佬 Jeff Atwood 說的那句話:

Any application that can be written in JavaScript, will eventually be written in JavaScript.

部分資料來源於:百度百科、知乎(不詳)、《浪潮之巔》、《奔騰的程式碼》

內容若有偏差,期待指正修改。

原文來自:Surmon.me - Web近代史

相關文章