1. 程式人生 > >Web技術的發展 網路發展簡介(三)

Web技術的發展 網路發展簡介(三)

在上一篇文章中,對TCP/IP通訊協議進行了簡單的介紹 通訊協議是通訊的理論基石,計算機、作業系統以及各種網路裝置對通訊的支援是計算機網路通訊的物質基礎 而web服務則是運行於應用層,藉助於應用層的協議,建立了客戶端與伺服器,對等層之間的聯絡,底層的硬體以及軟體為其提供服務。 本文對web發展架構進行簡單介紹,並且對web開發技術進行簡單介紹,不是要介紹細節,而是要展示一個巨集觀的概念。

WEB架構起源

80年代中期ARPANET才逐漸開始進入民用 20世紀90年代之前,因特網的主要使用者還是研究人員、學者和大學生 他們登入遠端主機,在本地主機和遠端主機之間傳輸檔案,收發新聞,收發電子郵件等,但是因特網基本上不為學術界和研究界之外所知。
此時,計算機網路通訊的底層技術已經相對比較成熟,一個叫做Tim的人,開始嘗試建立互聯世界的文件 其實他並不是第一個有這個想法的人,但是在此之前,鑑於計算機科學技術的發展限制,都並沒有成功   1989 CERN (歐洲粒子物理研究所)中由 Tim Berners-Lee 領導的小組 提交了一個針對Internet的新協議和一個使用該協議的文件系統 該小組將這個新系統命名為 Word Wide Web ,它的目的在於使全球的科學家能夠利用Internet交流自己的工作文件。 這個新系統被設計為允許Internet上任意一個使用者都可以從許多文件服務計算機的資料庫中搜索和獲取文件。
1990年末,這個新系統的基本框架已經在CERN中的一臺計算機中開發出來並實現了 1991年該系統移植到了其他計算機平臺,並正式釋出。 1989年,Tim提出Web計劃,1991年正式釋出,速度真的好快。 HTML, HTTP, URI,瀏覽器,web伺服器,就此發明問世   Word Wide Web又被稱為“Web”、“WWW”、“W3”,中文名字為“全球資訊網”,"環球網"等,常簡稱為Web 全球資訊網並不等同網際網路,全球資訊網只是網際網路所能提供的服務其中之一,是靠著網際網路執行的一項服務。 所有連線到網路上的計算機,通過執行的web伺服器程式,提供給內容的所有內容、服務,才是我們說的全球資訊網
分為Web客戶端和Web伺服器程式, WWW可以讓Web客戶端(常用瀏覽器)訪問瀏覽Web伺服器上的頁面。 計算機網路的互連,讓全世界各地的計算機能夠進行通訊 而web則讓全世界各地的計算機能夠進行超文字文件的共享,完成了計算機網路內容的互連 web的發明,讓網際網路開始爆炸式增長 Web的起源某種程度上可以認為是“一蹴而就”的(我加引號了),不過前提是計算機網路已經發展到了一定階段,具備了先決條件,而且已經累積了很多電腦科學方面的理論 Tim搭建了web的雛形,設計了web的架構,是BS結構的始祖。   web的基本核心就是內容的共享 比如,你問你的語文老師,XXX的作者是誰。
  • 你就是請求發起者,語文老師就是請求應答者;
  • 問題就是資源的識別符號;
  • 而你通過語言表達出來,普通話就是協議;
  • 而作者到底是誰,則是被請求的內容;
  • 而內容也有表示形式,比如說出來?寫在紙上交給你?則是超文字格式;
image_5c35493c_462b BS形式共享超文字文件的架構方案,定義了瀏覽器客戶端和伺服器程式是兩個通訊主體,雙方通過HTTP協議進行對話,通過URI進行資源定位,訊息通過HMTL格式化。

web核心組成

  • URI 解決了文件的命名和定址識別問題
  • HTTP解決了瀏覽器與伺服器應用層之間的交流問題
  • HTML 定義了超文字文件的表示
  • 瀏覽器用於發起請求,並且解析文件
  • 伺服器用於儲存文件

URI

