一、APP內嵌H5和原生的區別

1、原生的頁面執行速度快，比較流暢。
H5頁面相對原生的執行效能低，特別是一些動畫效果有明顯示卡頓。

2、H5頁面的很多互動都沒有原生的好，比如彈層、輸入時候的頁面滑動 等。H5的效果相對比較low，沒有原生的好看，也沒有原生預設的動畫等效果。

3、原生APP修改頁面要重新發布，等待稽核（現在iOS的稽核速度已經提高到1天到2天）。
H5頁面的修改 可以隨時上線，不用等待稽核。

4、H5跨平臺，iOS和android需要各自開發。相對原生，H5開發成本低。

5、原生APP能很好的使用裝置底層功能，如攝像頭、方向感測器、重力感測器等。H5有所限制。
比如android裡的H5對攝像頭和方向感測器就需要再多做一些處理。再比如你不想用系統預設的手機相簿樣式，就要用原生來開發了。

6、H5過度依賴於網路，網路不好的時候卡到不行，並且剛開啟看到的都是一個空白頁面。
預設的H5頁面每次開啟都會重新請求頁面（可以做快取，不過基本很少有做的）。
H5比原生更費流量，H5除了載入html還要載入js、css這些資原始檔，相比原生網路載入速度慢。

二、APP原生和H5頁面如何分辨

1、android手機可以修改設定：  設定—》開發者選項—》顯示佈局邊界（Show layout bounds） 。
這樣就能看到控制元件的佈局了，如果包含圖片、文字等資訊的一整塊區域只有一個邊框，應該就是H5實現的。
iOS在真機上沒有這個選項。一般開發人員可以 用mac上的Reveal軟體 來檢視APP的佈局，或者用網路抓包來分析是否為H5頁面。

2、新開啟頁面，如果頁面是個空頁面，基本就是H5頁面。原生的頁面一般都會有一些控制元件提前放在頁面中。
如果空頁面 上拉還有大塊黑色的背景，就是H5頁面，不過現在很多開發人員已經做了優化，不會顯示黑色的大色斑。

3、關閉網路後，如果是整個的空白頁，這個基本就是H5頁面。如何頁面還有控制元件基本就是原生的。

4、下拉重新整理的時候H5會有一個明顯的重新整理現象，比如閃現、導航欄標題消失等。
原生的下拉重新整理沒有明顯現象，很平滑。

5、如果開發人員沒有禁用掉WebView的長按手勢，會彈出一個系統預設的快捷選單：拷貝、查詢、新增、分享。這個頁面就是H5頁面。

6、如果開啟一個頁面頂部有個進度條，就是H5頁面。當然很多H5頁面也沒有加進度條。

7、頁面的底部導航  在上拉的時候 如果跟著一起滾動，就是H5頁面。

8、H5彈框、頁面跳轉等和原生的效果都不一樣，可以仔細看下。

9、H5頁面點選 輸入框，彈出的鍵盤上面一般都有“完成”按鈕，原生的沒有。

三、APP原生和H5什麼時候使用

1、核心需求 要用原生，比如淘寶裡的產品詳情頁、訂單頁、支付頁等。
非核心需求 可以考慮用H5，遇到功能調整，可以快速釋出。比如淘寶首頁的特色好貨、熱門市場等欄目 需要經常變動，用H5來做比較靈活。

2、階段性的營銷活動頁面，特別是功能、佈局等經常需要修改的需求，可以用H5來做。比如節日的有獎活動頁面，經常需要調整，用H5做會更靈活。

四、現在常用的方案

1、有四種方式來做APP：Web App（純Web頁面）、Hybrid App（web和原生混合開發）、 Native App（原生APP）、Weex和React Native(用類似js、html來寫原生效果的頁面)。
2、現在沒有全部用H5來做APP的，互動體驗太差。
3、Hybrid App 前幾年火過，其努力去打造類似於Native App 的體驗，但仍受限於技術，網速，等等很多因素。並不是很完美。
4、現在很多大公司在嘗試用Weex和React Native或者DeviceOne 來實現一些經常改動的頁面或者活動營銷頁面，可以隨時釋出，互動效果還和原生的一樣。其中Weex站在了React Native這個巨人的肩膀上，借鑑並做了更好的嘗試，我個人更建議用Weex。