非死book引發的HTML5危機

        近期幾個新聞堆疊在一起，頗有韻味。先是 WHATWG 和 W3C 在 HTML5 標準上分道揚鑣，繼而“非死book 移動應用宣布放棄 HTML5 的部分，改為純 Native 方式開發”，接著又傳聞蘋果 AppStore 肅殺基于 Web 技術的 App。這幾個事件對移動互聯網行業來說個個都是重磅炸彈，押注 HTML5 的受到不小的打擊，唱衰 HTML5 發展的借此幸災樂禍。HTML5真的只是一場政治斗爭嗎？到底 非死book 為什么放棄 HTML5？現階段 HTML5 到底出了什么問題？

        非死book 放棄 HTML5 主因：慢

        “對于 非死book 的 iOS 原生應用來說，它在主要在三個方面有很大的速度提升：應用啟動、共享新聞滾動還有圖片點擊查看。其總體速度大約提升了一倍。這個版本部分采用了 非死book Camera 和 非死book Messenger 兩款應用的代碼庫：其中圖片點擊查看功能的代碼是從 非死book Camera 移植過來，而屏幕消息是從 非死book Messenger 那克隆過來的。這個原生版本是由一個獨立的團隊開發，產品經理 Johnson 表示未來會充分利用公司的代碼共享，也會適當向其他團隊尋求幫助。”

        上述摘自 非死book 的官方博客。博客中介紹到 非死book 的 iOS 原生應用放棄 HTML5 后速度得到大幅度提升。大家不禁好奇，為什么 HTML5 會比原生 NativeApp 要“慢”很多？

        在當前的移動終端設備硬件配置和操作系統優化水平的前提下，大部分基于 HTML5 開發的 Web 頁面會出現延時加載展示的現象，也就是俗稱的卡、慢。特別是在不同的視圖界面(view)切換之間，這種卡和不流暢的現象會尤為嚴重。而 Native 應用不會出現這種情況。究其根源，在于瀏覽器解析的運作機制和原生 Native 的界面展示機制差異上。如下圖所示：

        紅色框起來的部分是原生 NativeApp 的界面展示機制，簡單的看起來就是 1 個步驟——展示，因為所有的繪圖和渲染工作都由系統直接完成。而紅框以外的部分包括紅框內的部分是 webkit 核心的瀏覽器解析頁面的流程。相比 Native 的 1 個步驟，webkit 的解析過程可謂漫長而艱辛。歷經解析、建立 Dom 樹、獲取對應資源、布局、建立渲染樹、繪圖到展示。所以不管移動終端設備硬件如何發展，這個差異是始終存在的，最多只是隨著硬件的提升和軟件的優化將這個 差異收縮到最小甚至忽略。

        更糟糕的是。非死book 之前的 iOS 混合了 HTML5 的移動應用，使用 HTML5 繪圖的頁面在 HTML5 開發上也毫無技巧可言，基本沿用了主流前端開發框架 jQuery mobile 等的單 View 多 div 的機制。也就是在一個網頁內繪制多個視圖，頁面之間的切換其實只是一個頁面內不同區塊的切換。這種方式加大了瀏覽器的渲染和繪制工作強度。并且在數據加載 和流量上產生很大的負面影響。如果切換到新頁面，之前的頁面不進行銷毀，則會加大運算量和增加內存占有，而如果銷毀又會導致已經下載的數據失效，要重新載 入，浪費流量。類似情況在中國的網絡和設備情況下會尤為突出。所以 非死book 不當的在 Native App 內混搭 HTML5 也難免引來用戶怨言。

        還有，一如報道中提到的，非死book 這次的改進提升主要是“新聞滾動和圖片點擊”。如果了解 HTML5 的人，就會發現，這兩點當然是“不應該在現階段使用 HTML5 實現的”。為什么？筆者作為一個基于 HTML5 技術的 Hybrid App 系統的設計者，設計秉承的一個原則就是“凡是需要’動’的部分和需要大量運算的部分，就最好使用原生彌補，而不是一定要使用 HTML5 來實現”。新聞滾動，這種不停通過改變 Dom 樹近而改變渲染再繪圖展示的使用場景相比原生 Native 弱勢是非常明顯的。至于圖片的部分就更不用多說了，這并不是 HTML5 眼下擅長的部分。HTML5現在擅長的部分是數據量不大的頁面、動畫少的頁面，特別是跨平臺的開發。充分利用好 HTML5 的優勢，盡量降低 HTML5 的弱勢，學會用好 HTML5，才是現在這個時期使用 HTML5 開發的重點。可以說開發技巧很重要。

        現階段 HTML5 的問題：政治斗爭

        “原生版本是一個獨立團隊開發的。”非死book 公開的這一點也耐人尋味。原來客戶端是 Native 與 HTML5 混合的方式，原來的團隊也肯定有原生的開發能力，為什么非要一個獨立團隊重新耗費 6 個月進行重新開發？或許這里不能排除公司內政治因素，而 HTML5 成為一個犧牲品。HTML5的政治不僅是一個公司內的，更是整個行業的。7月份，同為 HTML5 制定者的 WHATWG 和 W3C 表示無法繼續合作，前者希望制定一個能夠跟隨市場或技術動態的標準；后者則要確立一個“死”的標準，一旦正式頒布再也無法修改。

        WHATWG 和 W3C 的分道揚鑣或許會成為 HTML5 發展的一個分水嶺。WHATWG 背后有 Google、蘋果，W3C 拉到了特立獨行的巨無霸微軟。標準是為利益服務的，曾經力推 HTML5 的蘋果，現在也傳聞在 AppStore 內打壓基于 HTML5 開發的 App。那蘋果到底是喜歡還是不喜歡 HTML5？喜歡也是真，討厭也是真。過去喬布斯為了滅掉 Adobe 的 Flash，將 HTML5 當成沖鋒槍，在移動端干掉了 Flash 之后，面對自己封閉生態系統的巨大利益和 HTML5 世界大同的愿景做出選擇的時候，蘋果當然毫無懸念的選擇自己的利益。

        《web app 的挑戰(三)：入口之爭》 一文中，我有闡述自己的觀點：入口之爭”在現有移動操作系統設計架構下，瀏覽器很難和用戶桌面爭奪核心入口地位。蘋果打造的 iOS 系統就是一個應用優先的系統，無論 HTML5 怎么發展，Web App 如何掙扎，瀏覽器如何砸錢，都搶不過用戶桌面的入口地位。基于 HTML5 的 Web App 的命運被蘋果牢牢把控。Android 系統這個跟隨 iOS 桌面入口理念的半山寨貨也沒有押注 Web App 而是將這個任務交給了 ChromeOS。所以，不用炒概念，也不用談未來，用 HTML5 開發原生應用，而不是僅僅套個外殼那么簡單才是現階段 HTML5 使用的重點和發展的重點。并且蘋果封殺的也只是純 HTML5 套殼的 App，對于使用混搭模式(包括 非死book 之前的版本)的移動應用還是保持開放姿態，畢竟這種 HTML5 還是在蘋果的生態系統內可控的運行著。

        最后

        非死book 的 iOS 放棄 HTML5。幸災樂禍也好，沮喪也罷。變的只是一個應用，HTML5的勢頭和趨勢不是一個企業可以逆轉的。現階段，真正的了解 HTML5，掌握 HTML5 的開發技巧和在恰當的地方用好 HTML5，才是把握機遇的重點。

        作者：@AppCan 劉鑫