正文

h5移動端開發(fā)（h5移動端開發(fā)框架）

發(fā)布時間：2023-03-19 02:20:21 稿源：創(chuàng)意嶺閱讀： 52 問大家

大家好！今天讓創(chuàng)意嶺的小編來大家介紹下關(guān)于h5移動端開發(fā)的問題，以下是小編對此問題的歸納整理，讓我們一起來看看吧。

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

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

官網(wǎng)：https://ai.de1919.com

本文目錄:

1、H5游戲開發(fā)平臺有哪些，國內(nèi)有哪些成熟的H5游戲開發(fā)公司？
2、移動端H5頁面點擊穿透問題
3、H5開發(fā)和web前端開發(fā)有啥區(qū)別啊？
4、h5前端開發(fā)前景怎么樣？

h5移動端開發(fā)（h5移動端開發(fā)框架）

一、H5游戲開發(fā)平臺有哪些，國內(nèi)有哪些成熟的H5游戲開發(fā)公司？

騰訊啊。網(wǎng)易啊

h5游戲

h5游戲是指移動端的web游戲。 h5游戲多以輕度休閑的小游戲為主，無需下載軟件即可體驗。

中文名

H5游戲

外文名

H5game

游戲平臺

移動端的web游戲

游戲語言

Html5

基本內(nèi)容

H5是一系列制作網(wǎng)頁互動效果的技術(shù)集合，即H5就是

H5游戲

移動端的web頁面。而H5游戲[1]，你可以看作是移動端的web游戲，無需下載軟件即可體驗，這就是H5在傳播上的優(yōu)勢。對于許多手游玩家來說，H5可能是個十分陌生的名詞，其實H5就是HTML的高級版本，目前H5技術(shù)正在不斷完善。

現(xiàn)階段H5游戲在國內(nèi)還處于萌芽狀態(tài)時，專注移動游戲[2]平臺領(lǐng)域的掌鋒科技就已經(jīng)嗅到了味道，開始全面轉(zhuǎn)型。

在技術(shù)方面，利用H5開發(fā)移動小游戲的門檻更低，所需時間更少?！澳憧梢韵駥懢W(wǎng)頁一樣寫游戲，而無需太多的額外學(xué)習(xí)，而且有大量文檔與插件可用。”蝸牛數(shù)字科技股份有限公司陳芳曾如此形容H5的技術(shù)特點。事實也是如此，據(jù)媒體報道：風(fēng)靡一時的“神經(jīng)貓”只有一個設(shè)計加一個程序員，只用了一天半的時間。

世界上最大的H5游戲平臺運營商SOFTGAMES公司CEO阿列克斯指出，開發(fā)H5游戲有三大難題：

一、不同手機的屏幕兼容性;

二、操作方式的兼容性;

三、H5游戲音頻滯后，易導(dǎo)致移動瀏覽器載入時間過長、游戲卡頓、瀏覽器崩潰。

此外，用戶手機的網(wǎng)速與流量費用，也是制約H5游戲深度發(fā)展的主因。所以，目前狀態(tài)下，H5游戲多以輕度休閑的小游戲為主。“未來移動游戲的發(fā)展趨勢，應(yīng)該是H5生態(tài)與移動App共贏的狀態(tài)?！盓gret白鷺引擎聯(lián)合創(chuàng)始人馬鑒認為，而這正是暢夢游戲在做的事。

二、移動端H5頁面點擊穿透問題

最近移動端m站的開發(fā)中遇到了點擊穿透問題，就此總結(jié)一番。

先說下我遇到的問題，項目使用react框架，并且引入了 react-fastclick 庫，可以解決click事件的穿透問題，但是對于下層是 a標簽 的情況，依舊存在穿透問題，會觸發(fā)鏈接。

我的解決方法是把上層的事件放在了一個 setTimeout(() => {}, 0) 中。

下面說一下點擊穿透問題是怎么來的。

點擊穿透是指，在移動端H5頁面中，當(dāng)點擊事件會切到一個新頁面時（比如返回上一頁面，或彈出彈窗頁面，或關(guān)閉遮罩層），新頁面中相應(yīng)的位置如果有事件（或input等輸入框），就會被觸發(fā)。

這是因為在pc頁面中，一次點擊行為包括 mousedown -> click -> mouseup ，而在移動端，則是 touchstart -> touchmove -> touchend 。

在移動端，雖然沒有 mouse，依然會響應(yīng) mouse 事件，但是有個300ms 的時延。于是移動端的一次點擊其實是這樣的： touchstart -> touchmove -> touchend -> 300ms ->mousedown -> click -> mouseup 。

之所以有時延，是因為在這 300ms 中，移動端會檢測是否有雙擊行為。

正因如此，在這 300ms 之中，頁面變成了新的頁面，click 事件就會觸發(fā)成新頁面中的 click 事件了。

