@needle-tools/materialx 1.2.1-next.f90216c → 1.2.2

package/CHANGELOG.md

@@ -4,6 +4,9 @@ All notable changes to this package will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
+## [1.2.2] - 2025-07-24
+- Add: `preloadWasm` function with support to wait for network idle. This is automatically done for Needle Engine projects.
+
 ## [1.2.1] - 2025-07-23
 - Fix: error caused by scene.environment being null 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@needle-tools/materialx",
-  "version": "1.2.1-next.f90216c",
+  "version": "1.2.2",
   "type": "module",
   "main": "index.js",
   "types": "index.d.ts",
@@ -56,4 +56,4 @@
     "mtlx",
     "rendering"
   ]
-}
+}

package/src/index.d.ts

@@ -1,4 +1,4 @@
-export { ready, type MaterialXContext } from "./materialx.js";
+export { ready, type MaterialXContext, preloadWasm } from "./materialx.js";
 export { MaterialXMaterial } from "./materialx.material.js";
 export { MaterialXLoader } from "./loader/loader.three.js";
 
@@ -9,3 +9,4 @@ declare const Experimental_API: {
 };
 
 export { Experimental_API };
+

package/src/index.js

@@ -1,11 +1,16 @@
-export { ready } from "./materialx.js";
+import { createMaterialXMaterial } from "./loader/loader.three.js";
+
+export { ready, preloadWasm } from "./materialx.js";
 export { MaterialXMaterial } from "./materialx.material.js";
 export { MaterialXLoader } from "./loader/loader.three.js";
 
-import { createMaterialXMaterial } from "./loader/loader.three.js";
 
+/**
+ * Experimental API for creating MaterialX materials.
+ */
 const Experimental_API = {
     createMaterialXMaterial
-}
+};
+
+export { Experimental_API };
 
-export { Experimental_API }

package/src/loader/loader.needle.js

@@ -1,6 +1,7 @@
 import { addCustomExtensionPlugin, Context } from "@needle-tools/engine";
 import { useNeedleMaterialX as _useNeedleMaterialX } from "./loader.three.js";
 import { debug } from "../utils.js";
+import { preloadWasm } from "../materialx.js";
 
 /**
  * @typedef {import("@needle-tools/engine").INeedleGLTFExtensionPlugin} INeedleGLTFExtensionPlugin
@@ -58,5 +59,6 @@ export class MaterialXLoaderPlugin {
  * @returns {Promise<void>}
  */
 export async function useNeedleMaterialX() {
+    preloadWasm("network_idle");
     addCustomExtensionPlugin(new MaterialXLoaderPlugin());
 }

package/src/materialx.d.ts

@@ -1,6 +1,8 @@
 import { Light, Scene, Texture, WebGLRenderer } from "three";
 import type { MaterialX as MX } from "./materialx.types.js";
 
+export function preloadWasm(trigger: "immediately" | "network_idle"): Promise<void>;
+
 export type MaterialXContext = {
     getTime?(): number;
     getFrame?(): number;

package/src/materialx.js

@@ -1,10 +1,27 @@
 import MaterialX from "../bin/JsMaterialXGenShader.js";
-import { debug } from "./utils.js";
+import { debug, waitForNetworkIdle } from "./utils.js";
 import { renderPMREMToEquirect } from "./utils.texture.js";
 import { Light, Mesh, MeshBasicMaterial, Object3D, PlaneGeometry, PMREMGenerator, Scene, Texture, WebGLRenderer } from "three";
 import { registerLights, getLightData } from "./materialx.helper.js";
 import { whiteTexture } from "./utils.texture.js";
 
+
+/**
+ * Preloads the MaterialX WebAssembly module.
+ * @type {import("./materialx.js").preloadWasm}
+ */
+export async function preloadWasm(trigger) {
+    if (trigger === "immediately") {
+        // Load the WASM module immediately
+        return ready();
+    } else if (trigger === "network_idle") {
+        // Wait for network to be idle before loading
+        return waitForNetworkIdle().then(ready);
+    }
+}
+
+
+
 export const state = new class {
     /** @type {import("./materialx.types.js").MaterialX.MODULE | null} */
     materialXModule = null;

package/src/utils.d.ts

@@ -15,3 +15,6 @@ export function getTime(): number;
  * Get current frame number
  */
 export function getFrame(): number;
+
+
+export function waitForNetworkIdle(): Promise<void>;

package/src/utils.js

@@ -44,3 +44,16 @@ function updateTime() {
 }
 
 window.requestAnimationFrame(updateTime);
+
+
+
+
+export async function waitForNetworkIdle() {
+    if (typeof requestIdleCallback !== "undefined") {
+        return new Promise(res => requestIdleCallback(res));
+    }
+    else {
+        console.debug("[MaterialX] Can not wait for network idle, using fallback");
+        return new Promise(res => setTimeout(res, 100)); // Fallback to a short delay
+    }
+}

package/src/utils.texture.d.ts

@@ -1,5 +1,7 @@
 import { WebGLRenderer, WebGLRenderTarget, Texture } from 'three';
 
+export const whiteTexture: Texture;
+
 /**
  * Renders a PMREM environment map to an equirectangular texture with specified roughness
  */