yjz-web-sdk 1.0.9-beta.2 → 1.0.9-beta.3

package/lib/util/WasmUtil.d.ts

@@ -9,8 +9,14 @@ export declare enum VideoCodecType {
 }
 export declare function isDecoderSupported(codec: VideoCodecType): Promise<boolean>;
 export declare function isEncoderSupported(codec: VideoCodecType): Promise<boolean>;
-export declare const isMobileDevice: () => boolean;
-export declare const isWebGPUSupported: () => boolean;
-export declare const isWebGLSupported: (canvas?: HTMLCanvasElement) => boolean;
+export declare const isWebGPUSupported: () => Promise<boolean>;
 export declare const isWebGL2Supported: (canvas?: HTMLCanvasElement) => boolean;
+export declare const isWebGL1Supported: (canvas?: HTMLCanvasElement) => boolean;
 export declare const isCanvas2DSupported: (canvas?: HTMLCanvasElement) => boolean;
+export declare const detectRenderingCapabilities: () => Promise<{
+    webgpu: boolean;
+    webgl2: boolean;
+    webgl1: boolean;
+    canvas2d: boolean;
+    best: string;
+}>;

package/lib/yjz-web-sdk.js

@@ -15716,28 +15716,130 @@ async function isDecoderSupported(codec) {
   }
 }
 const isMobileDevice = () => {
-  return navigator.userAgent.includes("Mobile") || navigator.userAgent.includes("Android") || navigator.userAgent.includes("iPhone") || navigator.userAgent.includes("iPad");
+  if (typeof navigator === "undefined")
+    return true;
+  return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Mobile|mobile|CriOS|OPiOS/i.test(navigator.userAgent) || "ontouchstart" in window;
 };
