web: Automatically chosen preferred renderer

web/packages/core/src/config.ts

@@ -5,6 +5,7 @@ import {
     WindowMode,
     Letterbox,
     LogLevel,
+    RenderBackend,
 } from "./load-options";
 
 export const DEFAULT_CONFIG: Required<BaseLoadOptions> = {
@@ -35,5 +36,5 @@ export const DEFAULT_CONFIG: Required<BaseLoadOptions> = {
     publicPath: null,
     polyfills: true,
     playerVersion: null,
-    preferredRenderer: null,
+    preferredRenderer: RenderBackend.Automatic,
 };

web/packages/core/src/load-options.ts

@@ -123,6 +123,11 @@ export const enum WindowMode {
  * The available backends may change in future releases.
  */
 export const enum RenderBackend {
+    /**
+     * Lets Ruffle select which renderer to use.
+     */
+    Automatic = "",
+
     /**
      * An [in-development API](https://caniuse.com/webgpu) that will be preferred if available in the future.
      * Should behave the same as wgpu-webgl, except with lower overhead and thus better performance.
@@ -384,7 +389,7 @@ export interface BaseLoadOptions {
      * The available values in order of default preference are:
      * "webgpu", "wgpu-webgl", "webgl", "canvas".
      *
-     * @default null
+     * @default RenderBackend.Automatic
      */
     preferredRenderer?: RenderBackend | null;
 

web/packages/extension/assets/options.html

@@ -50,6 +50,7 @@
             </div>
             <div class="option select">
                 <select id="preferred_renderer">
+                    <option value="">Automatic</option>
                     <option value="webgpu">WebGPU</option>
                     <option value="wgpu-webgl">Wgpu (via WebGL)</option>
                     <option value="webgl">WebGL</option>

web/src/lib.rs

@@ -1428,9 +1428,11 @@ async fn create_renderer(
 
     let mut renderer_list = vec!["webgpu", "wgpu-webgl", "webgl", "canvas"];
     if let Some(preferred_renderer) = &config.preferred_renderer {
-        if let Some(pos) = renderer_list.iter().position(|&r| r == preferred_renderer) {
-            renderer_list.remove(pos);
-            renderer_list.insert(0, preferred_renderer.as_str());
+        if !preferred_renderer.is_empty() {
+            if let Some(pos) = renderer_list.iter().position(|&r| r == preferred_renderer) {
+                renderer_list.remove(pos);
+                renderer_list.insert(0, preferred_renderer.as_str());
+            }
         }
     }