# Compatible Game Engines


Facebook Instant Games run on standard web technology (HTML5, JavaScript, CSS, WebGL). HTML5 support means **any game engine that can export to HTML5 will work with Instant Games**. You are not locked into a specific engine or framework.

This page covers the most commonly used engines and how to export your project for the Instant Games platform. If your preferred engine is not listed here but supports HTML5 export, it works -- just follow the general integration steps at the bottom of this page.

## Engine overview

| Engine | License | 2D/3D | Instant Games Support |
|--------|---------|-------|-----------------------|
| [Construct 2/3](#construct-2--3) | Commercial | 2D | Built-in plugin |
| [Cocos Creator](#cocos-creator) | Free / Commercial | 2D and 3D | Built-in export target |
| [PlayCanvas](#playcanvas) | Free / Commercial | 3D (and 2D) | Direct integration |
| [Phaser](#phaser) | Open Source (MIT) | 2D | Manual SDK integration |
| [PixiJS](#pixijs) | Open Source (MIT) | 2D | Manual SDK integration |
| [Unity](#unity) | Commercial | 2D and 3D | Via [Meta Instant Games Unity Plugin](https://github.com/facebook/meta_instant_games_unity_plugin) |
| [Defold](#defold) | Free (Source Available) | 2D and 3D | Built-in export target |
| [GameMaker](#gamemaker) | Commercial | 2D | HTML5 export + manual SDK integration |
| [Godot](#godot) | Open Source (MIT) | 2D and 3D | HTML5 export + manual SDK integration |

---

## Construct 2 / 3

[Construct](https://www.construct.net/) is a visual game editor for 2D games. It has built-in support for Facebook Instant Games.

### How to export

**Construct 3:**
1. Open your project in Construct 3.
2. Go to **Menu** > **Project Settings**.
3. Under **Advanced**, find the **Facebook Instant Games** section and enable it.
4. Set your Facebook App ID.
5. Go to **Menu** > **Export** > **Facebook Instant Games**.
6. Construct will generate a ready-to-upload `.zip` bundle.

**Construct 2:**
1. Install the Instant Games plugin from the addon exchange.
2. In your project, add the **Facebook Instant Games** object.
3. Export using **File** > **Export project** > **Facebook Instant Games**.

### Notes

- Construct handles the SDK lifecycle (`initializeAsync`, `startGameAsync`) automatically.
- Construct provides event-based access to player info, leaderboards, context, and ads -- no JavaScript coding required.
- Construct 3 offers the best Instant Games support. Construct 2 support is more limited.

---

## Cocos Creator

[Cocos Creator](https://www.cocos.com/en/creator) is a free game engine for 2D and 3D games with a built-in Facebook Instant Games export target.

### How to export

1. Open your project in Cocos Creator.
2. Go to **Project** > **Build**.
3. Select **Facebook Instant Games** as the build platform.
4. Enter your Facebook App ID.
5. Click **Build**.
6. Cocos Creator generates a build folder. Zip the contents (not the folder itself) for upload.

### Notes

- Cocos Creator automatically injects the FBInstant SDK script and handles initialization.
- You can access FBInstant APIs directly from your game scripts after the platform initializes.
- Make sure your build output has `index.html` at the root of the zip.
- Cocos Creator's built-in asset pipeline can help keep bundle sizes small.

---

## PlayCanvas

[PlayCanvas](https://playcanvas.com/) is a web-first game engine for 3D (and 2D) games with a browser-based editor.

### How to export

1. In the PlayCanvas Editor, go to your project settings.
2. Add the FBInstant SDK as an external script: `https://connect.facebook.net/en_US/fbinstant.8.0.js`
3. Modify your game's loading sequence to call `FBInstant.initializeAsync()` before starting the PlayCanvas app.
4. Use `FBInstant.setLoadingProgress()` during asset preloading.
5. Call `FBInstant.startGameAsync()` after all assets are loaded.
6. Download the project build and zip it for upload.

### Notes

- PlayCanvas projects are well suited for Instant Games because they are already web-based.
- PlayCanvas has published official tutorials for Instant Games integration.
- The engine's asset compression and lazy loading features help meet size requirements.

---

## Phaser

[Phaser](https://phaser.io/) is one of the most popular open-source HTML5 game frameworks for 2D games.

### How to export

Phaser does not have a built-in Instant Games export. You integrate the SDK manually:

1. Add the FBInstant SDK script to your `index.html`:
   ```html
   <script src="https://connect.facebook.net/en_US/fbinstant.8.0.js"></script>
   ```

2. Wrap your Phaser game creation in the SDK lifecycle:
   ```javascript
   FBInstant.initializeAsync()
     .then(function() {
       // Create the Phaser game instance
       var config = {
         type: Phaser.AUTO,
         width: 800,
         height: 600,
         scene: {
           preload: preload,
           create: create,
           update: update
         }
       };

       var game = new Phaser.Game(config);
     });

   function preload() {
     // Load assets and report progress
     this.load.on('progress', function(value) {
       FBInstant.setLoadingProgress(Math.floor(value * 100));
     });

     this.load.image('logo', 'assets/logo.png');
   }

   function create() {
     // Start the game once assets are loaded
     FBInstant.startGameAsync().then(function() {
       // Game is now visible to the player
       var playerName = FBInstant.player.getName();
       console.log('Welcome, ' + playerName);
     });
   }

   function update() {
     // Game loop
   }
   ```

3. Bundle your project files (including the Phaser library) into a zip.

### Notes

- Phaser 3 (also called Phaser 3.x or Phaser 4) is recommended over Phaser 2/CE.
- Use the minified version of Phaser (`phaser.min.js`) to reduce bundle size.
- Phaser's built-in loader provides progress events that map directly to `setLoadingProgress`.

---

## PixiJS

[PixiJS](https://pixijs.com/) is a fast, lightweight 2D rendering library.

### How to export

Like Phaser, PixiJS requires manual SDK integration:

1. Add the FBInstant SDK to your `index.html`:
   ```html
   <script src="https://connect.facebook.net/en_US/fbinstant.8.0.js"></script>
   ```

2. Initialize the SDK before creating your PixiJS application:
   ```javascript
   FBInstant.initializeAsync()
     .then(function() {
       FBInstant.setLoadingProgress(100);
       return FBInstant.startGameAsync();
     })
     .then(function() {
       // Create the PixiJS app
       var app = new PIXI.Application({
         width: 800,
         height: 600
       });
       document.body.appendChild(app.view);

       // Your game code here
     });
   ```

3. Zip your project files for upload.

### Notes

- PixiJS is a rendering library, not a full game framework. You will need to handle game logic, input, audio, and other systems yourself (or use additional libraries).
- PixiJS is very lightweight, making it a good choice when bundle size is a concern.
- Consider using a PixiJS-based framework like PixiJS Game or a custom setup for more complex games.

---

## Unity

[Unity](https://unity.com/) is a widely used commercial game engine for 2D and 3D games. Unity can export to WebGL (HTML5), and Meta provides the official [Meta Instant Games Unity Plugin](https://github.com/facebook/meta_instant_games_unity_plugin) to integrate the FBInstant SDK with full C# async/await support, editor tooling, and Zero Permissions overlay views.

For complete documentation, see the [Unity Plugin reference](https://developers.facebook.com/documentation/games/sdk-reference/unity-plugin).

### How to export

1. **Install the plugin**:
   - Download or clone the plugin from the [GitHub repository](https://github.com/facebook/meta_instant_games_unity_plugin).
   - Import it into your Unity project under `Assets/Meta.InstantGames/`.

2. **Configure your project**:
   - Open **Window** > **Instant Games** > **Project Optimiser** to apply recommended WebGL build settings.
   - The plugin installs a WebGL template at `Assets/WebGLTemplates/FB/` that handles SDK initialization automatically.

3. **Use the plugin API**:
   ```csharp
   using Meta.InstantGames;

   // Initialize the SDK
   await FBInstant.InitializeAsync();
   await FBInstant.StartGameAsync();

   // Get player info
   string playerId = await FBInstant.Player.GetID();

   // Post a score
   await FBInstant.PostSessionScore(100);
   ```

4. **Build and upload**:
   - Use the built-in **Bundle Uploader** (**Window** > **Instant Games** > **Bundle Uploader**) to build, zip, and upload your WebGL bundle directly to the Instant Games platform.

### Notes

- The plugin includes editor mocking — API calls return mock data in the Unity Editor for testing without a browser.
- The plugin supports [overlay views (NEZP)](https://developers.facebook.com/documentation/games/build/zero-permissions/overview) for displaying player names and photos under the Zero Permissions privacy model.
- Unity WebGL builds tend to be larger than builds from 2D-specific engines. Pay close attention to the [Game Performance](https://developers.facebook.com/documentation/games/build/game-performance) guide.
- Strip unused engine features to reduce build size. Go to **Player Settings** > **Other Settings** and set **Managed Stripping Level** to **High**.
- Disable unnecessary Unity modules (for example, Physics, or Audio) if your game does not use them.
- Unity WebGL builds may have longer initial load times. Use `FBInstant.setLoadingProgress()` to keep players informed.
- Test thoroughly on mobile devices. Unity WebGL can be resource-intensive on low-end phones.

---

## Defold

[Defold](https://defold.com/) is a free, source-available game engine for 2D and 3D games with excellent HTML5 export support.

### How to export

1. In the Defold Editor, open your `game.project` file.
2. Under **Project**, set the **Title** to your game name.
3. Go to **HTML5** settings and configure the canvas and display settings.
4. Add the FBInstant SDK integration:
   - Defold has a community-maintained Facebook Instant Games extension. Add it as a dependency in your `game.project` file.
   - Alternatively, manually modify the exported HTML to include the SDK script.
5. Build for HTML5 via **Project** > **Bundle** > **HTML5 Application**.
6. Zip the output folder contents for upload.

### Notes

- Defold produces very small builds, often well under 5 MB for 2D games, making it an excellent choice for Instant Games.
- The Defold community maintains Instant Games extensions on the Defold Asset Portal.
- Defold's Lua scripting is straightforward and performs well in the browser.

---

## GameMaker

[GameMaker](https://gamemaker.io/) is a popular commercial engine for 2D games.

### How to export

1. In GameMaker, go to **Build** > **Create Executable** and select **HTML5** as the target platform.
2. Configure your HTML5 export settings under **Game Options** > **HTML5**.
3. Build the project. GameMaker generates an HTML5 folder with your game.
4. Modify the generated `index.html` to include the FBInstant SDK:
   ```html
   <script src="https://connect.facebook.net/en_US/fbinstant.8.0.js"></script>
   ```
5. Add SDK initialization calls to your game code. You can use GameMaker's JavaScript extension system to call FBInstant APIs.
6. Zip the output for upload.

### Notes

- GameMaker does not have built-in Instant Games support, so SDK integration requires some manual work.
- Community extensions for Instant Games are available on the GameMaker Marketplace.
- GameMaker's HTML5 builds can sometimes be large. Use texture page settings and audio compression to reduce size.
- Test the HTML5 build in a browser before uploading to make sure everything works outside of the GameMaker IDE.

---

## Godot

[Godot](https://godotengine.org/) is a free, open-source game engine for 2D and 3D games.

### How to export

1. In the Godot Editor, go to **Project** > **Export**.
2. Add an **HTML5** export preset.
3. Configure the export settings:
   - Set the export path.
   - Enable **Experimental Virtual Keyboard** if your game needs text input on mobile.
4. Click **Export Project** to generate the HTML5 build.
5. Modify the generated `index.html` to include the FBInstant SDK script:
   ```html
   <script src="https://connect.facebook.net/en_US/fbinstant.8.0.js"></script>
   ```
6. Add SDK calls using Godot's JavaScript interface:
   ```gdscript
   # In your main scene's _ready() function
   func _ready():
       if OS.has_feature("JavaScript"):
           # Call FBInstant.initializeAsync() via JavaScript
           JavaScriptBridge.eval("""
               FBInstant.initializeAsync().then(function() {
                   FBInstant.setLoadingProgress(100);
                   return FBInstant.startGameAsync();
               }).then(function() {
                   console.log('Game started!');
               });
           """)
   ```
7. Zip all exported files for upload.

### Notes

- Godot 4.x has improved HTML5 export compared to Godot 3.x, but builds can still be sizeable. Monitor your bundle size.
- Godot uses WebAssembly for its HTML5 export, which provides good performance but may increase initial load time.
- The Godot community has created Instant Games plugins and templates that simplify integration.
- Make sure your export template is configured for the smallest possible build. Disable unused modules if you are compiling from source.

---

## General integration steps (any engine)

If your engine is not listed above but can export to HTML5, follow these general steps to integrate with Facebook Instant Games:

### 1. Export to HTML5

Use your engine's HTML5 or web export feature to generate a set of web files (HTML, JS, CSS, assets).

### 2. Add the FBInstant SDK

In your `index.html` file, add the SDK script tag **before** your game scripts:

```html
<script src="https://connect.facebook.net/en_US/fbinstant.8.0.js"></script>
```

### 3. Initialize the SDK

Modify your game's startup sequence to follow the Instant Games lifecycle:

```javascript
FBInstant.initializeAsync()
  .then(function() {
    // Load your game assets here
    // Report progress as assets load
    FBInstant.setLoadingProgress(100);
    return FBInstant.startGameAsync();
  })
  .then(function() {
    // Game is now playable
    startYourGame();
  });
```

### 4. Ensure correct bundle structure

When creating your zip file, make sure `index.html` is at the root level (not inside a subfolder).

### 5. Test

Upload your zip to the Facebook App Dashboard, stage it for testing, and test on both desktop and mobile.

## Tips for all engines

- **Minimize bundle size**: The smaller your initial download, the more likely players are to keep playing. Aim for under 5 MB for the initial bundle. See [Game Performance](https://developers.facebook.com/documentation/games/build/game-performance) for detailed guidance.
- **Test on mobile**: Most Instant Games players are on mobile. Test on real devices, especially lower-end Android phones.
- **Use the loading progress bar**: Always report accurate loading progress via `FBInstant.setLoadingProgress()`. A frozen loading bar causes players to leave.
- **Handle the pause event**: Listen for `FBInstant.onPause()` to handle the game being backgrounded (e.g., pause the game, mute audio).
- **Avoid engine-specific URLs**: Some engines generate absolute file paths or localhost URLs during development. Make sure all paths are relative in your final build.