轉Web開發的發展史---Web開發技術的演變

轉自：http://blog.csdn.net/zzzkk2009/article/details/9849431

 

在接下來的幾個月時間裏，我打算寫一系列關於完整web開發的文章。這第一篇文章雖然有所粗略，但也可以充分歸納了在以前15年或者更久的時間裏web應用程序如何進行演變。而且最後我會囊括下這段時間內所寫的相關技術。

在過去的美好日子裏，咱們使用的是簡單的web頁面(包括動態gif圖片！)。做爲精美設計的典範，蘋果有着這樣的一個網站：

 

在那時，Web開發還比較簡單，開發者常常會去操做web服務器(主要仍是他本身的機器)，而且他會寫一些HTML頁面放到服務器指定的文件夾(/www)下。這些HTML頁面，就在瀏覽器請求頁面時使用。

 

問題就出現了，你只能獲取到靜態內容。假若你想讓訪問者看到有多少其餘訪問者訪問了這個網站呢(還記得那些統計流量的旋轉圖片嗎？！)，或者假若你想讓訪問者去填寫這樣一個表單，包含有姓名和郵件地址呢？於此就轉向了CGI和Perl腳本，在web服務器端運行一段短小的代碼，並能與文件系統或者數據庫進行交互。

 

 

當時組織CGI/Perl這樣的腳本代碼太混亂了。CGI伸縮性不是太好(常常是爲每一個請求分配一個新的進程)，也不太安全(直接使用文件系統或者環境變量)，同時也沒提供一種結構化的方式去構造動態應用程序。幾年來一直很困惑，直到大約2005年左右，出現了Java Server Pages(JSP)，微軟的ASP，以及PHP！我喜歡把當時的參考架構比做成IIS和ASP.NET，你能夠用Visual Studio快速構建一個可伸縮而且安全的應用程序。

 

 

直到當時，web服務器多半會返回整個頁面或者文檔，但AJAX(2005)的出現，讓事情變得頗有意思。AJAX容許客戶端的JavaScript腳本爲局部頁面提供請求服務，而後能夠在無需回到服務器狀況下動態刷新部分頁面，也就是更新瀏覽器中的document對象，一般稱做DOM，或者文檔對象模型。

雖然從服務器端返回的仍然是HTML，但瀏覽器上的代碼能把這HTML片斷內嵌到當前頁面中。也就是說web應用的響應能夠更快，這時咱們真正用web應用取代了web頁面。谷歌的GMail和谷歌地圖都是當時AJAX的殺手級產品。隨後用AJAX局部刷新就如雨後春筍般出現。

 

在隨後的幾年時間裏，AJAX成爲了焦點，但在服務器端仍然使用着舊有的技術。大概在2007年，37signals公司公開其成員–Ruby on Rails。那個基於Ruby on Rails 5分鐘構建博客的演示徹底征服了全世界的開發者。一晚上之間，因此談論的焦點都是關於Rails！Rails的不一樣之處在於使用規定的方式去設計你的web應用程序，運用一種已經普遍在桌面應用開發，但未被搬到web應用上的開發模式。這種模式就叫作模式(數據)-視圖(模板)-控制器(業務邏輯)。Rails強調，「這事就該這麼作」，而且經過許多插件讓構建web應用再一次更加健全。

 

 

在2007到2010年期間，涌現了3種開發潮流：

第一個是智能手機和移動應用潮流。一般狀況下，許多應用程序同時有web和移動應用兩種版本。儘管如此，服務端仍然返回的是HTML頁面，而不是其它移動應用能夠識別。所以，你須要返回的是結構化數據來取代HTML。

第二個開發潮流是jQuery。這是一個很是流行的JavaScript庫，可以很容易構建動態、美妙的web應用，甚至是AJAX！

第三個潮流是Node.js的發佈。這是第一次能讓你用JavaScript開發高性能的服務端程序，進而可能結束「客戶端開發者」要知道HTML/JavaScript，「服務端開發者」要知道.NET/C#/Ruby這樣的噩夢。

 

 