統一資源識別符號(Uniform Resource Identifier,或URI) URI 採用一種特定語法標識一個資源的字串,所標識的資源可能是伺服器上的一個檔案,也可能是一個郵件地址、新聞訊息、圖書、人名、網際網路上的主機或者任何其它內容。  重點在於唯一標識 URI有兩種形式,URL和URN image_5c35493c_46e2 URL是Uniform Resource Locator的縮寫,譯為“統一資源定位符” URL的格式由下列三部分組成:
  1. 協議(或稱為服務方式);
  2. 存有該資源的主機名稱(域名)或者IP地址(有時也包括埠號);
  3. 主機資源的具體地址,如目錄和檔名等;
URN是統一資源名稱 (Uniform Resource Name, URN) URN它命名資源但不指定如何定位資源   URI描述了這麼一個東西:可以用來唯一標識一個資源,URL和URN是他的兩種具體形式 所以一個URI可能是一個URL,也可能是一個URN,或者二者兼具。 但是任何一個URL或者URN他們肯定都是URI   比如,“阿里巴巴馬雲”當你聽到這個名字的時候,你不知道他是誰嗎?這就是唯一標識一個資源URN 但是馬雲在哪裡?電話號碼多少?你是不知道的,雖然“馬雲”兩個字可以唯一標識他本人,但是你聯絡不上他 如果你有了他家的地址呢?XXX小區XXX號,你就可以定位馬雲的位置了,這就是URL 不管是“阿里巴巴馬雲”還是馬雲家的地址XXX小區XXX號,他們都是URI

HTTP協議

設計HTTP最初的目的是為了提供 一種釋出和接收HTML頁面的方法 最早版本是1991年釋出的0.9版。該版本極其簡單,只有一個命令GET。 GET /index.html 表示,TCP 連線(connection)建立後,客戶端向伺服器請求(request)網頁index.html。 協議規定,伺服器只能迴應HTML格式的字串,不能迴應別的格式。 HTTP協議就是瀏覽器與web伺服器兩個應用之間通訊的“協議”“語言” 計算機不能像人類一樣溝通,他只是0,1的世界,想要交流就必須制定通訊的格式,而這個HTTP協議就是瀏覽器與Web伺服器的溝通方式  這就是它的根本,如同你對別人豎大拇指表示稱讚,伺服器看到GET方法就會返回資料,這就是瀏覽器與伺服器溝通交流的方式。 換句話說,人類用語言和文字進行溝通,CS世界中的各種協議,都是計算機的溝通方式。

HTML

HTML超文字標記語言,標準通用標記語言下的一個應用 標準通用標記語言(簡稱“通用標言”),是一種定義電子文件結構和描述其內容的國際標準語言; 早在全球資訊網發明之前“通用標言”就已存在,HTML也是由他發展演變而來, 可以簡單理解為一種藉助於標記符格式化電子文件的語言 ,平時的書寫中你可以換行,可以設定標題、段落,但是在電子文件中如何表達? 計算機不能像人類一樣用眼分辨,用腦思考,想要說明這是一個標題,你必須顯式的告訴他 標記語言就是一種非常合適的解決方案 比如HTML中的"<h1>這是個標題</h1>",h1是標籤,標籤中的內容就是標題,我們使用h1來標誌這是一個一級標題,當計算機程式解讀到<h1>時,就可以意識到這是個標題   超級文字標記語言是全球資訊網(Web)程式設計的基礎,也就是說全球資訊網是建立在超文字基礎之上的。 超級文字標記語言之所以稱為超文字標記語言,是因為文字中包含了所謂“超級連結”點 之所以沒有直接使用通用標記語言,是因為他過於複雜,HTML是簡化的變種。   需要注意,電子文件的出現遠比web起源要早 電子文件的最初動機就是“將書稿、檔案塞到計算機中”,一份檔案,有內容也有格式(文字字型,大小,間距等) 電子化的目的是通過計算機呈現,所以電子化不僅僅需要記錄檔案的內容,還需要記錄內容的格式(樣式),你講兩行字之間空白多一點,行間距就大一點,在計算機中如何呈現? HTML就是標記語言的一種應用,他也只是一種電子文件。

瀏覽器