這種問題可以通過一些庫來解決，比如 fastclick 庫，其實現(xiàn)思路是，取消 click 事件（參看源碼 164-173 行），用 touchend 模擬快速點擊行為（參看源碼 521-610 行）。其實就是在檢測到 touchend 事件的時候，會通過 DOM 自定義事件立即出發(fā)模擬一個 click 事件，并把瀏覽器在 300ms 之后真正的 click 事件阻止掉。

但正如文章開頭所講，fastclick 對于 a 標簽的情況依然存在問題，仍需自行解決。

對于瀏覽器點擊事件更加詳盡的介紹，可參考這篇文章，雖是遠古文，耐心讀下來對夯實基礎(chǔ)會有很大的幫助。

三、H5開發(fā)和web前端開發(fā)有啥區(qū)別??？

在網(wǎng)絡(luò)上，經(jīng)?？匆娪型瑢W(xué)在提問，H5前端與Web前端的區(qū)別。今天我們就來好好談一下，他們之間究竟哪里不同？

1.開發(fā)頁面時，主要使用的技術(shù)不同。Web前端在開發(fā)交互式頁面時，主流的前端技術(shù)都會用到，像HTML、CSS、JavaScript、HTML 5、jQuery、JSon

這些最基礎(chǔ)的技術(shù)都會涉及到。H5前端在開發(fā)頁面時，大部分是通過HTML語言來設(shè)計頁面。

2.涵蓋范圍不同。上面已經(jīng)提到，Web前端開發(fā)會使用到當(dāng)下主流的前端技術(shù)及框架。而H5前端是主要通過HTML標記語言來進行開發(fā)。我們也可以說H5前端是涵蓋在Web前端開發(fā)里面。

實際上，在現(xiàn)實生活中，我們并沒有把這兩者分的這么清楚。因為在真正的項目開發(fā)過程中，會涵蓋到前端各種主流的技術(shù)。所以，大家只需要明白H5前端是包含在Web前端中的就足夠了。

四、h5前端開發(fā)前景怎么樣？

前端入門學(xué)習(xí)門檻比較低，所以很多人認為HTML、CSS、JavaScript是很簡單就掌握的東西，以為在網(wǎng)上看點亂七八糟的教程，隨便看看書，用HTML、CSS做個網(wǎng)頁布局就可以入門了。如果真是這樣，那基本每個人只要花點時間，隨便學(xué)一下，就可以入行前端了，就可以稱為前端開發(fā)工程師了，那還得了。

現(xiàn)在很多人就是這樣，想著軟件開發(fā)行業(yè)可以拿高薪，想快速入門做開發(fā)，這種想法其實沒有錯。但是只看一點點基礎(chǔ)，隨便學(xué)點東西，只會一點點皮毛就不再深入拓展，這樣的技術(shù)水平，就算數(shù)量再多，市場對專業(yè)的前端開發(fā)需求依然是只增不減，不會有任何影響的。

僅以北京為例：

就這兩年來看，移動互聯(lián)網(wǎng)在持續(xù)發(fā)展，前端開發(fā)技術(shù)也是在不斷進步的，前端應(yīng)用市場越來越廣泛了，前端現(xiàn)在正在走向工程化發(fā)展，無論是大小公司企業(yè)，對前端開發(fā)的需求都是越來越大的了，也越來越專業(yè)了。

技術(shù)無論怎么發(fā)展，整體市場是不會飽和的，飽和的也只會是低端飽和，高端始終缺人。在未來，全棧型前端開發(fā)工程師才是企業(yè)真正爭奪的香餑餑。而被淘汰的不是前端開發(fā)，而是淘汰技術(shù)落后和技術(shù)不精的開發(fā)者。

那么前端開發(fā)工程師的未來路在何方？

隨著前端開發(fā)技術(shù)發(fā)展，移動端應(yīng)用、小程序、H5游戲出現(xiàn)。前端開發(fā)應(yīng)用場景不斷拓展。走向更專業(yè)和工程化的發(fā)展。

在以后，互聯(lián)網(wǎng)的大量工作將會需要前端開發(fā)來完成：

播放器/游戲：H5代替Flash，如Web Audio、Web Video、Canvas
日常辦公軟件（復(fù)雜應(yīng)用，并且慢慢從桌面程序演化為Web）：Office、Email、文檔管理、產(chǎn)品設(shè)計、項目管理、代碼編輯器
大數(shù)據(jù)/AI配套軟件（復(fù)雜應(yīng)用，并且慢慢從桌面程序演化為Web）：需要大量的后臺系統(tǒng)來做數(shù)據(jù)分析/機器學(xué)習(xí)
容器/小程序：支付寶/微信/釘釘容器，各種行業(yè)功能小程序（擁有大量原生APP功能的APP成為互聯(lián)網(wǎng)新趨勢）
產(chǎn)品信息展示類網(wǎng)站（炫酷應(yīng)用）：各種智能設(shè)備官網(wǎng)、大企業(yè)官網(wǎng)

以上就是關(guān)于h5移動端開發(fā)相關(guān)問題的回答。希望能幫到你，如有更多相關(guān)問題，您也可以聯(lián)系我們的客服進行咨詢，客服也會為您講解更多精彩的知識和內(nèi)容。