WEB前端的大部分工作集中在利用現有的主流前端框架（vue /?react?/ angular）及其周邊開源代碼庫生態組織整個項目的架構并實現業務邏輯代碼，往往同一種邏輯可以選擇用不同的抽象方式來實現，不同抽象方式的思想和實現差異巨大，如狀態管理的不同實現方式：redux / mobx / rxjs.
H5游戲的開發工作主要集中在基于游戲引擎的標準開發流程實現UI設計的動畫效果以及完成游戲交互邏輯。對于游戲開發來說，需要利用具象思維能力來組織貼圖等資源完成最終產品，實現的過程相對來說比較固定和模式化（利用選定的游戲引擎的粒子、骨骼、幀動畫等API）。
WEB前端在工程化領域日趨成熟，利用框架本身提供的API + IDE的完備提示 + webpack等打包工具可以實現“coding - debug - 部署”的一整套成熟的生產流程，同時框架本身往往只提供核心的“數據 - 視圖 - 數據”功能，可以根據項目需求引入不同的設計模式。
在H5游戲開發領域，由于不同游戲引擎之間的核心代碼差異巨大，為了保護核心源碼以及開發效率等，游戲引擎廠商往往會高度定制一套服務于該游戲引擎的開發流程：從IDE到代碼架構到部署。因此，相對來說，H5游戲開發中，遵守“約定”是很重要的一個環節，H5游戲開發在選定了游戲引擎之后，整個開發流程往往都只能受限于在游戲引擎的官方推薦中做選擇。
Cocos Creator 和 Egret 的區別
對入門者來說
Cocos Creator 的集成開發環境比較成熟，整套功能都集成在了開箱即用的 Cocos Creator 客戶端內，除了代碼邏輯需要用VSCode編寫，場景編輯、動態組件設置、資源管理、部署等都可以在單一客戶端內完成操作。
相對來說 Egret 的開發環境有些混亂，有 Egret Launcher / Wing3 / Egret UI Editor / Egret Pro 等各種開發工具，有些功能彼此涵蓋但又各不相同，產品線混亂，對新手來說并不友好。
在官方文檔上，Cocos Creator 更勝一籌，從基礎的游戲Demo教程到API文檔都比Egret的質量更高。在社區熱度和市場占比方面，Cocos Creator 也比 Egret 的討論多一些，所以更容易找到解決方案，對新手更加友好。
在可視化編輯器上的一些差別
Cocos Creator 官方更推薦在客戶端用GUI操作完成大部分場景、圖形、動畫工作，在代碼層僅編寫業務代碼以及一些比較復雜抽象的動畫邏輯。
優點：在制作動畫效果和場景時更直觀、方便；
缺點：由于可視化編輯器功能繁多，學習操作有一定難度。
Egret的可視化編輯器目前比較簡陋，動畫和業務邏輯都依賴在代碼層編寫。
優點：開發方式對web開發者更為熟悉；
缺點：制作場景和動畫效果時并不直觀，需要更多思維負擔。
總結
想要從WEB前端轉而上手H5游戲開發，首先要加強形象和抽象相互轉換的思維能力，擁有從具體的動畫效果抽象出代碼控制邏輯的能力會很有優勢。在選定游戲引擎后，還需要對該引擎的開發流程做充分了解，需要學習的部分：游戲引擎自研或推薦的IDE的使用、可視化場景編輯器的使用、代碼架構方式、游戲引擎API、Debug方式、部署方式。
從個人角度來說，Cocos Creator 有更清晰的產品線和文檔、合適的難度曲線，更適合從 WEB前端轉向游戲開發。
