正文

原生h5是什么意思

發(fā)布時(shí)間：2023-03-17 23:47:04 稿源：創(chuàng)意嶺閱讀： 1198 問大家

大家好！今天讓創(chuàng)意嶺的小編來大家介紹下關(guān)于原生h5是什么意思的問題，以下是小編對(duì)此問題的歸納整理，讓我們一起來看看吧。

開始之前先推薦一個(gè)非常厲害的Ai人工智能工具，一鍵生成原創(chuàng)文章、方案、文案、工作計(jì)劃、工作報(bào)告、論文、代碼、作文、做題和對(duì)話答疑等等

只需要輸入關(guān)鍵詞，就能返回你想要的內(nèi)容，越精準(zhǔn)，寫出的就越詳細(xì)，有微信小程序端、在線網(wǎng)頁版、PC客戶端

官網(wǎng)：https://ai.de1919.com，如需咨詢相關(guān)業(yè)務(wù)請(qǐng)撥打175-8598-2043，或微信：1454722008

本文目錄:

1、APP原生開發(fā)和H5開發(fā)以及APP混合開發(fā)三者有什么區(qū)別？
2、h5做app和原生app有什么區(qū)別？
3、app原生開發(fā)和h5app有什么區(qū)別
4、h5做app和原生app有什么區(qū)別？

原生h5是什么意思

一、APP原生開發(fā)和H5開發(fā)以及APP混合開發(fā)三者有什么區(qū)別？

這個(gè)如果詳細(xì)說，那就是很復(fù)雜了，但是可以以口語方式簡(jiǎn)單的說

APP原生開發(fā)：就是安卓版，IOS版，和后臺(tái)，最起碼為3個(gè)人制作，3個(gè)不同的人掌握不同的技術(shù)，也就是說，這個(gè)成本最高。

H5開發(fā)：就是HTML5的網(wǎng)頁制作，也可以理解為網(wǎng)頁制作，然后加個(gè)殼打包，這個(gè)殼和打包對(duì)于外行也是比較模糊的概念，你只需要理解為最簡(jiǎn)單的html5制作就行，這個(gè)沒有什么技術(shù)含量，也最便宜。一個(gè)人可以搞定。

APP混合開發(fā)：這個(gè)是介于原生開發(fā)和H5開發(fā)之間的，難度也是居中，相對(duì)來說，技術(shù)上由2個(gè)人完成，一個(gè)前臺(tái)一個(gè)后臺(tái)，APP上有H5的制作內(nèi)容，也有原生開發(fā)的制作內(nèi)容，所以叫混合開發(fā)，或者說也有WEB開發(fā)的痕跡，這個(gè)是不能一句話說清楚的。

從價(jià)格來說這樣排列：最貴原生開發(fā)，居中混合開發(fā)，最便宜H5開發(fā)。

二、h5做app和原生app有什么區(qū)別？

1.H5的性能很差，一般經(jīng)常改的地方可以用H5，比如論壇，咨詢之類的，而且限制也是很大，很多效果是沒辦法做到的。GUI框架的WebView普遍是這樣的。如果一個(gè)APP全部由H5來做(不太可能，送審很可能被拒)，那么會(huì)顯得非常卡。

2.用iOS SDK，如果實(shí)現(xiàn)熱更新是比較麻煩的。對(duì)于論壇，咨詢這種模塊，動(dòng)不動(dòng)就改版，做起來比較頭疼，用H5就很合適了。尤其在APP跨安卓和iOS的時(shí)候，這類模塊如果直接用H5，那么就很容易共用。

H5網(wǎng)頁App開發(fā)和純?cè)腁pp的差距主要聚集在以下幾個(gè)方面：

1、動(dòng)畫

動(dòng)畫有很多種，比如側(cè)邊欄菜單的滑入滑出、元素的響應(yīng)動(dòng)畫、頁面切換之間的過場(chǎng)等等，在H5之下的眾多實(shí)現(xiàn)方法都沒有辦法達(dá)到純?cè)男阅堋Ｒ话氵@些的話有幾種不同的選擇：css3動(dòng)畫、javascript動(dòng)畫、原生動(dòng)畫。

css3動(dòng)畫非常的消耗性能，如果某一個(gè)元素用到css3動(dòng)畫可能還看不出來，但大面積或過場(chǎng)使用css3動(dòng)畫會(huì)讓app低端手機(jī)體驗(yàn)非常差。最好的選擇一般是通過框架調(diào)用底層的動(dòng)畫，但不管怎么樣等于在原來的代碼上包上了一層，性能還是不可避免的受到影響。

