1、看斷網情況
通過斷開網絡,刷新頁面,觀察內容緩存情況來有個大致的判斷,可以正常顯示的就是原生寫的,顯示404或者錯誤頁面的就是html頁面。
2、看布局編輯
3、看復制文章的提示,需要通過對比才能得出結果
比如文章資訊頁面可以長按頁面試試,如果出現文字選擇,粘貼功能的是H5頁面,否則是native原生的頁面。
有些原生APP開放了復制粘貼功能或者關閉了,而H5的CSS屏蔽了復制選擇功能等情況,需要通過對目標測試APP進行對比才可知。
在支付寶APP、螞蟻聚寶是可以判斷的。
4、看加載的方式
如果在打開新頁面導航欄下面有一條加載線的話,這個頁面就是H5頁面,如果沒有就是原生的。
5、看app頂部,導航欄是否會有關閉的操作
如果APP頂部導航欄當中出現了關閉的按鈕或者關閉的圖標,那么當前的頁面是H5頁面,原生的不會出現(除非設計開發者特意設計),美團、大眾點評的APP、微信APP當加載H5過多的時候,左上角會出現關閉兩個字。
6、判斷頁面下拉刷新的時候(前提是要有下拉刷新的功能)
如果頁面沒有明顯刷新現象的是原生的,如果有明顯刷新現象(比如閃一下)的是H5頁面(Ios和Android)。比如淘寶的眾籌頁面。
7、下拉頁面的時候顯示網址提供方的一定是H5頁面
8、利用系統開發人員工具
找到手機的設置,開發者選項,顯示布局邊界,選擇開啟后再去查看APP整體布局邊界,這樣所有應用控件布局就會一目了然。
如果是native APP那么每個按鈕、文字、圖片都是紅色的線顯示這個控件的布局情況。
如果是web APP那么應該就是一個webview去加載網頁,webview作為一個控件,只有一個邊界框,即只有屏幕邊才有紅色線。
混合APP 則是native 與 webview 混排的界面,如下圖紅色線框是各控件的繪制邊界,中間那一大塊布局豐富的界面沒有顯示出很多邊界紅線,就是網頁實現的。
那么原生開發的APP和網頁版封裝APP有何區別呢?
1.首先從開發方面:
原生開發的App
每一種移動操作系統都需要獨立的開發項目
每種平臺都需要獨立的開發語言。Java(Android), Objective-C(iOS)以及Visual C++(Windows Mobile)等等
需要使用各自的軟件開發包,開發工具以及各自的控件
我們做的手機網站打包的APP
從原生演變過來的通過APP嵌入網站來是實現的,這種應用可以使用HTML5,CSS3以及JavaScript以及服務器端語言來完成(PHP,Ruby on Rails,Python)
2.APP性能方面
原生App
能夠與移動硬件設備的底層功能,比如個人信息,攝像頭以及重力加速器等等
網站制作的App
只能使用有限的移動硬件設備功能。
3.APP數據獲取方法
原生App
- 直接下載到設備
- 以獨立的應用程序運行(并不需要瀏覽器)
- 用戶必須手動去下載并安裝這些原生App
網站封裝的APP
從移動設備上的瀏覽器訪問
不需要安裝額外的軟件
軟件更新只需要服務器更新就夠了
4.原生開發的APP和網站生成的APP優缺點對比
原生開發App優缺點:
- 比網站生成的Web App運行快
- 開發成本高,尤其是當需要多種移動設備來測試時
- 因為是不同的開發語言,所以開發,維護成本也高
- 因為用戶使用的App版本不同,所以你維護起來很困難
網站生成App優缺點:
- 無法使用很多移動硬件設備的獨特功能
- 同時支持多種移動設備,大大降低開發成本
- 需要手機網站反應速度要快,用好的服務器,否則打開會慢
最后結論:選擇哪種根據你的客戶需求和你的預算來決定的,如果預算小就選擇網站打包生成的web app ,如果想要功能多,性能好那么就是原生開發。
更多APP的介紹:http://www.youdiancms.com/cmsapprelease.html