瀏覽器就是一個應用軟體,他可以通過HTTP協議與伺服器進行互動 根本功能也很簡單,傳送HTTP請求,解析顯式獲得的響應資料   1991年,世界上第一個瀏覽器World Wide Web(後改名為Nexus)由Tim Berners-Lee創建於歐洲核子物理實驗室 同時他還寫了第一個網頁伺服器httpd 這個瀏覽器並不支援圖片的顯示 1993年,伊利諾伊大學厄巴納-香檳分校的NCSA組織發表NCSA Mosaic,簡稱Mosaic 是網際網路歷史上第一個獲普遍使用和能夠顯示圖片的網頁瀏覽器 並於1997年1月7日正式終止開發和支援 Mosaic釋出後,到底怎麼分辨你的瀏覽器是否支援顯示圖片呢?UserAgent就是在這樣的場景下誕生了 Mosaic將自己標誌為NCSA_Mosaic/2.0(windows 3.1) 這也是我們使用瀏覽器傳送請求的時候請求頭有一個欄位為UserAgent的最開始原因 著名的瀏覽器如下,國內的瀏覽器廠商都是用國外的瀏覽器核心 瀏覽器發展歷史: http://www.cnw.com.cn/zhuanti/2009-ie/
1991 www(nexus)
1993 Mosaic
1994 Netscape
1996 IE
1996 Opera
2003 safari
2004 firefox
2008 chrome
  有一篇很有意思的文章, 可以一看 http://www.cnblogs.com/ifantastic/p/3481231.html https://webaim.org/blog/user-agent-string-history/   chrome可以通過在瀏覽器位址列輸入“about:version”檢視UA資訊 還可以通過網站檢視:http://www.useragentstring.com/ image_5c35493c_3798

伺服器

Web伺服器是可以向發出請求的瀏覽器提供文件的程式,也是一種軟體。 遵循HTTP協議,接受瀏覽器客戶端發起的請求,並按照HTTP協議的規定響應的一種軟體。 現在也把提供web服務的專用計算機叫做web伺服器,提供web服務的程式叫做web容器。 https://en.wikipedia.org/wiki/Web_server中有關於web server的介紹 還可以通過:https://w3techs.com/technologies/overview/web_server/all  檢視目前各大web Server的使用率   image_5c35493c_1198 現代的web 容器都是強大而複雜的,但是根本是相同的,那就是接受HTTP請求,並且按照HTTP協議進行響應。

WEB周邊元件-域名與DNS

域名(Domain Name),簡稱域名、網域 是由一串用點分隔的名字組成的,表示Internet上某一臺計算機或計算機組的名稱 用於在資料傳輸時標識計算機的位置 我們知道計算機在網路中的通訊需要藉助於ip地址,但是ip地址即使是點分十進位制,依然難以記憶 域名就是為了簡化記憶,更加便於使用 簡言之,域名等於一個ip的名字 如果每個ip相當於電話號碼,那麼域名就是姓名 image_5c35493c_311f 姓名和號碼之間必然是要有對映關係 早期,網路上計算機個數很少 將對應關係儲存在一個共享的靜態檔案hosts中即可,再由hosts檔案來實現網路中域名的管理 也就是說,大家通過共享這個檔案來完成ip與域名的對映,這個hosts檔案就是域名IP的解析器 但是隨著網路上計算機的增多,顯然不能將所有的域名與ip地址的對應關係都記錄在檔案中 所以出現了DNS(Domain Name System),為了解決網際網路上域名與IP地址的對映解析   百度百科:“域名解析服務,最早於1983年由保羅·莫卡派喬斯發明; 原始的技術規範在882號因特網標準草案(RFC 882)中釋出。 1987年釋出的第1034和1035號草案修正了DNS技術規範,並廢除了之前的第882和883號草案。 在此之後對因特網標準草案的修改基本上沒有涉及到DNS技術規範部分的改動。   現在的作業系統中仍舊保留hosts這一檔案,只不過不再是全網的了,已經有專門的DNS了 image_5c35493c_742a   域名採用樹狀的層級結構,任何一個連線在網際網路上的主機和路由器,都有一個唯一的層次結構名字,也就是域名 這裡的域(domain)是名字空間中的一個可被管理的劃分。域還可以劃分為子域,而子域還可以繼續被劃分為子域 這就形成了子域,二級域,三級域... 每個域名都由一個標號構成,標號之間使用小數點分割,如下圖所示 image_5c35493c_793 可以認為,將域名空間按照頂級域名進行劃分,形成了域名的基本格局,就像“四大洋,七大洲” 也可以理解成國家行政區域的劃分。 中國 江蘇.中國 南京.江蘇.中國 所以要深入理解域的概念,頂級域的並集就是全部的域空間 比如說,全世界共有XXX個國家和地區,那麼,就是隻有那麼多個國家和地區 任何一個域名,都是一個頂級域名的子域,頂級域的劃分,完成了域名空間的頂層管理 DNS規定, 每一個標號不允許超過63個字元,也不區分大小寫 ,標號中除了使用連字元外不能使用其他的標點符號 級別最低的標號位於域名最左邊,級別最高的頂級域名位於域名最右邊 既不規定每一個域名需要有多少個下級域名 也不固定每一級的域名代表什麼意思 各級域名由他的上級域名管理機構進行管理 最高的頂級域名由ICANN進行管理 葉子節點指向物理機器 image_5c35493c_3367  