比如在一個(gè)新頁面的載入上，如果調(diào)用底層動(dòng)畫要考慮的問題有兩個(gè)，一個(gè)是本身資源頁面的渲染問題，另一個(gè)是遠(yuǎn)程數(shù)據(jù)的獲取。即便是這些動(dòng)畫能夠很快的響應(yīng)，但大量的css頁面會(huì)導(dǎo)致渲染卡頓，滑入時(shí)可能會(huì)有白屏/機(jī)器卡頓的現(xiàn)象。為了解決這些性能問題又必須要用到預(yù)加載或模擬動(dòng)畫。即便是這樣，滑入滑出的動(dòng)畫在低端的安卓機(jī)器上還是有很多問題，如果獲取服務(wù)端數(shù)據(jù)處理的方式不合適，卡頓白屏的現(xiàn)象會(huì)更嚴(yán)重。具體看下面的數(shù)據(jù)獲取方式。

2、獲取服務(wù)端數(shù)據(jù)

首先要接受的是，這里的數(shù)據(jù)獲取都是在資源頁面上異步完成的，因?yàn)橹挥羞@樣才能讓這些資源頁面完成預(yù)加載或者渲染。但是異步拿到的數(shù)據(jù)在填入頁面中時(shí)可能會(huì)涉及DOM操作，眾所周知，DOM操作非常消耗性能，如果頁面小還好，頁面稍大數(shù)據(jù)稍微復(fù)雜一點(diǎn)，頻繁的DOM操作會(huì)導(dǎo)致明顯的閃白。而且最重要的一點(diǎn)是，如果頁面加載進(jìn)來之后數(shù)據(jù)更新的速度太慢，也會(huì)讓頁面模板等待很長(zhǎng)時(shí)間，對(duì)用戶體驗(yàn)又不友好，總不能每次打開都像瀏覽器一樣等待刷新是吧

這個(gè)問題如果沒有得到解決，H5開發(fā)是很難承擔(dān)大規(guī)模數(shù)據(jù)的頁面，在它們之中頻繁切換更是難上加難，那么肯定有人也會(huì)想到用MVVM的方式，其實(shí)我也寫過一些基于MVVM的H5app開發(fā)，相對(duì)來說它們獲取數(shù)據(jù)和更新數(shù)據(jù)的方式更敏捷更科學(xué)，但寫的過程中又要注意很多H5獨(dú)有的問題，這些問題在下面的頁面切換里來講。

3、頁面切換

上面我們看到了幾種不錯(cuò)的實(shí)現(xiàn)方式，比如預(yù)加載和模擬動(dòng)畫，甚至有批量的預(yù)加載，批量的截圖模擬動(dòng)畫等等，雖然看起來很友好解決了不少問題，但事實(shí)上如果頁面足夠多就會(huì)引發(fā)另一個(gè)問題——頁面的生存周期。

試想一下，如果引導(dǎo)頁或者主頁面緩存了5個(gè)子頁面的資源，在跳轉(zhuǎn)到響應(yīng)的子頁面時(shí)又會(huì)緩存這些子頁面的下級(jí)頁面資源，如此反復(fù)肯定會(huì)占據(jù)大量?jī)?nèi)存使APP的體驗(yàn)下降。那么怎么知道那些頁面是需要的，最多緩存多少頁面，什么時(shí)候結(jié)束哪些頁面的生存周期呢？在我用過的很多H5APP的框架里都沒有對(duì)這些問題有一個(gè)完美的解答，因此在頁面較多內(nèi)容較多的app開發(fā)中可能會(huì)因這些資源分配的問題降低性能。

這時(shí)候我們回過頭來再看看MVVM的數(shù)據(jù)加載問題，實(shí)際上不管哪個(gè)MVVM框架，寫過的人都知道管理這種新型的前端代碼最重要的問題是內(nèi)存的問題，你既要保證代碼寫的足夠優(yōu)雅沒有任何內(nèi)存泄露問題，也要考慮到在頁面生存周期結(jié)束時(shí)它們的控制器/頁面資源是否得到釋放，這對(duì)全局有沒有什么影響，在多個(gè)請(qǐng)求時(shí)也要合理的分配資源，甚至是復(fù)用這些父級(jí)頁面?zhèn)鬟^來的緩存資源等等。較小的APP可能并不會(huì)有這些問題，如果你想用純H5來開發(fā)大型app，這很可能會(huì)浪費(fèi)你很多時(shí)間——而且結(jié)果還不會(huì)讓你滿意。

4、Android/iOS的區(qū)別

很多人都說純H5app開發(fā)一次編寫就能編譯Android/iOS兩種不同的APP，大大降低了成本。實(shí)際上這個(gè)觀點(diǎn)本身就是值得懷疑的，如果你寫過這類APP就能明白我在說什么，它們既不省事，又存在很多BUG，調(diào)試時(shí)尤其繁瑣。舉一個(gè)很簡(jiǎn)單的例子，Android和iOS在返回上一頁的處理方式上就有明顯的區(qū)別，iOS的頂部bar在全屏下怎樣處理，Android機(jī)器出現(xiàn)smart bar怎樣處理頁面的布局，調(diào)用底層硬件時(shí)怎樣區(qū)分不同的場(chǎng)景等等，你需要寫一個(gè)又一個(gè)機(jī)型和系統(tǒng)的判斷，然后分別在Android和iOS下調(diào)試，最后你卻發(fā)現(xiàn)這并沒有卵用，累的要死卻什么沒學(xué)到，只有一堆不知道什么時(shí)候會(huì)過時(shí)的經(jīng)驗(yàn)。