儘管這是一個不錯的架構，但咱們能夠重用一些在客戶端的收穫去簡化那些曾經發生在像客戶端意大利麪似的jQuery代碼。和Rails精神相似，咱們須要用一種規定的方式從服務端獲取到數據，再對客戶端的HTML頁面進行包裝。所以，在接下來的2年時間裏，業界出現了許多用於簡化客戶端開發的框架，諸如Backbone，Ember，Derby和Meteor，固然也包括個人最愛，AngularJS。

 

 

所以，這就是咱們看到的今天，而我後面要講到的參考架構是這樣的，MongoDB做爲數據庫服務器，node/express做爲web應用服務器，客戶端使用AngularJS，同時也使用Bootstrap樣式風格。我發現這種架構容許我可以快速構建web服務以及基於AngularJS的客戶端接口，甚至和其它的服務，如PhoneGap或者其它原生移動開發工具同樣，進行移動應用的開發。

 

在接下來的幾個星期裏，我會發表一些文章來講明這些涉及到的組件，包括：MongoDB，Node/ExpressJS，JSON和REST接口，AngularJS，Karma-mocha測試和Bootstrap樣式風格頁面。

 

推薦閱讀：《Web開發技術的演變 》

 

 

 

 

 

 

 

 

受到好文《Web開發的發展史》（英文）激發的靈感，寫下我對web開發技術的認識。

1. 靜態頁面時代

大學時候，上機還得換卡穿拖鞋，Novell的網絡是很神奇的，然而更神奇的是通信原理老師半神祕的講他上 Internet，「Cernet(教育網)有條64K的出口，半年前還很快，如今已經比較卡了」。就這樣，咱們用Netscape指向Yahoo。那是一個HTML加圖片的世界，充斥着各類花哨閃耀的字體和鞠躬的小人，藍色鏈接點擊後會奇幻的變色。

咱們開始用不熟練的HTML和簡陋的設計來設計網頁，而且知道這邊有個瀏覽器，那邊有個叫WebServer的東西，但管理Sun工做站的機房老師老是盯的很緊，不會讓你動系統半分。據說有個叫Linux的神奇東西，好吧我想嘗試，但是我只有一臺攢的電腦，以及若干張5寸3寸的軟盤。我至今感謝一位師兄，他幫我下載並切分了一個版本的Mandrake，就這樣室友看到很是奇怪的一幕，我奔波在機房宿舍之間，仔細計算容量來拷貝，就這樣在假期裏我第一次搭建了Apache。

 

2. CGI時代

很快頁面上流行一個叫作計數器的東西，免費的收費的建站網站都把它看成賣點，「立體超炫變色時尚計數器」，很快咱們看到幾乎每一個頁面都有了一個點擊量在88888的酷裝置，只是不管怎麼點都不會變化。而校園裏張貼着使人眼紅的廣告，「徵人寫CGI程序，一支500元！「。

慢慢的，知道了CGI是利用進程間輸入輸出通訊，和WebServer進行通訊，從而能夠寫程序來控制頁面輸出的內容。但在當時會給硬盤分區就在中關村被當作電腦高手的年代，實在是會者寥寥。即使到了今天，我依然對Perl敬而遠之。一些前輩用C寫出更高級的CGI應用，好比WebMail，挖到第一桶金，成爲今天互聯網的先驅。

 

3. PHP露出鋒芒

說實話，我認爲PHP是最受益於互聯網浪潮的語言，在合適的時間和好夥伴MySQL一塊兒出現。利用Apache的模塊mod-php，將php做爲web服務器的一部分運行，效率和維護性都達到很好的提高。腳本語言成爲互聯網前端開發主力一直到今天。PHP和大哥Perl，以及兄弟Python，Ruby一塊兒盤據在編程語言排行榜5-10名位置。

一樣的Mysql也是時代的嬌子，它快速靈活易用成爲網站數據庫的首選，但很長時間裏，Mysql被其餘數據庫詬病，別說Oracle等高富帥，即使是同爲開源的Postgres社區裏，也會有這樣的聲音，「不支持事務也叫數據庫？」。不要緊，開源社區很快爲其加入各類引擎，現在Mysql絕對是裝機總量第一的數據庫。

 