DNS解析過程

上面介紹的域名體系是邏輯上的,DNS伺服器的執行按照“區”來進行劃分 域名的體系結構按照“域”來劃分,伺服器實際的查詢解析,則是按照“區”, 簡言之,邏輯上就相當於按照行政區域劃分,實際管轄上則是分片區管理 區可能小於或者等於一個域,但是肯定不會大於域 一個區中所有的節點必須是聯通的,每一個區設定相應的 許可權域名伺服器(authoritative name server), 用來儲存該區中所有的域名與IP地址的對映 image_5c35493c_4ab0

域名伺服器分類

根域名伺服器 最高層次的域名伺服器,最重要的域名伺服器,所有的根域名伺服器都知道所有的頂級域名伺服器的域名和IP地址 如果所有的根域名伺服器掛掉,整個網際網路將會癱瘓 頂級域名伺服器 管理在該頂級域名伺服器註冊的所有的二級域名,收到請求後,給出響應(要麼直接返回結果,要麼給出下一步應該查詢的域名伺服器的IP地址) 許可權域名伺服器 負責一個區的域名伺服器 如果一個許可權域名伺服器不能給出最後的查詢結果,會通知發出請求的DNS客戶,下一步應該找哪個許可權域名伺服器 本地域名伺服器 本地域名伺服器不是域名管理層次中的一環,主要作用是為了高效節能 每個網際網路ISP ,每個大學、機構都可以有一個本地域名伺服器 windows中關於DNS的設定就是本地域名伺服器,也叫做預設域名伺服器 image_5c35493c_db8  

查詢方式

查詢方式共有兩種:迭代查詢,遞迴查詢 image_5c35493c_5e68 迭代查詢-->我不知道你找XXX去,一直踢皮球 遞迴查詢-->我去幫你查,一直很仗義 主機向本地域名伺服器的查詢一般都是採用遞迴查詢 本地域名伺服器向根域名伺服器的查詢通常是採用迭代查詢   簡單理解就是域名邏輯上是樹形的層級結構,按照域進行劃分 DNS域名伺服器按照區進行劃分,每個區小於等於一個域,對域進行分片管理 DNS的域名伺服器就是與域名層次等級結構相對應的一個伺服器結構體系  

WEB技術發展

最初,所有Web頁面都是靜態的 使用者請求一個資源,服務再返回這個資源,在瀏覽器中主要展現的是靜態的文字或影象資訊。 GIF圖片則第一次為HTML頁面引入了動態元素 這些網站的Web頁面只是電子形式的文字,內容生成之後就是固定不變的,然後釋出到多處 image_5c35493c_41ac 在瀏覽器發展的最初階段,Web頁面的這種靜態性不成問題,科學家只是使用Internet來交換研究論文,大學院校也只是通過Internet線上釋出課程資訊等 隨著網頁從學術機構走向公眾社會,網頁承載的功能便超出了學術範圍而變得愈加豐富,因此早期網頁的侷限性也逐漸顯露出來 學術自然是枯燥的,走向社會就不一樣了,娛樂生活等等,所以使用者自然對web能提供的服務有了更多的需求(期望),這是一個很自然的需求演變

CGI

人們當然不滿足於訪問web伺服器上的靜態資源 1993年CGI(Common Gateway Interface)出現了 CGI定義了Web伺服器與外部應用程式之間的通訊介面標準,Web伺服器可以通過CGI執行外部程式,讓外部程式根據Web請求內容生成動態的內容。 通常的處理流程是:
  1. 通過Internet把使用者請求送到web伺服器。
  2. web伺服器接收使用者請求並交給CGI程式處理。
  3. CGI程式把處理結果傳送給web伺服器。
  4. web伺服器把結果送回到使用者。 
