CEF是什麼
CEF是Chromium Embedded Framework的縮寫，是個基於Google Chromium項目的開源Web browser控件，支持Windows, Linux, Max平臺。除了提供C/C++接口外，也有其他語言的移植版。
因爲基於Chromium，所以CEF支持Webkit & Chrome中實現的HTML5的特性，並且在性能上面，也比較接近Chrome。
CEF還提供的如下特性：自定義插件、自定義協議、自定義JavaScript對象和擴展；可控制的resource loading, navigation, context menus等等。
誰在用CEF
讓我們通過一些實戰中的例子，來說明大家都使用CEF做了什麼：
-
各種瀏覽器
早期的雙核瀏覽器(IE + Webkit)，有些使用了CEF來作爲Webkit內核瀏覽器控件。
不過對於瀏覽器來說，直接在Chrome上面擴展，其實才是王道，大家現在都這麼做了（各種極速瀏覽器）。
-
Evernote Client (on Windows)
Evernote允許用戶將網頁粘貼到筆記中，還提供了插件用來將網頁保存爲筆記。
那肯定是需要在Client上面可以正確的渲染頁面咯，這個任務就交給了CEF。
-
GitHub Client (on Windows)
GitHub也打包了libcef.dll，從表現上面看，用來展示項目的ReadMe頁面的，肯定是CEF，其他地方的UI，可能部分也是用頁面來實現的。
-
QQ
QQ很早之前就通過內嵌IE來實現一些功能和界面。從去年開始，QQ引入了CEF，對一些之前用IE的地方進行了替換，這樣就可以使用一些基於Webkit的新特性，同時也獲得了速度、穩定性、兼容性方面的優勢。
-
Adobe Edge Animate & Adobe Edge Reflow
Adobe推出了一整套製作現代網頁(或者說HTML5?)的工具，取名Edge。
-
Adobe Edge Animate，做動畫用的，可以通過編輯時間線，創建原件(Edge Animate裏面叫做symbol)，來實現複雜的動畫。
-
Edge Reflow則是Design the responsive web. 有人翻譯爲響應式，其實就是自適應了。
上面兩款軟件，其基本面向的是Webkit內核的瀏覽器，那麼內嵌一個Webkit內核，來提供所見即所得的預覽、編輯界面就是必須的了。他們都使用了CEF。（後面會介紹CEF和純Webkit的差別）
-
-
Q+
Q+在Web App的概念下，爲Web頁面提供了一個運行環境(簡單來說就是：Client的一個框和一些可用的API)，支持IE和Webkit內核。
對Web開發同學來說，我們引入的Webkit內核（實際上是CEF），無需考慮IE的版本兼容問題，既提高了開發效率，又可以利用一些新的HTML5特性。當時Q+的應用市場、消息中心、壁紙、音樂Widget等應用都是基於Webkit內核開發的。
Q+項目可以說對CEF進行了比較多的嘗試，比如：
-
開發的音樂Widget，就使用了HTML5的audio標籤；
-
一些應用使用了HTML5的離線功能（就是配個manifest文件那個），當然其中也遇到些曲折，收穫了不少經驗。
-
打包的Webkit調試工具（Dev Tools）。
-
自定義協議：比如對qplus://協議的訪問，可以重定向到某個特殊文件夾之類的功能。
-
Off Screen Rendering（OSR，離屏渲染）：通過離屏渲染 + Windows的Layered Window，就製作了不規則的網頁窗口（網頁不透明區域是什麼形狀，窗口就是什麼形狀）
-
爲什麼要給客戶端內嵌CEF？
舉了那麼多例子之後，這個問題說起來就容易多了：
-
用來展示Web頁面，使用各種Web Service；
-
用Web頁面來做UI；
-
使用HTML5的特性，比如audio、canvas等，包括CSS3特性等。
-
Off Screen Rendering（OSR，離屏渲染）：
所謂的OSR，就是不創建真窗口，將整個頁面渲染到一張位圖上面。當然不只是渲染，還有一系列的API來處理鼠標、鍵盤事件，處理輸入法事件等。
這個特性在不能使用真窗口的時候特別有用，比如Layered Window上面，或者是遊戲中渲染到Texture上。
利用OSR特性，可以做出一些有趣的效果，比如：
AlloyTeam做出了Webtop，裏面用OSR做了純網頁實現的瀏覽器、播放器等。
有一個Awesomium項目，也是支持OSR，已經有遊戲項目用Awesomium來在遊戲中渲染網頁了。 （看Awesomium的輸出文件，應該和CEF的實現方式差不多，都是對Chromium的封裝，Awesomium能做的CEF應該也可以做）
我業餘時間做了一個demo，用CEF將網頁渲染到了OpenGL的Texture上面，也算是將CEF應用在遊戲中的一小步嘗試，如圖：
![in-game browser demo]( "in-game browser demo")
Why CEF?（CEF vs 其他可選方案）
IE
IE作爲內嵌的瀏覽器控件已經有很久的歷史了，準確的說是現在我們有了很多可以替代IE的方案。
CEF vs IE：
-
兼容性：
IE：內核隨着操作系統不同，版本從6到10，Web開發對這些版本的兼容工作量不可小視。
CEF：使用的是Webkit內核，從特性上看，一個CEF版本，可以對應一個Chrome的版本號，這樣Web開發就有了明確的特性集合，免去了考慮兼容性的工作量。
-
HTML5標準 & 新特性：
IE：當然舊版本的IE也不支持最新的HTML特性和標準。
CEF：毫無疑問，在對新特性的支持上Webkit和Chrome都是走在前沿的。
-
開源 & 跨平臺：
IE：不開源，限Windows平臺
CEF：開源，使用的Webkit, Chromium都是開源的，開源就意味着更多可定製的可能；且跨Windows, Mac, Linux3個平臺。
-
離屏渲染（OSR）：
IE：可以通過一些hack的方法來實現離屏渲染，但是工作量不小，而且不是官方支持的。
CEF：有專門的離屏渲染模式和對應的API。
-
普及率：
IE：所有Windows用戶都有IE，這是IE的優勢（不過有些用戶的IE設置不正缺，會導致無法使用，比如jscript.dll未註冊，導致無法使用JavaScript）
CEF：要自己更安裝包打包
Webkit
爲什麼要特意將CEF和Webkit做對比呢？
最近看了一篇很好的文章，講了Webkit到底是什麼，不是什麼，以及爲什麼要有那麼多的Webkit port： 《開發者需要了解的WebKit》
這裏大概總結一下：
Webkit是網頁的解析和排布引擎，是所有基於Webkit的瀏覽器共享的。默認的Webkit port是Safari，就是下載下來Webkit源碼編譯的版本。 除此之外還有其他的Webkit port，包括Chromium, QtWebkit等，在2D繪圖、GPU加速、JavaScript引擎、audio/video解碼等，都有不同的實現。
-
CEF vs webkit（其實可以說是Chromium vs Webkit）
V8引擎，skia的2D渲染，Chromium的GPU加速的實現，等等，藉助Chromium的優秀實現，使CEF也成爲了一個優秀的Webkit port。
CEF缺點：
做人要厚道，CEF也有自己的缺點和侷限，也不能只提優點，這裏我把CEF的缺點、劣勢介紹一下：
-
體積：
最新版的CEF，所有DLL體積加起來，應該接近40M了，壓縮之後估計也要10M+。 如果你的項目本身安裝包體積就不大，並且也無法接收這體積，那CEF不適合你。
當然對於現在按G來計算的遊戲的話，這個體積應該還是可以接受的。
普通的Client項目，就看項目本身需要使用CEF實現的特性，是否值得讓產品的安裝包增大這麼多。 當然這裏也有一些實現上的妥協，比如做安裝後下載（個人認爲這個意義不大，畢竟安裝包用戶還可以選擇用下載軟件來加速）
-
緩存：
Chrome的緩存設計成只能有一個進程讀寫，CEF自然也是如此。
對於需要多開的Client，目前只能每個進程實例指定一個不同的緩存文件夾。但是這無疑增加了硬盤佔用，也使某些本來被緩存的文件被下載了多次（比如A進程緩存了jQuery.js，B進程由於緩存不同目錄，還得去請求、緩存一次jQueyr.js）
-
OSR：
OSR目前不像真窗口模式那樣，可以使用GPU加速，OSR目前還只能使用軟件渲染，也就是說一些CSS 3D的效果無法支持。
不過OSR的特性還在不停完善中，個人認爲還是值得期待。
後續要分享的內容
寫了這麼多，算是一個CEF的簡介吧，後續要寫點兒乾貨，即如何使用CEF，包括：
CEF代碼獲取，編譯，嵌入，處理頁面和Client的API調用，OSR離屏渲染，緩存，自定義協議，CEF1 & CEF3等。
嗯，今天就到這裏吧。
