Re: [請益] Html5手遊潮流(?)

[ybite (小犬/小B)]

被靠北遊戲業釣上來了，來認真發一個技術文......

不過在這之前，我的主觀認定是這樣的：
* Web 上，Flash 或插件為主的遊戲會在接下來兩年逐漸消失
* 手機上，主力仍會是無法在 App Store 或 Google Play 上架的遊戲
  「大作」仍然會遇到各種麻煩的技術限制

（因為這裡是講免上架 HTML5 瀏覽器遊戲，容我跳過 JS + Native 的方案
例如已經成形的 Cordova / PhoneGap, Titanium 還有很有可能竄起的 react-native）

好了，以下技術長文。
大體來說，現在 HTML5 的遊戲技術實踐
可以先以 Rendering（渲染）和 Scripting（程式）這兩方面去作區別

Rendering 可以走 DOM、2D Canvas 或 WebGL
走 DOM 不用多說，手機看很多網頁捲動還是超卡，基本上不實際
2D Canvas 或是 WebGL 才是比較理想的解答，其中 2D Canvas 的支援比較理想。

iOS 直到去年的 8.0 才預設開啟 WebGL，所以這可以說是比較新的領域。
WebGL 1.0 其實基本上就是整個 OpenGL ES 2.0 API 開個網頁用，
用在遊戲上「照理說」可以一樣的 3D 效果，但問題卡在 Scripting，後述。


Scripting 的部份，很遺憾目前我們還是只有 JavaScript
目前大概就是純 JS 與 asm.js (Emscripten) 兩個方向了
（tl;dr: JIT 加速 / ES6+ -> GC pauses -> 多緒困境 -> asm.js -> WebAssembly）

這幾年純 JavaScript 如同推文說的，慢的問題已經隨著 JIT 解決
語法髒的問題已經隨著 ES6 / Harmony 的發展走進歷史，ES7+ 根本是外星語言
雖然對於寫遊戲來講，我覺得 JavaScript 已經足夠，用什麼語法只是個人喜好

實務上，像 Chrome 的 V8 都已經作到兩段式的 JIT 加速
第一段基礎加速，猜測物件型別，在第二段時將瓶頸編譯成機器碼
所以對於非常簡單的 Loop benchmark，現在的 node.js / Chrome / Firefox 都能樂勝

問題在於 JIT 造成的記憶體消耗，以及最大的致命傷，GC Pauses。

JavaScript 必須仰賴 Garbage Collection（垃圾收集簡稱 GC）作物件清潔
但垃圾清潔就需要時間，這個時間會變成一個定時炸彈
你永遠不知道瀏覽器什麼時候會作 GC，也很難從外界直接干涉

另一個問題大家也講到了，JavaScript 很難作多序。
JavaScript 一開始就像所有的 UI 框架一樣採用單序 Event Loop 的設計
所以到了後來要加上平行運算就只能用像 Web Worker 一樣的作法


因為 GC Pauses 與平行運算的限制，WebGL 的 Game Loop 幾乎無法作任何複雜運算
但如今產業已經慢慢在克服這個問題，從早期的 asm.js 到現在的 WebAssembly
也許在過幾年，我們會慢慢看到不需要插件的複雜 3D 遊戲在網頁上出現

---

回到實務上，重新聊回 HTML5 手遊。

目前受限於技術、手機效能、手機作業系統支援等等因素，
即便 WebGL + asm.js / WebAssembly 的組合很吸引人，
但短期內這個方案依舊無法在手機上支援純網頁的 3D 遊戲。

因此 HTML5 手遊短期內的市場還是會以 2D / 2.5D 遊戲為主。
所以問題才會回到金流上面：沒有官方商城加持，你很難作課金遊戲。
所以我的結論就是沒辦法上架的遊戲才會有市場。

而且這個市場說實話到了 Android 5.0 / iOS 8 世代手機才堪稱開始。
接下來會走向何方有點難說，但讓人拭目以待。

---
自婊利益揭露：我上一個創業雇主就想做十八禁手遊框架，可惜天時地利人和不對...
我猜這個搞不好明年會起飛，只是產業需要花很多時間適應手機玩家習慣
（手遊跟 PC Game 玩家的使用習慣真的差太多，你可以邊等公車邊吃飯邊玩手遊）

--
※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 111.249.194.67
※ 文章網址: https://www.ptt.cc/bbs/GameDesign/M.1446484479.A.CEA.html
→ ybite: 補充一下，RPG Maker MV 的 HTML5 輸出是用 pixi.js
→ ybite: 喔，他整個是用 HTML + JS，App 要用 Intel XDK 囧
推 goury: 結論看不懂 Orz 官方商城是指？手機開網頁無法付費？
推 littleshan: 不是不能付費，是串接金流很麻煩
→ y3k: 我是覺得除非瀏覽器API可以直接Call GC或有VM架構在裡面 否則
→ y3k: 永遠都追不上Native的車尾燈 開發Native反而還比較省成本...
推 littleshan: 不過，GC的問題，我覺得遲早會成為 minor issue
→ littleshan: unity 也有 GC 問題，但隨著手機硬體進步，這個問題越
→ littleshan: 來越不顯著
推 BeStronger: 其實日本已經做了十八禁HTML5手遊
推 wimdos: DMM已經在做這塊了,最近的幾款都是網頁H game支援手機
→ bndan: 如果比效成 NATIVE好還可以理解 如果要比開發成本...應該沒
→ bndan: 什麼程式能比web還低才對...
→ bndan: 不然就不需要討論hybird app了...
推 LaPass: 推
推 dreamnook:
推 asoedarren: 完全正解 佩服
推 holymars: 我在想，Unity的GC問題有八成原因是mono版本太舊了...
→ y3k: APP還可以談 現在講的是"遊戲"耶XD
推 Frostx: 完全不懂這塊，只能推
推 justben: react / react native
推 justben: react 可以對局部DOM做更新 不必每次都更新DOM TREE
推 justben: react natvie 是調用原生API  跟Phonegap 用webview不同
推 LayerZ: 不懂只能推+1..
推 Shinpachi: 推
推 chowleft: 十八禁手遊框架...聽起來就很有趣說
推 littleshan: unity的gc問題還有很大一部份出在C#身上
推 lzainside: 我覺得R18手遊可能要用正常遊戲mode來包裝，不然在外
→ lzainside: 面玩感覺會有異樣眼光XD?
推 wulouise: R18應該走攜帶式裝置最好吧 有google glass
→ wulouise: 這一類的在外面就不會不好意思XD
推 jenocool: 推
→ LayerZ: R18做個"行動模式"就好啦=w=