image_5c35493d_6fd1 伺服器在認為這是一個CGI請求時 會呼叫相關CGI程式,並通過環境變數和標準輸出將資料傳送給CGI程式 CGI程式處理完資料,生成html,然後再通過標準輸出將內容返回給伺服器,伺服器再將內容交給使用者,CGI程序退出 在這個過程中,伺服器的標準輸出對應了CGI程式的標準輸入,CGI程式的標準輸出對應著伺服器的標準輸入。 可以理解為,請求轉變為了CGI程式的引數(以環境變數的形式傳遞),CGI的輸出變成了web伺服器的響應(CGI程式中直接向標準輸出列印HTML頁面)   CGI是一種標準,並不限定語言。所以Java、PHP、Python都可以通過這種方式來生成動態網頁。 它規定了web伺服器向CGI程式傳送資料的格式約定(比如環境變數中有哪些值),以及響應的約定等內容(生成HTML頁面)。   為什麼使用CGI介面,而不是直接web伺服器就提供這些功能? 如果web伺服器提供這些功能,必然會導致web伺服器的設計與開發過於複雜 而且,一旦web伺服器實現了這些功能,開發者勢必要按照web伺服器提供的技術框架基礎下進行開發,大大限制了生產力 所以藉助於CGI介面,即能夠提供呼叫外部程式處理的能力,也將這些功能從web伺服器中解耦,解放了生產力。   可想而知,有了CGI,web發生了多大的變化 不僅僅可以提供靜態的資源了,還能夠進行動態的處理,資料的計算等
但是,每當一個CGI請求過來時,web伺服器會fork一個子程序來執行相應的CGI程式,當請求結束時,該CGI程序也隨之結束 這樣不停fork程序的開銷是非常大的,這是造成CGI程式效率低下的主要原因 後來出現了fastcgi,是改良版的CGI 而且,試想一下,當你要用C語言或者C++等等去一點點的處理html的內容,去拼接,去列印,是不是很辛苦?

char MimeType[]="text/html";

fprintf(stdout, "Content-type: %s\r\n\r\n", MimeType); //輸出響應頭,響應頭之後要加兩個"\r\n"

fprintf(stdout, "<html><head><title>這是一個CGI小程式</title></head>\n");

fprintf(stdout, "<body>這是一個由C編寫的CGI小程式</body></html>\n");

做過js拼接的就可以理解,但是很顯然,之前的CGI比你做過的js的拼接還要噁心  

web程式設計指令碼語言

人們發現,對於一個HTML頁面,往往發生變化的只是很少一部分資料,很大一部分仍舊是靜態的 比如一個只有一個頁面訪問計數器的頁面,唯一動態的資料就是那個“計數”,整個的頁面的其他部分都是靜態的。 是不是可以將不變的部分與變化的部分進行解耦呢? 於是又進化出後來的web程式設計指令碼語言 PHP於1994年由Rasmus Lerdorf建立,剛剛開始是Rasmus Lerdorf為了要維護個人網頁而製作的一個簡單的用Perl語言編寫的程式。 這些工具程式用來顯示 Rasmus Lerdorf 的個人履歷,以及統計網頁流量。 後來又用C語言重新編寫,包括可以訪問資料庫。 他將這些程式和一些表單直譯器整合起來,稱為 PHP/FI,也就是說 最初是C語言編寫的CGI程式的封裝整合整合 PHP實現了與資料庫的互動以及用於生產動態頁面的模板引擎 PHP可以把程式(動態內容)嵌入到HTML(模版)中去執行,不僅能更好的組織Web應用的內容,而且執行效率比CGI還更高 之後96年出現的ASP和98年出現的JSP本質上也都可以看成是一種支援某種指令碼語言程式設計(分別是VB和Java)的模版引擎 web程式設計指令碼語言是CGI的進一步演化與抽象,使CGI的開發使用更加高效易用,核心思想還是CGI 有了這些指令碼語言,搭配上後端的資料庫技術,Web的功能更加強勁,可以通過Web技術來構建幾乎所有的應用系統。 image_5c35493d_15c1  

企業開發平臺

