了解WebKit和Chromium: 浏覽器綜述

轉載請注明出處：http://blog.csdn.net/milado_nju/

# 浏覽器簡介

浏覽器發展到今天還是很令人吃驚的，這很大程度上得益于網際網路的快速發展和新的技術不斷湧現。浏覽器的核心是渲染引擎，通常也稱為浏覽器的核心，其是将文本，圖檔等資訊渲染成圖像，這也是浏覽器的主要功能。

現代浏覽器的始祖應該是1993釋出的Mosaic，其上司者Marc Andreessen也就是Netscape浏覽器的創始人。剛開始，其功能很簡單，也就是能渲染簡單的靜态HTML元素，沒有JavaScript，沒有CSS，更沒有現在功能豐富的各種能力。後來，這些技術逐漸被引入Netscape浏覽器并被加以實作。

受Mosaic浏覽器的深刻影響，微軟于1995年推出了Internet Explorer（以下簡稱為IE）浏覽器，開始第一次浏覽器大戰，後來大家都知道了，就是IE獲得了空前的成功，這導緻了後來它裹足不前，很長時間沒有更新和推進。而Netscape鳳凰重生，創立了一個基金會，開發了著名的Mozilla Firefox。2005年，蘋果的渲染引擎WebKit開源，這拉開了一個新的序幕，從此基于WebKit的浏覽器遍地開花，不僅包括PC市場，也包括了逐漸崛起的移動市場。随後，Google于2008年釋出了基于WebKit的Chrome浏覽器，很快深受使用者的喜愛，市場佔有率逐漸上升。

目前，對于PC市場而言，三大主流的浏覽器是MicrosoftIE、Mozilla Firefox和Google Chrome，他們占據了PC市場超過了90％的浏覽器份額，其對應的渲染核心分别是Trident，Gecko和WebKit(現在是Blink)。

對于移動市場來說，就是另外一個情形了。基于WebKit核心的浏覽器占據了絕對壟斷的地位，這是因為占據移動市場主導地位的作業系統是蘋果的iOS和Google的Android，而它們的預設浏覽器都是基于WebKit核心的。對于中國市場來說，Android上有很多定制的浏覽器，例如UC，騰訊，百度，360等，其中主要基于AndroidWebView（這是一個嵌入式的程式設計接口，以後會詳細介紹）開發，是以從核心角度來說，它們同Android預設浏覽器并無什麼大的不同。不過，它們中的一些也開始基于WebKit定制自己的核心，修改其行為以便更好适應自己的需求。

＃支援的作業系統

就三大浏覽器來說，Chrome支援的平台是最多的，基本上覆寫了桌面和移動上的主流作業系統，其次是Firefox，IE墊底，具體如下圖表格所示：

Chrome	Firefox	IE
Windows	Y	Y	Y
Mac	Y	Y	N
Linux	Y	Y	N
Android	Y	Y	N
iOS	Y	Y	N
Windows phone	N	N	Y

對于那些三者都不支援的或者非主流的作業系統，這裡就不再列出來了。

就浏覽器所使用的核心來說，WebKit支援的作業系統當然也是最多的，基本上所有現有的作業系統都支援，其次是Gecko，墊底的依然是IE。

WebKit	Gecko	Trident
Windows	Y	Y	Y
Mac	Y	Y	N(4.0後)
Linux	Y	Y	N
Android	Y	Y(but not work for android-x86)	N
iOS	Y	N	N
Windows phone	N	N	Y
BlackBerry	Y	N	N
Tizen	Y	N	N
Symbian	Y	N	N

特别指出的是，這裡WebKit是廣義上的WebKit，而不是僅僅指Chrome所使用的WebKit部分。

＃核心特性

一個浏覽器核心無非需要以下幾個主要部分，如HTML/CSS解析器，網絡處理，JavaScript引擎，2D/3D圖形引擎，多媒體支援等等

WebKit(chromium)	Gecko	Trident
JavaScript引擎	V8	SpiderMonkey	JScript/Chakra
2D圖形引擎	Skia	Cairo	GDI
3D圖形引擎	OpenGL, OpenGLes, D3D	OpenGL, OpenGLes, D3D	D3D
視訊	Windows Media Framework， FFmpeg, openmax	Windows Media Framework	Windows Media Framework，gstreamer

＃浏覽器特性

浏覽器的共同特征這裡不想贅述，例如書簽管理，曆史記錄管理，設定，開發者工具，下載下傳管理等這些基本能力。下面介紹浏覽器中所涉及的一些重要特征：

程序架構：

