關注移動Web應用性能問題（上）

移動平臺逐漸成爲客戶端應用的主流載體之一，爲了消除應用在不一樣移動平臺的兼容性，採用Web形式開發移動應用成爲潮流（固然特別依賴於原生功能和 性能的應用，如遊戲可能例外）。隨着Web移動應用愈來愈多，其性能方面的分析與研究也逐漸受到重視。本文試圖從多個角度來闡述移動Web應用性能優化的 各個方面，其中主要引用了Google性能優化專家Steve Souders的精彩觀點，但願可以爲國內移動開發社區帶來一些啓示。

隨着Web2.0應用的普遍採納，Web性能愈來愈受到重視。有關Web應用的性能調優標準早已經深刻人心，如Yahoo！的《Best Practices for Speeding Up Your Web Site》和Google的《Web Performance Best Practices》，這些標準在桌面瀏覽器的Web性能分析中起到了關鍵的做用，ComScore稱：Verizon的iPhone手機在二月頂部

如今輪到移動平臺的性能調優了。技術專家Steve Souders以前在博客中宣佈，從此他將會把大部分時間和精力放在移動Web性能的研究工做上，其基本的思路歸結爲以下幾點：

• 衡量：肯定分析性能的指標和標準。
• 分析：經過工具對性能問題進行度量。
• 研究：分析性能問題，找出根源。
• 最佳實踐/分享：總結出最有可能改進移動性能的各類方法，併發布出來。
• 提示：開發提示性能問題的工具
• 自動化：提供服務修補問題。

讀者可能會問：爲何要特別關注移動Web應用性能問題？傳統的桌面Web應用經驗不能適用嗎？咱們簡單列舉一下移動平臺的幾個特殊性：

• 移動設備的硬件限制。
• 移動瀏覽器的精簡實現。
• 移動網絡的不穩定性。
• 移動Web開發的發展階段。

從上面四點，讀者會發現移動Web應用有其特殊的生存環境，傳統的Web性能優化標準不能徹底適用於移動平臺，因此咱們須要單獨將其做爲一個研究領 域。考慮到移動網絡的不穩定性，Souders建議你們先去掉這一不穩定因素，即首先關注經過wifi上網的移動設備的性能問題，這樣就縮小了研究的範 圍。等時機成熟了再全面引入網絡環境的性能影響。

目前，移動Web應用的性能研究工做主要困難在於——工具太少！大多數瀏覽器工具（Firebug、Page Speed、YSlow、Dynatrace）都運行在桌面操做系統上，不支持移動設備，其中有一些工具是瀏覽器插件，可是目前不支持安裝在瀏覽器的移動版本上，另一些則是特定的桌面操做系統的可執行文件，一樣不支持移動平臺。Steve Souders分析了當前桌面工具的可用性：

• Bookmarklet（小書籤，是除了瀏覽器插件的又一擴展形式）通常適用於全部瀏覽器。它們是純JavaScript腳本，也支持移動瀏覽器。
• Greasemonkey適用於大多數瀏覽器。它們大部分是JavaScript代碼，一小部分是依賴於瀏覽器的API，所以難以構建。它們優於Bookmarklet的特色在於功能稍微強大一點，包括自動啓動等。
• 瀏覽器插件是最強大的，但也是最難構建的。開發過程根據瀏覽器而異，大多數非主流瀏覽器不支持插件。

從以上的分析來看，bookmarklet是當前最方便的工具選擇，Souders推薦了一套優秀的分析bookmarklet工具包，包括：Firebug Lite、DOM Monster、SpriteMe、CSSess、Zoompf和Page Resources。爲了方便性能分析人員使用，他創建了一個meta-bookmarklet頁面，你們能夠經過訪問一個網頁使用全部的bookmarklet工具！在移動瀏覽器上安裝的過程也比較簡單：

1. 單擊連接Mobile Perf bookmarklet。
2. 將該頁加入書籤。
3. 編輯書籤的URL，刪除#以前的全部內容，只保留以"javascript:"開頭的URL便可。