兩大重要陣營J2EE/.NET   Sun公司在1998年發表JDK1.2版本的時候, 使用了新名稱Java 2 Platform,即“Java2平臺” 修改後的JDK稱為Java 2 Platform Software Develping Kit,即J2SDK。 並分為標準版(Standard Edition,J2SE), 企業版(Enterprise Edition,J2EE),微型版(MicroEdition,J2ME)。J2EE便由此誕生。   當Web開始廣泛用於構建大型應用時,系統的穩定性安全性分散式等方面的要求變得更高 在許多企業級應用中,例如資料庫連線、郵件服務、事務處理等都是一些通用企業需求模組 這些模組如果每次在開發中都由開發人員來完成的話,將會造成開發週期長和程式碼可靠性差等問題 於是許多大公司開發了自己的通用模組服務,這些服務性的軟體系列統稱為中介軟體  J2EE就是使用Java語言,開發企業級web應用的一整套的解決方案 Java Servlet、Java Server Pages (JSP)和Enterprise Java Bean (EJB )是Java EE中的核心規範 Servlet和JSP是執行在伺服器端的Web元件 讓Java開發者同時擁有了類似CGI程式的集中處理功能和類似PHP的HTML嵌入功能 此外,Java的執行時編譯技術也大大提高了Servlet和JSP的執行效率   Sun正式釋出了J2EE版本後,緊接著,遵循J2EE標準,為企業級應用提供支撐平臺的各類應用服務軟體爭先恐後地湧現了出來。  IBM的WebSphere、BEA的WebLogic都是這一領域裡最為成功的商業軟體平臺。 簡言之,Java本身的跨平臺性非常適合web應用開發,Java也抓住了這一機遇,提供了企業級應用一整套的開發方案。

框架的百家爭鳴時代

隨者兩大平臺的誕生,web的技術發展趨於成熟與穩定,人們希望能夠更好更快更高效的開發web 各種輔助web開發的技術,百花齊放,百家爭鳴 web應用越來越複雜,各種功能的頁面,各種各樣的URL地址,大量的後臺資料  MVC的概念被引入到web專案中來,出現了Structs   Spring MVC等 控制器Controller負責響應請求,協調Model和View Model,View和Controller的分開,是一種典型的關注點分離的思想, 不僅使得程式碼複用性和組織性更好,使得Web應用的配置性和靈活性更好。   此時,資料的訪問也不僅僅是直接sql訪問,出現了ORM(Object Relation Mapping)的概念 2001年出現的Hibernate就是其中的佼佼者 更多的全棧框架開始出現,比如2003年出現的Java開發框架Spring 同時更多的動態語言也被加入到Web程式語言的陣營中 2004年出現的Ruby開發框架Rails,2005出現的Python開發框架Django 都提供了全棧開發框架,或者自身提供Web開發的各種元件,或者可以方便的整合各種元件。

前端技術發展

JavaScript

隨著web伺服器的發展,在能夠進行動態資料的處理之後,湧現出來了新的問題。 伺服器負責表單的一些校驗工作 看起來好像沒什麼,但是站在當時的環境下,在那個絕大多數使用者都在使用調變解調器上網的時代,網路是很低速的 使用者填寫完一個表單點選提交,需要很多秒,才能得到伺服器的反饋 然而最後完了伺服器反饋給你說某個地方填錯了......你是不是會崩潰? 人們希望是否可以在客戶端進行這些基礎校驗工作,這就是Js誕生的背景 JavaScript誕生於1995年,前身是livescript 最開始是由瀏覽器廠商Netscape(網景)著手開發的,起初這是一種“自導自演”的語言。 你可以這麼理解,瀏覽器是我自己開發的一個軟體,我為了實現某種功能定義了一些規範條件語法,創造了一種語言 比如我說在我這個軟體內var可以定義一個變數,我的這個軟體就認識這個var,別人家的瀏覽器其實是不認識的 我自己的軟體,可以解釋我自定義的語言 就好比你定義了一個XML檔案的格式,然後你編寫相應的方法用於解析XML,是類似的邏輯   當然,瀏覽器不止一家,出現了這麼一個好東西,大家就會都去搞,撕逼大戰熱火朝天 最終出來機構調節停火,也就是出臺了 ECMAScript這是一個 規範 由ECMA-262定義的ECMAScript其實與Web瀏覽器沒有依賴關係,Web瀏覽器只是ECMAScript實現可能的宿主環境之一   JavaScript是一個ECMAScript規範的實現,就好像HotSpot遵循java虛擬機器規範一樣 完整的js實現包括 1.核心(ECMAScript) 2.文件物件模型(DOM) 3.瀏覽器物件模型(BOM)