安全機制：包含使用者的資料和本地資訊，例如URL黑名單機制，沙箱模型等

嵌入本地代碼的能力: 浏覽器能夠運作本地代碼的能力，例如chrome的native Client和IE的activeX

書簽，曆史記錄等使用者資料同步: 書簽的雲端存儲實作多個作業系統或者終端的統一體驗。

Chrome	Firefox	IE
程序架構	不同網頁，不同程序	單一程序	不同網頁，不同程序
安全機制	沙箱模型，URL黑名單機制	黑名單機制	黑名單機制
嵌入本地代碼的能力	NativeClient，NPAPI, Chrome extension	NPAPI, 複雜的支援編寫Firefox extension的能力	ActiveX，NPAPI
書簽，曆史記錄等使用者資料同步:	Google的同步服務	Firefox的同步服務	IE8目前沒有看到，後面應該會加入該項功能

在中國的浏覽器市場上，還有一個有趣的現象就是所謂的雙核浏覽器，其本質是使用主流的浏覽器核心來兼顧相容性和性能問題，常見的做法是使用Trident來保持網頁的相容性，使用WebKit核心來提高性能和新的HTML5特性。

# 對标準的支援

目前而言，Chrome基本上是走在了支援HTML5标準的前面，Firefox其次，IE墊底。但是IE也在加大對标準的支援，這是個非常好的消息。

下面是各個浏覽器對HTML5标準的支援情況，可以使用html5test.com（檢查浏覽器支援HTML5功能的著名網站）來測試，支援的标準越多，得分越高。

Chrome	Firefox	IE
浏覽器版本	26	20	10
得分(滿分500)	468	394	320

# 使用者代理（user agent）

使用者代理是個很奇怪的東西，其作用是用來表示浏覽器的身份，因而網際網路的内容供應商能夠知道發送請求的浏覽器是什麼，它能夠支援什麼樣的功能。是以，網頁内容提供商便可以為不同的浏覽器發送不同的網頁内容，例如通常為chrome的桌面版和Android版會發送不通的網頁以适應螢幕和作業系統的差别。

最初Mozilla是設定了自己的使用者代理值，例如“Mozilla/1.0 (Windows NT 6.1; rv:2.0.1) Gecko/20100101Firefox/4.0.1”，這個含義表明這是Mozilla的windows版，使用Gecko引擎的firefox浏覽器。是以，網際網路的内容提供商就發送了特定的網頁到浏覽器。問題來了，IE發現很多内容提供商傳給IE浏覽器的内容沒有傳給Mozilla的豐富。那怎麼版呢？看看IE7的使用者代理設定了什麼你就知道了：“Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.0)”。這個值表明什麼呢？表明這是一個可以和Mozilla相容的Windows版IE浏覽器。這樣，内容提供商會根據“Mozilla”字元串資訊，發送同Firefox獲得的同樣的網頁内容。

在這之後，風氣越來越嚴重。Safari浏覽器也設定了類似的代理，但是其加入了同AppleWebKit, Safari等資訊，随着Safari的流行（特别是移動領域），Chrome等浏覽器除了包含Mozilla之外，還添加了Safari浏覽器的那些資訊，導緻它越來越長，如下:

Mozilla/5.0 (Linux; Android4.0.4; Galaxy Nexus Build/IMM76B) AppleWebKit/535.19 (KHTML, like Gecko)Chrome/18.0.1025.133 Mobile Safari/535.19

在Chrome中，你可以給使用者代理設定任何自己定義的内容。方法是加入指令行參數--user-agent=”xxx”，或者你也可以打開chrome的開發者工具->設定->使用者代理來為每個頁面設定，需要的記住是，它們都不會被儲存，是以重新開機後無效。

＃ 未來

浏覽器發展了20年，其能力越來越強，未來浏覽器會發展成什麼樣還非常難說，就目前而言，随着HTML5技術的不斷成熟，其中一個重要的方向就是，浏覽器廠商已經開始向Web的平台化方向發展，例如FirefoxOS，Chrome OS等。以後将詳細介紹。

＃參考資料

1.     http://baike.baidu.com/view/1369399.htm

2.    http://en.wikipedia.org/wiki/Trident_(layout_engine)

3.    http://en.wikipedia.org/wiki/Gecko_(layout_engine)

4.    http://en.wikipedia.org/wiki/JavaScript

5.     http://en.wikipedia.org/wiki/Comparison_of_web_browser_engines

6.     http://en.wikipedia.org/wiki/Comparison_of_web_browsers

7.    http://www.infoworld.com/d/applications/13-features-make-each-web-browser-unique-119

By [email protected]