4. J2EE

Java時代來臨，一杯咖啡，一個可跳動的小精靈牽動了全部的大型軟件公司。沒錯是全部，包括微軟，Sun公司一時星光無限，全部的開發人員都在談Java。人們對其桌面表現失望進而質疑時，J2EE及時出現了，Servlet+JSP快速成爲Web開發的好用技術。可以跨平臺，獨立解包使用的Web服務器，掛接任意數據庫的JDBC接口，一時世界變得很美好。

微軟的ASP也出現了，一開始也是腳本解釋，和PHP等技術相似。很快微軟的C#和dotNET戰略出臺，ASP也升級爲ASP.Net，今後dotNET和J2EE是競爭者，更是一對站在相同站壕的朋友，互相學習和抄襲對方的技術和設計，直到今天。

 

5. Web層框架百花齊放

Servlet是一個優異的Web技術規範，但面對叢多的開發需求，仍是不能很好的覆蓋。Struts框架很快成爲主流，今天咱們依然看到不少.do後綴的頁面。Struts主要作了三件事，一是對請求Url進行很好的梳理，經過Command模式把請求指配到Action對象上，並能夠用同期出現的Ioc框架進行注入。二是梳理出若干有用好用的Intecepter，並能夠自由組合構成本身的Stack。三是對頁面流轉流程經過xml的方式能夠靈活定義。

同期，數以百計的各類框架出現了，多數都是針對Servlet的空白點，在幾個方面進行代碼或者配置的約定，可謂百花齊放，百家爭鳴，我想Java社區能到今天依然繁榮，這種海納百川，開放的態度是根本緣由。現在不少框架已經走過生命期，但還有不少活躍的，其中Webwork即Struts2，和SpringMVC是模板技術類別最出色的。GWT，Wicket等在頁面組件類表現不錯，還有脫離Servlet束縛Play等框架。

 

6. WithoutEJB

J2EE裏，除了Servlet外另外一個重量級的規範就是EJB。EJB設計的來源是Corba技術，分佈式對象技術在EJB規範中有完整的體現。Rod在著做中對EJB規範粗重龐大難用提出各類質疑，尤爲是針對其強制分佈的要求。個人觀念是分佈式支持沒有錯，如今EJB規範中對於Local和Remote的劃分定義是正確的。開發人員應該一開始就須要瞭解接口粒度的劃分，本地和遠程接口是不一樣的。對於通常的小型應用，Servlet和EJB容器都在一個虛擬機中，本地接口是合理的，但對於大型企業應用和互聯網級別應用，勢必須要服務的遠程劃分和調用。因此早期的EJB，能夠說一方面設計不完備，另外一方面又過分設計。但EJB自從3之後徹底脫胎換骨，成爲設計良好的規範。

spring做爲開發框架，把Ioc和AOP能力發揮的淋漓盡致，在各個層次很好融合其餘技術和項目庫，一直是Java Web開發的主流。不過面對CDI等JavaEE規範，在注入，生命期管理，對象解耦等優點不在。我預計從此Spring, JavaEE和Osgi會在主流Java開發框架方向競爭，也會相互借鑑和融合。

 

7. Ajax

Javascript是瀏覽器正統的腳本語言，但在那個機器性能不佳的年代，一段Js代碼形成鼠標沒有響應的狀況比比皆是。Js的給人影響就是頁面上飄來飄去「點擊我」對話框，頁面上走馬燈效果的變色通告，或者是幾十層模態對話框的惡意頁面，不少網吧的機器默認Js是禁用的。在很長的一段時間裏，Java web開發一個潛規則就是少手寫Js文件，這樣能夠很好的支持多種瀏覽器和提升效率。

