March 31, 2008

QtWebKit: 將 Web 2.0 技術帶入行動通訊的系統設計

稍早提過 [Qtopia Core 更名為 Qt for Embedded Linux] 的新聞,這是 Nokia 入主 Trolltech 後,對產品定位概念做了釐清,強調 Qt 的跨平台能力與針對底層系統軟體整合的訴求,同時,我們也可以發現 Trolltech 的新聞稿如 [Announcing the Qt WebKit Integration],就下了名為 "Trolltech’s Qt WebKit Integration brings Web 2.0 services to mobile phones" 的副標題,這是很值得玩味的市場資訊。

活躍且嚴謹發展的 [WebKit] 專案為資訊技術應用,帶來許多新的可能,不同於以「平台」概念延展的 Mozilla/Firefox,WebKit 從其前身 KHTML 開始,就定位於結構優雅、設計洗練的 Web rendering toolkit,這也是 Apple 相中 KDE 團隊 KHTML engine 的原因。經過一番波折與分分合合的開發歷程,WebKit 的開發在 KDE KHTML 團隊成員 Lars Knoll, Simon Hausmann, George Staikos, Zack Rusin 等人的努力,又重新加入 Qt 的支援,有別於已成熟的 KHTML,WebKit 的 Qt 實做部份稱為 "QtWebKit"。與其他 WebKit 既有的平台相依移植如 Gtk+、WxWidgets 或 MS-Windows 相較,QtWebKit 的角色更超越了「平台移植」,實際上,QtWebKit 能與 Qt Framework 作無接縫 (seamless) 的整合,而 Trolltech 也宣示 Qt 4.4 系列內建 Qt WebKit Integration (這是市場行銷術語,其實就是 "QtWebKit"),下圖是概念呈現:

我們可發現,QtWebKit 之於 Qt Framework,地位等同於 Qt4 其他模組,實做上則透過 Qt Core Module (C++ application framework,包含 WebKit 模擬的 Qt API,在 QtWebKit 是直接對應到 native)、Qt Network Module,與 Qt GUI Module 等予以實現 HTML4/5 的規格與具體描繪/編輯動作,詳情可參考 Trolltech 的白皮書 [WebKit in Qt and Qtopia] (PDF 文件)。如此一來,Qt/Qtopia 應用程式得以直接透過 QtWebKit 嵌入 Web 畫面,而時尚的 Web 2.0 技術也得以悄悄融入行動通訊平台的呈現中,在新聞稿中提供三份展示動畫,很值得一看,我們可發現,連 Qt Designer 這種原本靜態的版面編輯工具,也被擴充為允許嵌入動態網頁,在設計階段即可作前期評估與設計調整等動作,在以往幾乎是設計師企求而無法達成的美夢。

技術面探討 QtWebKit,可參閱資深 KDE 開發者 Simon Hausmann 在去年 foss.in 的研討會議程 [QtWebKit]。概念上來說,QtWebKit 基本上是 "QT wrapper around the WebKit rendering engine",但實做面透過 Qt Framework,包含 text handling, painting, networking,並提供簡單易用的 Qt 風格 API,其設計簡潔卻功能強大,有以下元件:
  • qWebView - browser widget
  • qWebSettings - 允許細部調整行為模式
  • qWebPageHistory/qWebHistoryItem - 完整的頁面歷史追蹤處理
提到這,不禁要談談 Qt/KDE 開發者對於 design patterns 的執著,即使是「處理瀏覽器歷史頁面紀錄」這種看似微不足道的項目,深入思索後,仍可以 Qt 的 Model/View 來改良設計,詳情參考 [Advanced example of Model/View]。當然,Web 技術不若想像中 "rendering" 如此單純,WebKit 花了很大的心力去改善 ECMAScript/JavaScript 執行環境,QtWebKit 則進一步針對運算資源做了調整,並充分整合到 Qt Framework,說得很玄,看看以下例子:
  • 在 Qt/C++ 應用程式中執行 frame->evaluatejavascript( " ... " ) 即可在頁面動態植入一段 JavaScript
  • 透過 frame->addToJSWindowObject(myObject) 一類的陳述句,可在 Qt/C++ 應用程式中直接獲得特定 JavaScript 的 QObject, signals-slots, properties 等資訊,換言之,我們可用 Qt 一貫的方次來更動 Web 2.0 Ajax 的執行模式
此外,談談 QtWebKit 的國際化支援。在 Gtk+ WebKit 的實做中,儘管 Gtk+ 有傲人的國際化支援能力 (君不見偉大的 Pango 令多少廠商噤若寒蟬?),但文字處理的部份仍依賴 IBM 的 [International Component for Unicode] (ICU),這點與其他 WebKit 雷同,但是 QtWebKit 不這麼作,因為 Qt Framework 本身就有足夠的多國語文支援能力,而且可依據需求去調整組態環境的使用 (footprint),所以 QtWebKit 將部份 WebKit 的文字處理引擎轉以 Qt 內部實做,並且可以一致的 QConfig 作統籌調整。在上個月份開始,QtWebKit 也支援 X11 與 Embedded Linux 平台的輸入法支援,而且,總是將效能列入重要考量。

兩年前遇到一個案子,需要在 20 Mb 的 NAND Flash 空間中運作完整的 Linux 與 Web browser,除了基本的中文處理、無線網路能力、基礎的 PIM 之外,而且指明要支援 Google Maps 一類嶄新的 Web 2.0 服務,這是一個嚴苛的挑戰,還好我們有 Qtopia。如今,我再次透過 QtWebKit 來重新檢視過去的設計,拿 qt snapshots 來作開刀對象,這裡以 "qt-x11-opensource-src-4.4.1-snapshot-20080328" 為主。方法是建構足以運作 QtWebKit 的 Qt core/network/gui 等模組,然後儘量去降低資源使用量,以下是在 Linux/X11 的實驗畫面:

畫面呈現了 QtWebKit 開啟 Google Maps,顯示效果與效能都很不錯,而且整個 Qt + QtWebKit 的程式空間還控制在 5 Mb 以內。關於此實驗,[在此] 可取得 config, patch, prebuilt pkg 等檔案,QtWebKit 的成熟度令人驚艷!

Qtopia 4 儼然是 Linux 史上最完整的 free software application framework for mobile computing,如今納入 QtWebKit 的整合,更加確定其地位,現在 Trolltech 火力全開地宣示:
    「我準備好了」
此舉為行動通訊運算平台注入了強心針,各位架構設計者與工程人員,思考好未來的系統了嗎?
由 jserv 發表於 March 31, 2008 03:24 PM
迴響

拜讀您的大作
讓我更加深信QTWebKit是值得投資的方向

Akio 發表於 March 31, 2008 08:13 PM

对我很有价值,谢谢!!
但是我按照您所给出来的configure和patch得到的QtWebKit却有13.7M。不知道你给出的4.5M的QtWebKit另外又做了哪些处理?
由于没有找到qt-x11-opensource-src-4.4.1-snapshot-20080328,我使用的是qt-x11-opensource-src-4.4.1-snapshot-20080319。
静候佳音,感激不尽!!

Ken 發表於 June 3, 2008 03:47 PM
發表迴響









記住我的資訊?