-const isWebGPUSupported = () => {
+let _webgpuChecked = false;
+let _webgpuSupported = false;
+const isWebGPUSupported = async () => {
   var _a;
-  if (isMobileDevice())
+  if (_webgpuChecked)
+    return _webgpuSupported;
+  if (isMobileDevice()) {
+    _webgpuSupported = false;
+    _webgpuChecked = true;
     return false;
-  return "gpu" in navigator && typeof ((_a = navigator.gpu) == null ? void 0 : _a.requestAdapter) === "function";
-};
-const isWebGLSupported = (canvas) => {
-  canvas = canvas ?? document.createElement("canvas");
-  const gl = canvas.getContext("webgl") || canvas.getContext("experimental-webgl");
-  return !!gl;
+  }
+  if (!("gpu" in navigator) || typeof ((_a = navigator.gpu) == null ? void 0 : _a.requestAdapter) !== "function") {
+    _webgpuSupported = false;
+    _webgpuChecked = true;
+    return false;
+  }
+  try {
+    const adapter = await navigator.gpu.requestAdapter();
+    _webgpuSupported = !!adapter;
+  } catch (e) {
+    console.warn("[WebGPU] detection failed:", e);
+    _webgpuSupported = false;
+  } finally {
+    _webgpuChecked = true;
+  }
+  return _webgpuSupported;
 };
+let _webgl2Checked = false;
+let _webgl2Supported = false;
 const isWebGL2Supported = (canvas) => {
-  canvas = canvas ?? document.createElement("canvas");
-  const gl2 = canvas.getContext("webgl2");
-  return !!gl2;
+  if (_webgl2Checked)
+    return _webgl2Supported;
+  const testCanvas = document.createElement("canvas");
+  const contextNames = ["webgl2", "experimental-webgl2"];
+  let gl = null;
+  for (const name of contextNames) {
+    try {
+      gl = testCanvas.getContext(name);
+      if (gl)
+        break;
+    } catch (_) {
+    }
+  }
+  _webgl2Supported = !!gl;
+  _webgl2Checked = true;
+  return _webgl2Supported;
 };
+let _webgl1Checked = false;
+let _webgl1Supported = false;
+const isWebGL1Supported = (canvas) => {
+  if (_webgl1Checked)
+    return _webgl1Supported;
+  const testCanvas = document.createElement("canvas");
+  const contextNames = [
+    "webgl",
+    "experimental-webgl",
+    "webkit-3d",
+    "moz-webgl"
+  ];
+  let gl = null;
+  for (const name of contextNames) {
+    try {
+      gl = testCanvas.getContext(name);
+      if (gl)
+        break;
+    } catch (_) {
+    }
+  }
+  if (gl) {
+    const debugInfo = gl.getExtension("WEBGL_debug_renderer_info");
+    if (debugInfo) {
+      const renderer2 = gl.getParameter(debugInfo.UNMASKED_RENDERER_WEBGL);
+      if (renderer2 && /llvmpipe|software/i.test(renderer2)) {
+        gl = null;
+      }
+    }
+  }
+  _webgl1Supported = !!gl;
+  _webgl1Checked = true;
+  return _webgl1Supported;
+};
+let _canvas2dChecked = false;
+let _canvas2dSupported = false;
 const isCanvas2DSupported = (canvas) => {
-  canvas = canvas ?? document.createElement("canvas");
-  const ctx = canvas.getContext("2d");
-  return !!ctx;
+  if (_canvas2dChecked)
+    return _canvas2dSupported;
+  const testCanvas = document.createElement("canvas");
+  let ctx = null;
+  try {
+    ctx = testCanvas.getContext("2d", {
+      // 防止某些极端隐私模式下返回 null
+      alpha: true,
+      desynchronized: false
+    });
+  } catch (_) {
+    ctx = null;
+  }
+  if (ctx && typeof ctx.fillRect === "function") {
+    _canvas2dSupported = true;
+  } else {
+    _canvas2dSupported = false;
+  }
+  _canvas2dChecked = true;
+  return _canvas2dSupported;
+};
+const detectRenderingCapabilities = async () => {
+  const [webgpu, webgl2, webgl1, canvas2d] = await Promise.all([
+    isWebGPUSupported(),
+    Promise.resolve(isWebGL2Supported()),
+    Promise.resolve(isWebGL1Supported()),
+    Promise.resolve(isCanvas2DSupported())
+  ]);
+  return {
+    webgpu,
+    webgl2,
+    webgl1,
+    canvas2d,
+    // 推荐的降级顺序
+    best: webgpu ? "webgpu" : webgl2 ? "webgl2" : webgl1 ? "webgl1" : canvas2d ? "canvas2d" : "none"
+  };
 };
 const _WebGLRenderer = class _WebGLRenderer {
   constructor(type, canvas) {
@@ -17493,24 +17595,26 @@ function useRemoteVideo(videoContainer, remoteVideoElement, audioElement, videoA
     await initRender(video);
   };
   const initRender = async (video) => {
+    const caps = await detectRenderingCapabilities();
+    console.log("caps", caps);
     if (isWebCodec.value) {
-      if (isWebGPUSupported()) {
+      if (caps.webgpu) {
         webRenderer.value = new WebGPURenderer(video);
         console.log("支持====>webGpu");
-      } else if (isWebGL2Supported()) {
+      } else if (caps.webgl2) {
         webRenderer.value = new WebGLRenderer("webgl2", video);
         console.log("支持====>webgl2");
-      } else if (isWebGLSupported()) {
+      } else if (caps.webgl1) {
         webRenderer.value = new WebGLRenderer("webgl", video);
         console.log("支持====>webgl");
-      } else if (isCanvas2DSupported()) {
+      } else if (caps.canvas2d) {
         webRenderer.value = new Canvas2DRenderer(video);
         console.log("支持====>Canvas2D");
       } else {
         console.log("error====>不支持");
       }
     } else {
-      if (isWebGPUSupported()) {
+      if (caps.webgpu) {
         wasmRenderer.value = new WebGPUDefault8Render(video, {
           renderMode: 0,
           devicePixelRatio: window.devicePixelRatio
@@ -17518,7 +17622,7 @@ function useRemoteVideo(videoContainer, remoteVideoElement, audioElement, videoA
         await wasmRenderer.value.init();
         wasmRenderer.value.viewport(video.offsetWidth, video.offsetHeight);
         console.log("支持====>WebGPUDefault8Render");
-      } else if (isWebGL2Supported() || isWebGLSupported()) {
+      } else if (caps.webgl2 || caps.webgl1) {
         wasmRenderer.value = new WebGLDefault8Render(video, {
           renderMode: 0,
           devicePixelRatio: window.devicePixelRatio

package/package.json

@@ -1,17 +1,17 @@
 {
   "name": "yjz-web-sdk",
   "private": false,
-  "version": "1.0.9-beta.2",
+  "version": "1.0.9-beta.3",
   "type": "module",
   "description": "针对于亚矩阵项目的云手机投屏和屏幕控制",
   "license": "Apache-2.0",
-  "main": "lib/yjz-web-sdk.umd.cjs",
+  "main": "lib/yjz-web-sdk.js",
   "module": "lib/yjz-web-sdk.js",
   "types": "./lib/index.d.ts",
   "exports": {
     ".": {
       "import": "./lib/yjz-web-sdk.js",
-      "require": "./lib/yjz-web-sdk.umd.cjs",
+      "require": "./lib/yjz-web-sdk.js",
       "types": [
         "./lib/index.d.ts"
       ]