谷歌火了，Ajax也成爲火爆的前端技術，咱們在使用gmail，google map等產品時，有了另外一種體驗，點擊連接或按鈕後，即使網絡不算流暢，頁面再也不全白從新刷新，而是內容漸漸的出現。其原理就是利用Js腳本到後臺服務器獲取數據，在瀏覽器前端對數據進行解析和渲染，在這個過程當中，大多數頁面並不須要進行改變，只是更新頁面中一部分便可。谷歌公司大力支持Firefox使其重生，並和蘋果一塊兒發展webkit項目，各自發展了chrome和safari瀏覽器，伴隨者頁面渲染能力大力提高同時，Js腳本的解析能力也日新月異。我我的認爲Ajax這個技術看似簡單，但倒是新一代Web，所謂Web2.0的基石性質技術，爲互聯網泡沫後互聯網的復興和今日騰飛起到了重要做用。

 

8. Ruby and Rails

快速成長的互聯網須要快速的web開發能力，Rails框架出現了，同時火爆的還有Ruby語言，它的出現知足了當時開發者的須要，快速開發，玩cool的東西，有完備的後端模型支持。讓咱們仔細分析一下Rails中MVC就能發現，Model中對實體對象的關係定義，和JavaEE的JPA不少概念一致，但利用Ruby語言的元能力，能夠直接對實體對象進行功能擴展，而其時Java社區還在爲貧血，充血對象爭論不休。Control，View等層次也能和Java的一些框架概念一致，不過有些設計構思更巧妙，並且Rails的基因就是知足互聯網開發須要，和JavaEE企業級應用有所不一樣。

很快的，各類語言紛紛出現模仿Rails的項目，Java的Grails, SpringROO，JBossForge，Python的Django，PHP的Symfony等等。毫無例外的，能有影響力的都是開源的，有良好社區能力建設的項目。

 

9. JSF和CDI

讓咱們回到企業應用開發，你們有沒有想過所謂企業應用和互聯網應用之間最大的差異是什麼？我認爲是用戶數量級別的差別，致使前端設計方式，軟件體系，後臺數據庫，緩存技術應用，有不一樣的設計理念和方式。用更技術化來講，就是會話和事務。企業應用是有強會話和事務需求的，而這兩個技術詞語也會一併關聯存在。很簡單，在一個事務中會通過屢次會話過程，直到這個事務所有作完。和咱們平常辦事是同樣的，填單子，和辦事人員溝通，修改單據，蓋章，各類口舌，最終感慨，辦事真難。

從軟件層面考慮，一個企業應用軟件可能用戶數並不太多，就企業中百十號人，但先後臺的交互是長時間，屢次會話交互的。JSF技術實際上是借鑑了微軟ASP.net，它們繼承了傳統IDE快速開發的思路，但願經過拖拽鏈接能夠快速開發一個應用。頁面上的組件，對應後臺服務器的業務組件，在獲得服務器請求以後，組件須要作一系列動做來完成解析，校驗，模型重建，業務方法調用，頁面渲染等步驟，這些必然有個較長的過程。複雜性，效率，和其餘技術的融合，JSF技術從誕生起就被質疑不斷，並且面對每一個明星技術，都有些格格不入，好比Ajax出現了，而JSF要求的Post方式還須要重刷頁面。但JSF一直在改進，愈來愈科學完善。現在，配合CDI，JSF是企業應用開發的首選技術之一，你們能夠研究一下Oracle的應用產品和ADF開發框架。

CDI是Seam框架的技術精華造成的JavaEE規範，在JavaEE7裏面已經成爲最重要的規範之一。和hibernate最終造成JPA同樣，CDI也是GavinKing構思，開發推進的。仔細分析就會發現，CDI幾乎彌補了JavaEE在現代開發需求中，對象方面定義的絕大多數不足，好比和DI規範定義了注入，生命期管理和會話範圍定義，完善了EJB對於普通POJO對於事務，異步通知機制的定義，還有註解的堆疊定義，裝飾模式等等。有時候我就在想，假如JavaEE是GK從頭打造，咱們開發人員會少走不少彎路，由於他對企業應用的理解和用Java構建框架和定義規範，都是貼近一線開發人員需求。惟一遺憾的就是CDI尚未推進完成，他轉移興趣玩起語言了。關於JSF和CDI，我建議作相關產品的朋友，即使不用這樣的組合，最好也對其技術基本內容有所瞭解，我想對思路擴展是很是有好處的。

 

