OSS探訪
GitHubでログイン
GitHubで見るプロジェクトサイト

WebGPU・WebGL 2・Canvasを同じAPIで扱い、ブラウザ向け2D／2.5Dゲームを組み立てるエンジン

OSS規模スコア 249.7OSS健全度 93更新ペース 55 Commit/30日
スコアの見方

OSS規模スコアはStars・Watchers・Forks・Contributorsを対数圧縮して重み付けした現在の規模指標（上限なし）です。発掘スコアは現在のOSS規模スコアから発掘時点のOSS規模スコアを引いた値、更新ペースは直近30日Commit数、成長モメンタムは直近の観測期間におけるOSS規模スコア差、OSS健全度は取得できた更新状況・Community Health・Releaseの0〜100評価です。

Stars
6,401
主要言語
JavaScript
ライセンス
MIT
リポジトリ最終更新
2026/10/04
ページ内ナビ

概要

melonJSは、ブラウザで動く2D／2.5Dゲームを制作するためのJavaScriptゲームエンジンです。描画、物理演算、入力、音声、カメラ、タイルマップを一つのES moduleで扱い、WebGPU、WebGL 2、Canvasの順に実行環境へ合わせて描画方式を切り替えます。Tiledの2DマップとglTF／GLBの3Dシーンを読み込めるため、画面描画の土台を個別に組み合わせずゲーム制作へ進めます。

特徴と向いている用途

公式資料に基づく紹介・実機未検証 · 内容確認日：

主な特徴

描画方式の違いを吸収し、同じゲームコードを複数のブラウザ環境で動かす

Canvas2Dに近い描画APIの下で、WebGPU、WebGL 2、Canvasを自動選択できます。スプライト、カメラ、パーティクル、後処理、独自シェーダーなどを同じエンジンの構成要素として扱えるため、描画基盤ごとにゲームロジックを書き分ける負担を抑えられます。

出典：[2]

TiledのマップとglTFシーンを制作工程から直接読み込む

Tiledで作成した直交・アイソメトリック・六角形などのマップに加え、glTF／GLBのメッシュ、素材、カメラ、ライト、アニメーションをシーンとして読み込めます。物理演算、入力、音声、UIも含まれるため、試作から小規模な完成作品まで一つの実行基盤で進められます。

出典：[2]

向いている用途

ブラウザ配信を前提に、2D中心のゲームへ必要な機能をまとめて使いたい開発に向く

タイルマップを使うアクションやRPG、Canvasの考え方を生かしたゲーム、2D表現へ一部の3D素材を加える制作に向きます。TypeScriptとViteを使う雛形が用意されており、独自のビルド環境へ固定されずに始めたい個人や小規模チームにも適しています。

出典：[2]

導入前の確認

対象ブラウザの描画機能と、20系の実行要件を先に確認する

WebGPUを利用できない環境ではWebGL 2またはCanvasへ切り替わり、同じ機能でも性能特性は変わります。20系ではWebGL 1が描画経路から外れているため、古い端末を対象にする場合は実機確認が必要です。20.7.0のパッケージ開発要件はNode.js 24以上であり、ゲーム資産の容量、音声の自動再生制限、入力方式ごとの操作性も別に検証してください。

出典：[2][4][3]

参考にした公式資料

  1. [1]melonjs/melonJS repository metadata(2026-10-04)
  2. [2]melonJS 20.7.0 README(2026-10-04)
  3. [3]melonJS 20.7.0 release(2026-10-04)
  4. [4]melonJS 20.7.0 package metadata(2026-10-04)
  5. [5]melonJS 20.7.0 MIT license(2026-10-04)
編集部からの補足

ゲームエンジンの比較では機能数だけでなく、対象端末で選ばれる描画方式と、制作に使うマップ・3D資産の流れを確認してください。古い端末を含む場合はCanvasへの切り替え後も遊べる性能かを早い段階で測るのが重要です。

3ステップで試す

  1. 1

    ゲームの雛形を作成する

    Node.js 24以上とnpmを用意し、公式creator 1.0.1を固定してTypeScript、Vite、デバッグ用プラグインを含む雛形を作ります。

    npm create melonjs@1.0.1 my-game
  2. 2

    依存関係をインストールする

    作成したmy-gameへ移動して依存パッケージを取得します。次の手順も同じ端末と作業ディレクトリで続けます。creator自体は1.0.1へ固定していますが、雛形の依存関係には版の範囲指定があるため、生成されたlockfileを保存して再現性を保ってください。

    cd my-game && npm install
  3. 3

    開発用サーバーを起動する

    インストールしたViteのNode実体を直接127.0.0.1:4173だけで起動し、各要求を2秒、最大30回に制限して空でない入口ページを確認します。成功・失敗のどちらでも、そのPIDを待って回収します。ゲーム操作や描画互換性の確認はブラウザで別途行ってください。

    ( node node_modules/vite/bin/vite.js --host 127.0.0.1 --port 4173 --strictPort > melonjs-dev.log 2>&1 & server_pid=$!; trap 'kill "$server_pid" 2>/dev/null || true; wait "$server_pid" 2>/dev/null || true' EXIT; ready=0; for attempt in 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30; do if curl -fsS --connect-timeout 1 --max-time 2 http://127.0.0.1:4173/ -o melonjs-home.html; then ready=1; break; fi; kill -0 "$server_pid" 2>/dev/null || { cat melonjs-dev.log; exit 1; }; sleep 1; done; if test "$ready" != 1; then cat melonjs-dev.log; exit 1; fi; test -s melonjs-home.html )
公式READMEで確認

成長

成長の推移 · 直近30日

6,401 Stars

推移データを蓄積中です。

開発アクティビティ

直近90日・週次

Commit（直近30日）
55
Open PR
2

開発アクティビティを蓄積中です。

Built with

カテゴリとタグ

カテゴリ

タグ

GitHubデータ

GitHubのデータGitHubの詳細データを見る
GitHubで見る

GitHub Topics

  • melonjs
  • javascript
  • game-engine
  • webgl
  • webaudio
  • html5
  • es6
  • gamedev
  • game-development
  • canvas2d
  • tiled
  • 2d-game-engine
Stars
6,401
Forks
663
Watchers
168
Open Issues
20
Contributors
94
所有者種別
Organization
主要言語
JavaScript
ライセンス
MIT
リポジトリ最終更新
2026/10/04
関連記事を投稿する

このOSSの使い方や活用事例をMarkdownで投稿できます。管理者が承認した後に公開されます。

情報の誤りを報告

掲載内容に誤りや古い情報があればお知らせください。

このページを読んで、次に何をすればよいか分かりましたか？