現(xiàn)在做H5混合APP開發(fā)的人很多，但是純H5卻很年輕，很多問題都沒有很好的解決，這幾個(gè)是我在做這些APP時(shí)考慮最多的問題。最后說一個(gè)很少人注意到的H5優(yōu)勢(shì)，大家大談H5APP時(shí)都是快速開發(fā)、低成本、多平臺(tái)等等，但我卻覺得它和很多APP開發(fā)方式相比有一個(gè)不同之處——圖文混合的排版。正是這些復(fù)雜多變的CSS樣式消耗了性能，但是它帶來了排版的多樣性，能夠細(xì)致到每一個(gè)字寬行高和風(fēng)格的像素級(jí)處理，才是H5的優(yōu)異之處。

三、app原生開發(fā)和h5app有什么區(qū)別

原生是基于他們自己平臺(tái)的語言開發(fā)，比如ios和安卓是2個(gè)平臺(tái)，也就是要開發(fā)2份app。h5的開發(fā)完一個(gè)，兩個(gè)系統(tǒng)可以兼容(調(diào)試測(cè)試好)就可以，所以h5比原生app要便宜。 h5的app，加載速度不如原生，受網(wǎng)絡(luò)影響大，體驗(yàn)度偏低，開發(fā)成本一般。原生app，加載速度快，受網(wǎng)絡(luò)影響較小，體驗(yàn)度很高，開發(fā)成本偏高。很多市面上的h5雖然功能有了，效果卻差了很大，要知道一款好的app光ui設(shè)計(jì)上就會(huì)比普通能湊合用的app高出幾倍，也就是說正常二十萬左右的appui可能也僅僅占了一萬兩萬，甚至有的公司為了賺錢ui都是修改之前的成品app。

四、h5做app和原生app有什么區(qū)別？

一、功能更強(qiáng)大

從以上定義中可以看出，原生APP是系統(tǒng)性的應(yīng)用程序，可以地用手機(jī)終端的硬件設(shè)備，比如語音、短信、GPS、藍(lán)牙、重力感應(yīng)和攝像頭等，但是webAPP是不可以做到這些的。所以如果你想做一個(gè)可擴(kuò)展性強(qiáng)，而且后期功能不斷完善的APP，一定要考慮原生的。 二、加載速度更快

剛我們有提到原生APP是由 “云服務(wù)器數(shù)據(jù)+APP應(yīng)用客戶端” ”兩部分構(gòu)成，APP應(yīng)有所有的UI元素、數(shù)據(jù)內(nèi)容、邏輯框架都是安裝在手機(jī)里的。所以用戶在使用APP的時(shí)候，不需要重新加載數(shù)據(jù)，因?yàn)檫@些內(nèi)容都安裝在手機(jī)中了，雖然第一次安裝的時(shí)候有點(diǎn)復(fù)雜，但是在實(shí)際使用會(huì)方便很多。

濟(jì)南APP開發(fā)定制

但是web APP打開每一個(gè)頁面，都需要重新加載，雖然現(xiàn)在網(wǎng)絡(luò)情況很好了，但是在實(shí)際中可能會(huì)有各種問題，比如流量用完了、所在區(qū)域網(wǎng)絡(luò)不好或出了問題，就很大可能出現(xiàn)加載慢或者加載不出來的問題，加載多了很容易出現(xiàn)卡死錯(cuò)亂的情況，用戶的體驗(yàn)就會(huì)很差。因此考慮到用戶體驗(yàn)和加載速度方面，原生APP的性能要遠(yuǎn)遠(yuǎn)優(yōu)于web。

第三：穩(wěn)定性更好

目前市場(chǎng)的web版的APP多為模板，這種模板價(jià)格便宜，但是功能無法拓展，而且隨著市場(chǎng)上瀏覽器、技術(shù)的進(jìn)步，會(huì)逐步出現(xiàn)各種問題，穩(wěn)定性根本無法保證。相比而言原生的APP技術(shù)更加成熟，而且功能可以拓展性更強(qiáng)。做個(gè)簡(jiǎn)單的比喻，我們有一套房子，這個(gè)房子可以考慮自己建設(shè)，這個(gè)過程中我可以決定建幾層、建成什么樣的戶型等等，但如果其買別人做好的，那就只能從已經(jīng)有的中選擇。如果遇到網(wǎng)絡(luò)不好的情況可能就像等期房一樣，只大體知道是啥樣的，但具體的得等網(wǎng)絡(luò)好了才能看到。

以上就是關(guān)于原生h5是什么意思相關(guān)問題的回答。希望能幫到你，如有更多相關(guān)問題，您也可以聯(lián)系我們的客服進(jìn)行咨詢，客服也會(huì)為您講解更多精彩的知識(shí)和內(nèi)容。