10. Netty，NodeJs，Vertx和異步化趨勢

Netty的領導者和Mina的主力開發者TrustLee，是一個說話慢條斯里的韓國人。面試時問我一個關於volatile問題，雙方都以爲非母語很彆扭，因此就都簡單表達一下就算。可我沒想到這個同齡的開發人員，往後對Java在互聯網公司的地位提高，起到這麼大的做用，這個項目就是Netty。咱們都知道Java異步集合庫的做者DougLea的功勞，Nio1代，對於Socket的異步化還不是很完善，即使是Nio2，工做重心仍是文件系統的異步化處理，網絡層的異步化設計逐步增強改進。由於Java的設計理念，正交化，接口堆疊，底層功能平臺統一化等給異步分佈式網絡框架留出足夠的空間去發揮，Netty，Mina，Grizzly等項目紛紛出現。Twitter宣佈從Ruby轉向Scala，並使用Netty讓其大紅大紫。

所謂異步網絡框架，就是對網絡層調用，進行異步化，並進行接口封裝，使得容易理解和使用。異步能力仍是經過Java虛擬機現有功能實現的，經過對數據流的處理和狀態感知來進行處理，而不是傳統的阻塞式的收發消息。這個符合咱們生活中的感覺，當你訂票時，你會打電話告訴你須要什麼，說訂好票給我電話，而後你就去作別的事情，直到訂票員通知你訂好了來支付取票再進行下一步操做，若是訂票是同步的，那你就要一直等待訂票完成，遇到春運可能會搭上成天的時間。

爲何異步網絡框架也受到重視，答案也是互聯網，數以億計的請求點擊涌來時，傳統的webserver頂不住了，採用一個線程服務一個請求模型的webserver，沒法承受這麼大的數據訪問，特別對於Java這樣的吃內存語言，一個請求佔用了一個線程，同時也佔用了相對應的若干資源。用企業應用的設計的整個架構面對互聯網級別的應用時，有點崩潰的感受。解決高併發大量請求的途徑是高吞吐量加上可擴展的軟件架構。異步化能夠提高吞吐量，就和銀行的排隊機同樣，顧客來了獲得排隊服務，當有可用的櫃檯服務時會主動通知顧客，咱們能夠設想，即便有再多的顧客，也能夠經過增長業務櫃檯，少量增長排隊機和少許人工協調處理來解決。

NodeJs是一個異步化的基於Javascript的開發框架，是當前的明星技術，符合了一些當前開發需求，如異步化，前端Js技術普遍應用，Js引擎能力極大提高，NoSQL的火爆，組件構建模式變化等。利用Js語言函數式編程能力，Js開發人員能夠很輕鬆的利用已有的組件開發後端應用，前端能夠直接用瀏覽器處理Js，別忘了Js是瀏覽器惟一能統一識別的腳本語言，或者用JQuery,AngularJS等流行框架，世界很清淨，都是Js。

但咱們須要瞭解在常駐內存服務型程序方面，Java等語言佔有極大優點，Java社區很快出現了和NodeJs有相同設計思路的項目，Vertx就是其中的優秀表明。它充分借鑑了NodeJs和Erlang/OTP Actor模型的優秀設計，利用分佈式消息機制進行對象間通訊，利用Netty進行網絡異步操做，方法調用倡導異步調用，有本身的模塊化機制。這樣，Java社區出現了和NodeJs競爭的技術框架，良好使用，能夠解決大規模互聯網應用的需求。

Java領域的異步化趨勢能夠說剛剛開始，咱們看到Servlet和EJB都加入異步支持，Spring的Reactor，JBoss的undertow，隨着Java8對函數語言能力的加強，能夠預見又會有叢多的項目產生。我關注着異步化趨勢和JavaEE開發方式的融合之路，相信那是Web開發的明天。