最近做的項目大量用到了 webview ，用網頁來佈局。 Android 的 webview 是基於 webkit 內核，不過他的運行效果和 firefox 上一模一樣，所以寫的時候都是先用 firefox 測試，測試 OK 了再放到程序裏面看效果，基本上不會有什麼問題。其實 android 的 webview 跟 iphone 的 webview 差不多， iphone 上的 webview 比 android 上的強大多了。
談一下研究 webview 的一些成果：
一． 加載資源的速度不慢，但是資源多了，就很慢。圖片、 css 、 js 、 html 這些資源每個大概需要 10-200ms ，一般都是 30ms 就 ok 了。如果一個頁面上的資源很多，就很浪費時間。
二． Js 和 css 的執行速度。開始的時候，我的頁面都是用 js 生成 DOM ，添加樣式等也用 js 添加。後來發現，加載一個頁面居然要 5-6 秒。然後我就懷疑是不是 js 的執行效率不高，然後就把能用 css 的地方都用 css ，能直接寫到 html 上的就不用 js 動態生成。結果，速度並沒有多大的提升，最多提升了 1 秒。看來， Js 的執行速度雖然比不上 css ，但是還不至於慢到那種程度。那會是什麼原因使得頁面加載速度這麼慢？經過仔細的排查，最終發現，是因爲我用了 jQuery 框架。
Webview 加載頁面的順序是這樣的：先加載 html ，然後從裏面解析出 css 、 js 文件和頁面上寫死的圖片資源進行加載，如果 webkit 的緩存裏面有，就不加載。加載完這些資源之後，就進行 css 的渲染和 js 的執行。 Css 的渲染一般不需要很長時間，幾十毫秒就 ok 。關鍵是 js 的執行，如果用了 jQuery ，則執行起來需要 5-6 秒。而在這段時間，如果不在 webview 裏設置背景，網頁部分是白色的，很難看。這是一個很糟糕的用戶體驗。所以如果用網頁佈局程序，最好別用很大的 js 框架。
三． 網頁和 Java 之間的互調。這個功能是 iphone 裏面就有的，網上也有很多資料，可以告訴我們怎麼做，這些都是很簡單、很基本的。我研究了一段時間，總結一下：
1． Java 調用 js 裏面的函數，速度並不令人滿意，大概一次一兩百毫秒吧，如果要做交互性很強的事情，這種速度會讓人瘋掉的。而反過來就不一樣了， js 去調 java 的方法，速度很快，基本上 40-50 毫秒一次。所以儘量用 js 調用 java 方法，而不是 java 去調用 js 函數。
2． Java 調用 js 的函數，沒有返回值，而 Js 調用 java 方法，可以有返回值。返回值可以是字符串，也可以是對象。如果是字符串，有個很討厭的問題，第 3 點我會講的。如果是對象，這個對象會被轉換爲 js 的對象，直接可以訪問裏面的方法。但是我不推薦 java 返回給 js 的是對象，除非是必須。因爲 js 收到 java 返回的對象，會產生一些交換對象，而如果這些對象的數量增加到了 500 或 600 以上，程序就會出問題。所以儘量返回基本數據類型或者字符串。
3． Js 調用 java 的方法，返回值如果是字符串，你會發現這個字符串是 native 的，不能對它進行一些修改操作，比如想對它 substr ，取不到。怎麼解決呢？轉成 locale 的。使用 toLocaleString() 函數就可以了。不過這個函數的速度並不快，轉化的字符串如果很多，將會很耗費時間。
四． 網頁上拖動元素。網頁上有一個 div ，想要拖動它到另外一個地方，怎麼做？如果用 PC 上的網頁做法，監聽 onmousedown 、 onmousemove 和 onmouseup 就可以了。但是在手機上，事件模型就不一樣了。在網頁上點擊，拖動，然後釋放，手離開屏幕的時候， webview 纔會觸發 onmousedown 、 onmousemove 、 onmouseup 事件。所以，要想拖動，不能這麼做。這個問題困擾我很長時間，後來發現 iphone 上的做法，才解決了。 Iphone 上的 webview 有專爲觸摸屏設計的事件 ontouchstart 、 ontouchmove 、 ontouchend ，這幾個事件的響應是實時的，就能解決拖動的問題了。
五． 一些小問題。 Webview 裏面的網頁，如果有 input ，需要輸入，但是點上去卻沒反應，輸入法不出來。這種情況是因爲 webview 沒有獲取焦點。需要在 java 裏面給 webview 設置一下 requestFocus() 就行了。
六． Android 上的 webview 和 iphone 的 webview 區別。目前爲止，我發現的區別有這麼幾個：
1 ． Android 上， webview 不支持多點觸控，沒有 ongesture 系列事件，而 iphone 上有。
2 ． Android 上的 webview 不支持透明， iphone 上可以。
暫時就能想到這麼些，還有很多以後再補充吧。