目前的 HTML5 開發跟一年前比進展如何,國內國外有沒有區別?

註:問題來自「知乎圓桌」· 非移動開發者向移動轉型:非移動開發者向移動轉型的主題討論,由CSDN 和《程序員》雜誌總編輯劉江老師提問。參與嘉賓包括:

  • 劉鐵鋒 海豚瀏覽器 CTO
  • 季逸超 Peak-Labs創始人/CEO
  • 覃超 Facebook工程師
  • 陳彧堃 友盟技術總監
  • 李建忠 Slideidea 創始人

本題已收錄至知乎圓桌 ? 非移動開發者向移動轉型,更多關於移動開發的話題歡迎關注討論。


進展很慢。這完全由於所謂開放式標準造成的。

HTML5作為開放式標準,成效是明顯的。如同現在瀏覽器繼續分化的情況下,但兼容性卻呈現出越來越好的優勢。現在做網站的同學們應該感到高興。

但開放式標準帶來的問題是,沒有能真正提供一個好生態環境及開發體驗。

Google在這上面做出了很多貢獻,他給你看了很多酷炫的應用,但從沒有告訴過你這些應用是怎麼做出來的。這就是缺乏統一或是真正好用的開發體驗,對於開發者而言顯然是不公平的。其它廠商也是。

而封閉的標準:Apple的iOS快速的形成了自己的生態圈 ,當年的Flash也很快的降低了大家在互動式界面的入門門檻形成了多年的繁榮。

而HTML5現在還是各自為戰,相對於其它平台無論是Runtime還是IDE,每年一個或幾個版本的迭代速度,HTML5在向前前進的路上,的確慢了很多。

很多開發者是不是都有:「我不知道該用HTML5做什麼」 的感覺。


作為一個不怎麼關心 HTML5 的移動開發者,這一年我沒有看到特別多的針對 HTML5 的正面消息,倒是聽到了一些負面新聞。最大的負面消息莫過於 Facebook 開始轉而使用 本地 UI 構造 iOS 版的客戶端。這和去年乃至前年熱火朝天的討論大相逕庭。

出處(需西廂):http://www.facebook.com/notes/facebook-engineering/under-the-hood-rebuilding-facebook-for-ios/10151036091753920

事實上,我對 HTML5 並不看好。理由是多方面的。

我不是很贊同前面幾位朋友提到的 HTML5 對終端設備依賴性較低的說法。從我個人的經驗來看,網路連接事實上是移動設備的耗電大戶,即使是作為 HTML5 典範的 Chrome for Android 和 Safari for iOS 也不例外。受限於 HTML 協議和 Javascript 貧弱的二進位處理能力,HTML5 應用往往也不能像本地客戶端那樣使用壓縮的二進位協議節約傳輸時間和帶寬,反而需要消耗處理器時間做複雜的 DOM 解析。執行效率偏低姑且不論,處理純文本 XML 數據帶來的帶寬消耗也是另一個問題。

至於應用體驗,我承認做得好的 HTML5 頁面的華麗程度令人驚嘆。但問題在於:你究竟要花多少時間和精力才能做出那樣的效果?和本地界面相比,完成一樣的效果(比如滑動動畫)是否確實更簡單和高效,是所有人都得考量的問題。在 iOS 和 Android 平台,簡單的動畫效果幾乎無需開發者費心,只要用標準控制項就自然擁有。而 HTML5 則恐怕不是。

至於一致的觀感,這個問題是見仁見智的。我不願意強求自己的產品在所有平台上觀感一致,因為這樣讓自己的產品和平台整體觀感不符。但我也知道很多人仍然相信軟體的界面應該在所有平台上一個樣子。這一點我無法說服任何人。我只能說,站在我的角度上看,所謂 HTML5 界面的一致性優勢,在我看來反而是個減分項。

大概就是這樣吧。桌面系統的生態區別很大,也許會有不同。但這就不是我擅長的領域了。


