Publishing a PlayCanvas Game

Publish to PlayCanvas Hosting

The fastest path from editor to playable game is the built-in publish feature. Click the publish button in the editor toolbar, choose "Publish to PlayCanvas," and the system builds and hosts your game at a unique URL on playcanvas.com. You can share this URL immediately with playtesters, clients, or portfolio visitors. Each time you publish again, the same URL updates with your latest changes, so existing links always point to the most recent version.

PlayCanvas hosting works well for several scenarios. During development, it provides a stable public URL for external playtesting without requiring you to set up your own server. For game jams and prototypes, you get instant distribution without infrastructure overhead. For portfolio pieces, the hosted URL demonstrates your work with no dependencies on your own hosting remaining active.

The limitations of PlayCanvas hosting appear at scale. You share a domain with every other PlayCanvas project, which means you cannot use a custom domain name, configure custom caching headers, add server-side analytics, or control the hosting infrastructure. For games that need custom domains, specific CDN configurations, or integration with backend services, self-hosting provides the control you need.

Primary builds replace the previous hosted version at the same URL. If you need to maintain multiple versions simultaneously (for example, a production build and a staging build), create separate PlayCanvas projects or use self-hosting where you can deploy to different URLs independently.

Download and Self-Host Your Build

The download option in the publish menu exports your game as a zip file containing all the static files needed to run it. Extract the archive and you have an index.html file, the PlayCanvas engine runtime, your compiled scripts, and all your assets in optimized form. These files can be uploaded to any web server, and the game will run exactly as it does in the editor preview.

For basic web hosting, upload the extracted files to your server's public directory. The game loads from index.html, which references the engine and asset files using relative paths. Make sure your server is configured to serve the correct MIME types for JavaScript (.js as application/javascript), WebAssembly (.wasm as application/wasm), and compressed assets (.basis as application/octet-stream). Most modern web servers handle these correctly by default.

Cloud hosting services provide the best performance-to-cost ratio for static game files. AWS S3 with CloudFront, Google Cloud Storage with Cloud CDN, or Azure Blob Storage with CDN all serve static files globally with low latency and automatic scaling. Upload your build files to a storage bucket, point a CDN distribution at the bucket, attach your custom domain with an SSL certificate, and your game serves from edge locations worldwide. Monthly hosting costs for a moderately popular game typically stay under a few dollars because static file serving requires no compute resources.

Enable gzip or Brotli compression on your server or CDN for JavaScript and HTML files to reduce download sizes. PlayCanvas build settings include an option to pre-compress script bundles, which saves the server from compressing files on every request. Configure cache headers so the browser caches asset files aggressively (long max-age values) while keeping the HTML file uncached or short-cached so players always get the latest version when you update.

Set up a build pipeline that automates the process if you deploy frequently. A script that downloads the build from PlayCanvas, extracts it, and uploads it to your hosting provider saves manual steps and reduces the chance of deployment errors. You can also use the PlayCanvas REST API to trigger builds programmatically from your CI system.

Configure as a Progressive Web App

A Progressive Web App (PWA) lets users install your game to their device's home screen, providing an app-like experience without going through an app store. Installed PWAs launch in their own window without browser chrome, can work offline if you configure a service worker, and appear in the device's app switcher alongside native applications.

To make your PlayCanvas game a PWA, add three things to your build. First, create a web app manifest file (manifest.json) that declares your game's name, icons at multiple resolutions, theme colors, display mode (set to "standalone" for full-screen without browser UI), and start URL. Link this manifest from the index.html file's head section.

Second, register a service worker that caches your game's files for offline access. The service worker intercepts network requests and serves cached responses when the network is unavailable. For a game, cache all the critical files (HTML, JavaScript, engine runtime, and essential assets) during installation, and use a network-first strategy for non-essential assets that can load later. The Workbox library simplifies service worker creation with pre-built caching strategies.

Third, create icon images at the resolutions that different platforms expect. Android requires 192x192 and 512x512 pixel icons. iOS uses several sizes from 120x120 up to 1024x1024. Include these in your manifest's icons array with the correct size and type declarations. When users visit your game and the browser detects a valid manifest and service worker, it shows an "Add to Home Screen" prompt automatically.

PWAs installed from Chrome on Android have nearly the same capabilities as native apps, including access to device sensors, push notifications, and background sync. On iOS, PWA capabilities are more limited, but the core experience of launching from the home screen in full screen mode works reliably. This makes PWA configuration a low-effort way to give your game a native feel without the overhead of app store submission.

Wrap for App Store Distribution

If your business model requires app store presence (for discoverability, in-app purchases, or platform-specific features), you can wrap your PlayCanvas game in a native shell. The game code remains identical web content, but the wrapper provides a native WebView that runs it and exposes native APIs through JavaScript bridges.

Capacitor, maintained by the Ionic team, is the most widely used wrapper for packaging web apps as mobile applications. Install Capacitor in your build directory, add the iOS and Android platforms, and build the native projects. The result is an Xcode project for iOS and an Android Studio project for Android, each containing your game inside a native WebView. You submit these projects to the App Store and Google Play following their standard submission processes.

Capacitor plugins provide access to native features that web APIs cannot reach, including in-app purchases, push notifications, haptic feedback, native file system access, and platform-specific social sharing. Install plugins via npm and call them from your PlayCanvas scripts using the Capacitor JavaScript API. The plugin system is extensible, so you can write custom native code that bridges to your JavaScript game logic.

For desktop distribution, Electron wraps your game in a Chromium-based window that runs as a standalone application on Windows, macOS, and Linux. Electron apps can access the local file system, display native menus, show system notifications, and integrate with OS-level features. You can distribute Electron builds through Steam, itch.io, the Epic Games Store, or direct download from your website.

Performance in wrapped apps is slightly lower than in a standalone browser because the WebView or Electron instance carries overhead from the embedding process. Test your wrapped build on target devices early in development to identify performance gaps. Most well-optimized PlayCanvas games run smoothly in wrappers, but GPU-heavy scenes may need reduced quality settings compared to their browser versions.

Embed in Websites and Ad Platforms

Embedding your game inside another webpage uses an iframe element that points to your hosted game URL. The iframe provides complete isolation between the game and the host page, meaning the host's CSS and JavaScript cannot interfere with your game and vice versa. Set the iframe's width, height, and border properties to control how the game appears within the surrounding content.

For responsive embedding, use CSS to make the iframe fill its container proportionally. A common technique wraps the iframe in a div with padding-bottom set to the aspect ratio percentage (for example, 56.25% for 16:9) and positions the iframe absolutely within that container. This ensures the game maintains its aspect ratio regardless of the container's width, adapting to different screen sizes without distortion.

Communication between the host page and the embedded game uses the browser's postMessage API. The host page can send messages to the game iframe (for example, passing user identity data or triggering game events), and the game can send messages back to the host (for example, reporting scores or completion events). Always validate the message origin to prevent cross-site scripting attacks from malicious embeds.

Ad platform deployment has specific requirements for file size and loading behavior. Most ad networks impose strict payload limits, often 2 to 5 MB total, and require the ad to be interactive within a few seconds. PlayCanvas's small engine footprint and asset compression tools make it one of the best engines for meeting these requirements. Build with aggressive compression settings, minimize the number of textures, and use procedural techniques where possible to reduce asset weight. The MRAID (Mobile Rich Media Ad Interface Definition) standard defines how interactive ads communicate with their host ad container, and PlayCanvas games can implement MRAID hooks through a small adapter script.