1. 程式人生 > >[iOS]關於 App 混合(Hybrid)開發的優化,包括H5、Weex等(本篇博客主要針對 iOS 應用講解,但該思想同樣適用於Android)

[iOS]關於 App 混合(Hybrid)開發的優化,包括H5、Weex等(本篇博客主要針對 iOS 應用講解,但該思想同樣適用於Android)

color 數據 後臺 lib 新版 生成 下載地址 代碼 版本

  我們知道混合開發,可以節省很多成本(時間成本,經濟成本等等),所以有很多公司比較鐘愛這種開發形式,今天所講的優化方式,也是我在我們公司的應用中實際用了的,而且我寫的這個優化的 SDK 已經開源到 github 上了,有興趣的同學可以下載來看一下,有不足的地方歡迎指正。這裏給出鏈接:https://.

轉載請註明出處:http://www.cnblogs.com/shisishao/p/6830736.html

-、首先,先介紹下什麽是混合開發:

  我們通常把移動開發分為Web、Native和Hybrid,但其實Hybrid又可以細分的。最簡單的是在Native中放一個WebView,然後加載一個兼容手機的網站,其實就相當於在用戶的手機上建立一個快捷方式,也算是占據用戶桌面的應急用法吧。用這種方法要註意檢測網絡是否正常,不正常要給予提示,否則蘋果是不予通過的。第二種是將Web相關文件全部放在本地,數據庫一樣用Sqlite做本地存儲,用戶就算不聯網也能工作,或者是以Native為主,在某些特定的模塊才會用到WebView。

  其實要我說,只有第二種才算是真正的Hybrid。很重要的一點是Native和Web有沒有交互,沒有的不算,你直接在WebView中加載一個HTML頁面,這算哪門子的Hybrid開發,這種也談不上什麽技術含量了,沒什麽好講的。這種開發很難模擬Native的體驗,用戶一眼就看出這是網頁,我說的Hybrid開發是那種多數用戶看不出差別的,本篇博客也是針對於第二種形式進行優化的。

二、根據策略,實現不同場景的優化:(這裏我們以 Web build生成的 js 文件為例,當然 Weex 也是同樣的道理)

  1、如果你的應用中的 js 文件是部署到遠程服務器的,也就是說每訪問一個 Web 界面,都是根據 Url 去下載該頁面的js文件然後再加載出來,這個時候其實就有個弊端了,也就是我每次進入同一個界面,都要下載一次該界面的 js 文件。那有沒有辦法,讓我只需要下載一次,下次再進入就不用再下載,而是直接加載已經下載好的呢?答案是肯定的。接下來,我們就重點講解,如何實現這個辦法:就是應用啟動的時候,我們先去下載所有 js 的壓縮文件包-->然後解壓-->替換-->訪問-->加載,具體實現:

  (1)每次應用啟動的時候,我們先請求一個後臺接口,用來告訴我們:有沒有新的 js 包要下載和下載地址,如果有就去下載,這個時候就有問題了,如果我的 js 包還沒下載完成我就點進了某個 Web 界面怎麽辦,這個時候不就顯示不出來了嗎?別急,我們不是還有線上的服務器嘛,所以,每訪問一個 Web 界面,我們先要判斷本地(沙盒中或者叫硬盤中)有沒有相應的 js 文件(可以根據Url鏈接來判斷),如果有就訪問本地的 js 文件,如果沒有就去遠程下載。這個時候不就解決了 js 包沒下載完成就進入界面的問題了嘛,哈哈完美,所以,既然我們說的是優化,就不可能影響正常使用,而是在正常使用的基礎上提升用戶體驗,要不怎麽能叫優化呢。

  (2)更新 js 包:每次更新線上服務器的 js 文件的時候,這個時候應用要下載的 js 包也要一起更新,也就是要保持兩份文件統一。

  2、如果你的應用中的 js 文件是集成在工程中的,也就是在你的 .ipa 包中。這個時候也會有一定的弊端,比如,我本身的Native代碼沒有什麽更新,但是我的 js 文件更新了,這個時候就需要到 AppStore 上傳一個新的版本,然後等待蘋果漫長的審核。那有沒有辦法,讓我在不提交新版應用的情況下更新掉舊的 js 包呢?當然是有辦法滴呀,接下來就是見證奇跡的時刻:

  (1)這種場景跟第一種更新的方式大同小異,就是在每訪問一個 Web 界面,我們先要判斷本地(沙盒中或者叫硬盤中)有沒有相應的 js 文件(可以根據Url鏈接來判斷),如果有就訪問本地的 js 文件,如果沒有就訪問工程中集成的 js 文件。

三、總結

  本次所講的優化主要是,能提升用戶體驗,不至於讓用戶一打開你的應用就給人一種很 low 的感覺。各種 Web 界面都要加載半天,還有可能加載失敗的情況。如果有同學想要優化這塊東西的可以參考我上面說的我自己寫的那個 SDK,場景考略的還是比較全了,因為是我們自己的應用在用,有什麽問題歡迎留言討論。

 

[iOS]關於 App 混合(Hybrid)開發的優化,包括H5、Weex等(本篇博客主要針對 iOS 應用講解,但該思想同樣適用於Android)