HTML5本年進展如何?
這一年是其從概念階段切換到了實操階段,其中有數個裡程碑事件。
首先我們看到越來越多瀏覽器在努力支持HTML5,新推PC瀏覽器和手機瀏覽器也會將HTML5兼容性測試作為重要的指標,業界開始重視,如金山新推獵豹瀏覽器:http://bbs.liebao.cn/thread-67984-1-1.html
其次是基於HTML5的應用越來越多,尤其是基於HTML5的操作系統的成熟化,包括PC端和移動端。

  • Google近期推出了數款基於CHROME OS的低價ChromeBOOK,主打WEB APP的概念,其主要應用基於HTML5。關於ChromeOS以及「WEB APP」的未來,前段時間還有篇文章:《chrome-is-more-important-to-google-than-android》http://techpinions.com/chrome-is-more-important-to-google-than-android/11575,中譯:http://www.huxiu.com/article/5066/1.html ,這篇文章會讓我們更加相信HTML5在未來的地位,以及目前它走到了哪裡。
  • Mozilla將在2013年初推出基於HTML5的手機操作系統FirefoxOS。雖然遲遲沒公布正式推出時間,但今日其中文官方微博已公布模擬器下載地址:http://t.cn/zjXsuLH,使用FF的同學可以下載此模擬器感受一下。當然用戶體驗還是會有差異,我們對其1.0版也不要期待太大。但這個告訴我們一個基於HTML5的手機操作系統的概念。

關於HTML5最大的2個裡程碑事件,都發生在美國,並且是開放社區(Google的Chrome是開源的,而Mozilla也是有名的開源社區)。所以這個足以回答您的第二個問題「國內外差別」。美國是主導,國內是跟隨。美國已走在前沿,國內還在觀望。

另外就是HTML5現在發展的不成熟的瓶頸或者障礙,個人認為除了設備性能以及標準外,還有很重要的幾點。
基於HTML5的應用的好處@劉鐵鋒已經提得比較全了,但是HTML5應用最大的一個區別是基於WEB的,計算和數據更多是放在雲端,對終端設備的依賴性會比較低,包括計算性能和存儲性能。既然是基於WEB的,所以就要一分為二來看。

  • PC端,設備性能已經不是瓶頸,而網路接入能力隨著寬頻的高速化光纖化,也不是瓶頸。所以PC端現在的瓶頸是整個行業對HTML5的支持。除了瀏覽器本身的支持外,網站提供者將網站過渡到HTML5也需要時間。因為瀏覽器是向下兼容的,所以這個時間可能還會很長。網站和瀏覽器以及用戶全面支持HTML5的時候,就是ADOBE FLASH被淘汰的時候;
  • 移動端,設備硬體性能現在也完全反饋的摩爾定律,但是個人認為電量和網路是個很大的問題。

安卓比IOS耗電的原因很大程度是因為程序運行機制的不同。安卓的程序是解釋型的,需要中間虛擬機。完成同樣的任務需要更多的指令,所以更加耗電。而基於HTML5的應用,需要瀏覽器進行執行,如果是FIREFOX OS這類瀏覽器操作系統,耗電問題可能會得到一定程度解決。但是安卓上的瀏覽器或IOS瀏覽器再執行WEB 應用,勢必會更加耗電。當然WEB 應用既然是將計算放在雲端,所以本地執行的程序應該會越來越少;
說回第二個問題網路,既然WEB應用將執行放在雲端,那麼其計算和數據對網路的依賴性可想而知。國內目前的移動網路發展狀況堪憂,3G目前走向成熟但是覆蓋範圍有限。尤其是移動的3G技術本身的局限性導致其不能達到3G的真正的效果,但是仍然覆蓋了較多用戶;4G目前也存在很多懸念。當然WIFI熱點在很大程度解決了網速的問題。不過整體情況是移動網路與PC網路差距巨大;國內網路與國外環境又差距巨大。

上述兩個問題是HTML5應用發展的瓶頸,也是手機發展,甚至移動互聯網發展的瓶頸,是急需解決的兩個問題。


由於桌面瀏覽器多被IE霸佔著,所以HTML5可以另外發展的地方是移動終端。現在的移動終端多為IOS或者android系統,就算是低版本的android不支持HTML5,在高版本中也可以解決這個問題。畢竟瀏覽器是直接綁定在移動系統中的,所以要升級到新版本並不難。