CSS

另外由於專案應用規模的不斷擴大,頁面也越來越越複雜,你會發現,將樣式與模板放到一個頁面上 是一個非常糟糕的設計思路 1996年12月W3C推出了CSS規範的第一個版本 CSS(Cascading Style Sheets,層疊樣式表)是一種將表示樣式應用到標記的系統 CSS以設計、改變其HTML頁面的樣式而知名,並使用於Web和其他媒介,如XML文件中 CSS依附於HTML的結構對其樣式進行渲染

AJAX/前端框架/Node

而對於瀏覽器端,除了前面提到的js  css 在98年還出現了AJAX,05年之後大放異彩 一個頁面上,有絕大多數的資料是固定不變的,所以演變出模板的形式,動態的渲染資料 然而,在很多時候,也並不是頁面上的資料全部都需要變化,可能需要變化的僅僅只有很細微的一個地方 但是,哪怕你僅僅需要變動的是一個數字而已,也仍舊需要重新載入整個頁面,這顯然是資源的浪費,以及沒必要的等待 ajax就是為了解決這個問題的而出現的一種區域性重新整理的技術 AJAX即“Asynchronous JavaScript and XML”(非同步的JavaScript與XML技術) 指的是一套綜合了多項技術的瀏覽器端網頁開發技術 可以基於JavaScript的XmlHttpRequest的用於建立互動性更強​的Web應用。   ajax的出現,可以讓前後端工程師以ajax介面為分界點進行前後端分離 規定好互動介面後,前後端工程師就可以根據約定,分頭開工 開發環境中通過Mock等方式進行測試,同時在特定時間節點進行前後端整合測試。 但是,隨著業務功能的愈發複雜 這種模式本質上和JSP時代的Web開發並無本質區別,只不過是將複雜的業務邏輯從JSP檔案轉移到了JavaScript檔案中而已。 所以很自然的又把MVC模式應用到了前端 前端開發也出現了大量的MVC框架 比較典型的包括BackboneJS, AngularJS, EmberJS, KnockoutJS。   隨著各大瀏覽器的競爭,引擎越來越牛逼 Google V8引擎的效能已經足以執行大型Javascript程式 在V8之上加以網路、檔案系統等內建模組,形成了如今的Node.js 隨著Node.js的出現,JavaScript開始擁有在服務端執行的能力 它的非同步本質使得Node.js在處理I/O密集型業務中優勢凸顯 而大多Web業務中I/O效能都是瓶頸   關於網路的演變,可以檢視 http://www.evolutionoftheweb.com/ 圖形化的展示了演進過程。

總結

以上可以看得出來,WEB的發展從提出一直都是在迅猛發展,WEB架構的核心思想一直都沒有變化過:BS結構瀏覽器和伺服器,通過HTTP協議互動,藉助於URL進行資源定位,最終獲取響應,而響應的內容則是HTML。 儘管WEB的規模在不斷的變化,甚至可以說與日俱增的變化,核心是沒有變化的 而WEB變化的方向也可以說是非常明確的,那就是工作的精細化拆分,不斷地分工,不斷地分工。 最開始需要動態處理的能力,所以藉助於CGI程式,將處理能力外包; 專案不斷擴大,所以按照功能進行拆分引入MVC模式; 引入模式後為了更便於開發維護,又出現了各種框架簡化開發; 靜態的模板內容和動態的資料內容相互耦合,所以進行分離; 模板與樣式相互偶爾交織在一起,所以HTML結構與樣式分離; 動態能力全部位於伺服器所以出現了JS使客戶端具有處理能力; 同步的處理資料量太大卻有時又沒有必要,所以出現了AJAX; 請求太多,一臺伺服器無法處理,所以出現了負載均衡; 一個數據庫資料量太大,所以開始分庫分表; 應用體量太大,所以將應用服務本身進行拆分,出現了分散式; 等等................................ 可以看得出來,整個WEB專案發展基調如此: 活範圍太寬,事兒太多怎麼辦?拆分、解耦!!! 活還是太多了幹不完,咋整?分工!!! 分工、解耦、拆分、分工、解耦,拆分、水平拆分、垂直拆分、各種拆分.........   原文地址:網際網路與Web技術的發展 網路發展簡介(三)