melonJS（又稱melonJS遊戲引擎）是一款基於MIT協定的開源HTML5遊戲引擎，由社區開發者團隊維護並託管於GitHub平台，專注於2D網頁遊戲的輕量化開發。
該引擎於2011年首次發布，通過ES6重構和現代構建工具（如Rollup/esbuild）實現架構升級，支持WebGL渲染與Canvas回退機制，兼容主流瀏覽器及移動設備。其核心功能包括基於SAT算法的多邊形碰撞檢測、Tiled地圖編輯器集成、狀態管理系統以及多輸入設備支持，開發者可通過模組化設計快速搭建遊戲框架。技術生態包含Web Audio音頻系統、異步資源載入器、粒子系統及官方外掛程式擴展，並提供ES6+Vite/TypeScript模板簡化開發流程。作為無外部依賴的獨立庫，melonJS長期保持開源特性，通過GitHub協作推動版本疊代，形成涵蓋文檔、論壇和Discord的技術支持體系。
基本介紹
- 外文名：melonJS
- 本質：開源的HTML5遊戲引擎
- 協定：MIT License協定
- 特點：集成了流行的磚塊地圖格式
設備特點,示例代碼,
設備特點
melonJS 是一系列過去實驗的結果，是一個開放、自由而且使用簡單的HTML網頁遊戲開發包。雖然還有一個大工作正在進行中，但melonJS已經可以輕鬆地創建一些不錯的遊戲。它集成了流行的磚塊地圖格式，可使用 Tiled map editor 所編輯的地圖。
示例代碼
// game resources
varg_resources = [];
varjsApp = {
/* ---
Initialize the jsApp
--- */
onload: function() {
// init the video
if(!me.video.init('jsapp', 640, 480, false, 1.0)) {
alert("Sorry but your browser does not support html 5 canvas.");
return;
}
// initialize the "audio"
me.audio.init("mp3,ogg");
// set all resources to be loaded
me.loader.onload = this.loaded.bind(this);
// set all resources to be loaded
me.loader.preload(g_resources);
// load everything & display a loading screen
me.state.change(me.state.LOADING);
},
/* ---
callback when everything is loaded
--- */
loaded: function() {
// set the "Play/Ingame" Screen Object
me.state.set(me.state.PLAY, newPlayScreen());
// start the game
me.state.change(me.state.PLAY);
}
};
// jsApp
/* the in game stuff*/
varPlayScreen = me.ScreenObject.extend({
onResetEvent: function() {
// stuff to reset on state change
},
/* ---
action to perform when game is finished (state change)
--- */
onDestroyEvent: function() {
}
});
//bootstrap :)
window.onReady(function() {
jsApp.onload();
});
這是非常簡單的。一旦頁面被載入,onload()函式被調用時,初始化顯示和音頻,和所有的遊戲資源開始載入。我們還定義一個回調被稱為當一切都可以用。在回調中,我們定義了一個新國家,將會用於在遊戲的東西,加上一個PlayScreen對象,我們將使用管理遊戲事件(復位,等等……)。