但是,移動端的瀏覽器支持HTML5是不是划算呢?有哪些好處?

(特性參考了騰訊CDC的HTML新特性介紹 http://cdc.tencent.com/?p=4012 )

首先,HTML5的video標籤是一個特色,但是除非是在有wifi的地方,大家也不太可能用pad或者手機上網看視頻。所以,這一方面還有待基礎設施的建設發展,比如像杭州的wifi熱點覆蓋等。在基礎設施發展到一定階段,帶寬佔滿,按流量收費改為包月或者計時收費時,大家普遍地用移動設備在線看視頻這件事才會產生。

其次,繪圖功能。流暢的繪圖功能需要圖形處理器的支持,手機上現在也越來也多的為了遊戲效果而加GPU,所以對HTML5的繪圖功能應該是可以很好支持的。

再次,位置服務。LBS(基於位置的服務)是現在的一大熱門,也是一種手機功能的革新。HTML5本身就帶有Geolocation API,允許用戶共享現在所處的位置,並且獲得其他的服務。移動性,這一點是桌面瀏覽器上的HTML5所不具備的優勢。

最後,離線存儲。這一特點對移動WEB應該的幫助也是顯而易見的。移動端WEB應用由於費用的原因比桌面WEB應用更珍惜用戶的流量。離線存儲可以將js文件、CSS文件甚至是一些數據文件緩存在手機上,當數據發生改變時才將改變的部分與伺服器進行同步。這樣就避免了用戶重複從伺服器下載相同的東西而導致流量的浪費。

雖說有以上這些好處,但是真實開發手機端的web應用時,調界面這件事很讓人頭疼。而且很多時候用戶的許可權是不打開的,比如要使用Geolocation API時……

但我認為,HTML5的標準化還是值得堅持的,現在像是一個過渡期,過渡期的陣痛在所難免。想想當時瀏覽器各開各花的時候,那也是很頭疼的時期,要用各種hacks來達到一樣的效果。程序員的工作也很繁雜。所以,還是希望瀏覽器廠商能協同一致的遵守某個用於頁面展現的標準,然後只在速度和解析效率上做競爭似乎會更好一些。


最近團隊把一個本地c++的應用做成webapp,由於沒有flex的人,選擇了html5。。。

真蛋疼啊,許可權、api都不夠用,很多本地隨手就實現的功能html5得折騰很久。js的調試也很麻煩。好不容易開發出來了,素材,代碼都不能加密。

來點動畫效果,html5的載入速度慢,幀率跟本地比明顯不夠。
Canvas是html5看似最牛逼的東西了,可這些不都是flash十年前就玩剩下的嗎?
css3還是值得稱道的,canvas真不敢恭維。

flash真不知道得罪了誰,被蓄意貶低。其實現在看看web上賺錢的就是遊戲都是flash的,有幾個奇葩是html5?

或許html5可以說在移動平台上有優勢。得,開發一個相同帥+功能+性能的app,原生不知道比html5容易多少倍。

現在大佬都提倡用戶體驗,html5完全是犧牲體驗的典型。所謂的跨平台如果是通過增加開發難度,功能性能縮水來實現也就毫無意義了。寧可在一個平台上做80分,也不要在兩個平台上各得50分。

html5的爹是誰?


只說Mobile的事。基本上,H5問題嚴重
最大問題是木有大腿可以抱。iOS有蘋果,Android有google,win phone有微軟,要錢有錢要人有人。有錢有人的都不一定能成,H5靠啥?誰來做庫?誰來做開發工具?誰來寫詳細到爆的開發文檔?誰來建生態系統?誰來建商業模式?誰來收拾刷榜的?誰來解決百度這個bug?
H5號稱成本低,招人容易,跨平台容易。問題是,牛叉的用戶體驗才是前提啊,要是這個做不好,那還說個屁。再便宜的垃圾也是垃圾啊!你要贏,那你的體驗必須要比native更好啊,按照這個標準招人來做,你去試試成本是多大,還能不能跨平台。
H5的標準也是扯淡。弄啥標準啊,有毛用。所謂的標準到最後都是幾個大廠扯皮的結果啊。一扯就是數年,你慢慢等吧,什麼?你說用戶感受?啥是用戶啊?IT世界有哪個消費品是先制定標準,然後牛逼的?越標準的東西越平庸!乾脆別弄標準了,就按用戶感受為最高指示來弄吧,問題是那和native app又有啥區別啊?為啥要再弄一個?就為了照顧懶得學其他語言的懶貨以及學不會的蠢貨么?直說唄,那還談個屁的用戶感受
至於語言、性能層面上的東西,哥都懶得說。Java就是你的榜樣,基因不行,再多優化都是廢材
至於各個瀏覽器廠的言論,可以直接無視


應邀做答。
個人觀點,基於如下幾個原因,基於HTML 5的開發會越來越多

  • 入門的門檻(影響了開發者的基數和成本)
  • 開發的成本(僱傭多個平台開發人員,還是一個平台開發人員)
  • PC上的發展趨勢

為什麼現在HTML 5 的開發不成熟?

  • 瀏覽器內核能力不夠強(渲染速度、界面響應速度、通過GPU加速的能力)不夠,對於基本HTML 5的標準支持並不是最大問題。PC的瀏覽器已經接近完全,手機上海豚瀏覽器的內核已經可以達到480+, 通過Facebook的Ringmark測試的Ring 1 (非廣告,只是為了說明技術上的可行性).
  • 瀏覽器訪問移動設備的能力(標準的發展和用戶的需求有差距)
  • 瀏覽器的編程模型的限制(單進程的模型,依賴於DOM數據處理的模型)

但是目前手機的硬體能力已經在提升,雙核1G,Android 4.0的MTK山寨手機已經只要500塊。雙核1.5G只要900塊。性能不會是最大瓶頸,那麼PC上已經跑起來的典型應用,在手機上都會起來。如果對比PC上的發展局面,其實已經展示了手機HTML 5發展的未來。
HTML 5的開發是否有進展?
不在於HTML 5的標準,而在於HTML 5的庫的發展,有了更好的庫就能夠更多地減少開發者的工作以及更大範圍的普及。如果從這個角度來說,HTML 5的庫在蓬勃發展。當足夠的高性能庫出現的時候,HTML 5應用開發的普及就會順理成章鋪開。


說實話,HTML5這東西,我嚴重懷疑是次培訓機構的大炒作(下面有同學指出是瀏覽器產商的大炒作,有道理,總之正肯定有幕後在推波助瀾,想撈點好處)。因為周圍,無聊國內還是國外,都是叫好不叫座。具體來說,其一,功能和性能有限。就拿HTML5中最大的亮點canvas來說,想用這玩意取代flash,基本是不可能的。canvas才提供多少個api,那幾個繪圖函數實在太簡陋,和flash極其強大的各種特效相比簡直大巫見小巫,更別提flash的動畫能力了。其二,用js來做動畫和特效,效率太低。flash player裡面對各種浮點數、矢量繪圖的優化,簡直到了超越普通硬體加速的地步,下面摘自一位精研flash player的牛人的話:


Adobe的FlashPlayer在誕生時,那個時候還沒有通用的2D矢量顯示標準(如OpenVG),其針對軟體渲染的2D矢量圖形顯示可謂是亮點,在經過十幾年的發展和優化,Adobe的2D軟體矢量渲染引擎可謂是已經發展到盡善盡美了,這也可以解釋為什麼自FlashPlayer 4到FlashPlayer 8其渲染引擎一直沒有太大的變化,也可以解釋為什麼Adobe FlashPlayer軟體渲染的效能甚至會好於使用低端硬體加速的效能了;但,成也蕭何敗也蕭何,過於完美的標準和演算法阻礙了使用標準硬體加速的可能(針對特殊GPU的硬體加速,因為其靈活性不在我們的考慮中) (簡要評說Adobe的FlashPlayer的渲染演算法)
也就是說,你拿低端硬體加速,也不一定拼的過flash player的速度,那js呢?js比c++還慢了數倍,這樣的速度去寫動畫,絕對被用戶罵死。

其二,現在html5已經開始分裂了,分裂成兩個標準。本來就不是標準的東西,還繼續分裂···前途簡直沒有。
其三,開發工具幾乎沒有,就更別提和flash ide相比了···
其四,各種瀏覽器支持的也有限。拿pc上的chrome去打開那些所謂的html5的站點,經常卡死。要知道chrome的核心dll一個就接近50m,這麼龐大的東西,支持html5還這麼差,更別提移動設備那些有限的資源了。我是覺得,那些手機瀏覽器,解析各種html4的網頁都不一定標準,就更別提html5了··
其五,想到再說····

所以綜合來說,那些讚美HTML5的,基本都是一廂情願而已。尤其IE6都還堅挺,XP還佔據40%市場的中國,想推廣HTML5,太難。10年前有人大呼什麼IPV6 X64 之類的時代要到了,可目前可以說還是早的很。十年前我就在關注一項矢量繪圖技術:SVG,絕對比canvas繪圖能力強大,可惜一直沒有商業公司推廣,以至於現在幾乎沒人知道。
再進一步,所謂的HTML5,之所以拿出來炒,最大的原因恐怕還是喬布斯這人,想在商業上踢翻adobe。要知道flash一旦成為標準,在對開發者要求極其苛刻的ios平台,一切都將可以繞過蘋果的限制。所以喬布斯才出如此極端之做法。現在喬布斯已逝,HTML5的前景堪憂啊。

----------------------------------------------------------------------
再加一段。下面幾位同學的親身體驗也說明了,要用現在的HTML5來做移動應用,幾乎是不可能的。其一,api有限,比如想和文件系統、其他各種設備交互,現有的API用其來簡直捉荊見肘;
其二,許可權不夠。
其三,用原生語言寫出的app尚且如此耗電,有時候,那些網頁,肯定都卡爆了,即是說,效率不夠。
其四,做出的應用幾乎是全裸擺在競爭對手前面,難以加密。
其五,開發工具不夠,想寫點複雜的東西,累的半死。
你覺得這種情況得多少年才能改善?前面那些說HTML5如何如何的,我想說的是,還是看清現實吧.
-----
補充:
不管做哪種應用,HTML5都有各種不可饒恕的缺陷。
.....首先如果拿HTML5來做手機應用。如果是普通工具類型的APP,那界面部分確實可以省一些工作量。用網頁來做界面確實比native方便很多,但一般來說界面只是工作量的一部分,大部分後台邏輯還是得在native來做。所以HTML5的優勢不是特別大。
..... 如果用HTML5來做手機遊戲, 那問題就大多了。首先就是效率問題,用JS這種東西,再怎麼優化也達不到native的程度,這點你也許會說chrome的效率已經夠高了,但並不是所有手機都裝了chrome,這其實就牽扯到第二個問題,兼容性問題。要解決效率問題就得解決兼容性問題。但目前安卓上瀏覽器種類太多了,每種對html5的支持不一樣,對JS的運行效率也不一樣。而大部分遊戲對效率要求肯定是越高越好。非要犧牲native的性能優勢,而花那麼大精力去整html5幹嘛呢?其實無非就是因為html5開發上稍微方便點,移植簡單點。但對於手機遊戲,本身就有cocos2等方便移植的引擎,開發、運行、移植效率也高,何樂而不為呢。
..... 如果用HTML5來做PC應用,那問題就更大了。不像手機端,webkit一統天下,pc上ie各個版本一直霸佔著大份額市場。HTML5能否流暢跑起來都成問題。事實上,曾經有公司嘗試用網頁做互聯網客戶端,可IE的表現實在太差,版本多,bug多,最後項目終歸失敗。而豌豆莢這種網頁做客戶端,也是自己帶了個超大的libcef.dll 下去。
. HTML5吹噓的就是方便開發方便移植,但無論開發還是移植上,都需要兼容各種瀏覽器,連瀏覽器都跨不過去,何談跨平台呢。
..... 另外,HTML5的安全性也是個問題。要閱讀和破解太方便了。對於那些看慣晦澀難懂的彙編的搞逆向的人來說,所謂的混淆,簡直形同虛設。
..... 事實上,要說明HTML5發展如何失敗,只需要舉一條例子就夠了,那就是facebook押注html5的大失敗。facebook肯定是碰到上述的各種問題,才不得不放棄所謂的html5。要知道做出放棄HTML5是個多麼大的決定,肯定是到了極端不能忍的地步才會走出這一步。
..... 不過也不是說HTML5一無是處。HTML5一般適合iOS平台、對性能要求不高的遊戲,或PC上,能自帶瀏覽器引擎的客戶端。當然如果有一天,所有瀏覽器能完美支持HTML5,並且運行流暢,那我不反對HTML5會一統開發市場,單如果現今階段,非要把HTML5的優越性無限放大,鐵定會慘遭失敗。


個人所了解的關於html 5 vr和angular 2的結合,目前所知的已經有幾家公司開始搞了。


來到2016年,回過頭來看12年這些問題的答案,別有一番風味。
從當年各從業者一致的對H5的不看好,直到現在H5遍地開花。
一方面體現出了網站開發面對的環境(包含用戶瀏覽器、上網終端、網路帶寬等情況)日新月異,發展迅猛。另一方面也看得出我國的互聯網從業者們,不說全部,至少在主流上是缺乏足夠的預見性的。


想弄html5的人先去學學flash, flash就是十年後的html5, 學flash後等於直接把十年後的html5學了, 一下子就比其他人領先十年, 然後回頭在看看現在的html5 什麼玩意


想簡單點吧,native app 適合遊戲以及頻繁使用設備的應用。
web app 適合做對效果和設備要求不高的網路應用。
然後flash和html5之爭?adobe已經加入w3c,誰知道adobe會不會推出html5+js版本的「flash」編輯器。


我以為一項新技術的發展與推廣,必定合乎某些公司的利益。

拿HTML5來講,就是以GOOGLE,FACEBOOK等互聯網公司為主,這是他們想看到的。假如所有人都 用了HTML5瀏覽器,GOOGLE的在線應用,搜索引擎都將大為受益,提供更豐富的瀏覽器交互和功能,這是以互聯網平台發展為主的公司所希望看到的。以此來侵佔傳統軟體公司的市場份額。

ADOBE並非一家平台公司,從技術來講,FLASH確實會對系統性能有所影響。同時SAFARI,CHROME 的內核WEBKIT,是誰支撐的?對不起,是蘋果。並非蘋果要針對FLASH,而是蘋果要扶持自己的 WEBKIT, SAFARI。GOOGLE, APPLE 對HTML5的推崇並非只是簡單的打擊FLASH,而是打擊傳統的軟體市場格局。

當然ADOBE並不會坐以待斃,ADOBE有自己的競爭優勢,它針對HTML5開發的動畫工具早就開始發布了。

現在看來,這是場長期的戰爭。HTML5符合GOOGLE之類公司的利益,但卻在慢慢侵佔MICROSOFT公司的過去軟體市場。當然MICROSOFT之類的公司也不會坐以待斃。但在這場戰爭中,GOOGLE,APPLE獲得了一定的優勢,可以挑戰如MICROSOFT的傳統市場地位。

HTML5及WEB必將繼續給未來的軟體、IT 帶去更美妙的體驗。作為大部分的軟體公司,IT企業只能緊跟這次的發展腳步,否則只能是落後!


html5的撞球遊戲,我已經放到github上了,前段代碼是從國外網站上爬下來的,我正在寫後端,打算弄成聯網對打。提供兩個版本,單機版本和聯網版本,單機版本離線就能玩。


個人覺得還是要看應用類型及使用場景,綜合評估投入和產出以及用戶體驗,不能一概而論,每種技術都有他適合的使用場景


HTML5.。。 一直覺得是個傳說, 確實是google的逆襲啊。。。。 超越操作系統的局限,統一在一個平台下, 怎麼也有種世界大同的感覺。 但實際能活到現在的任何一種語言和平台都有其特殊的特點,無法徹底被替代。 (當然打孔紙帶那種不能算)


推薦閱讀:

為什麼不見HTML有競爭對手?HTML真的那麼完美嗎?
現在的頁游,一般用到什麼樣的技術,請系統的說明一下?

TAG:HTML5 | 移動開發 |