@babylonjs/smart-filters 0.4.3-alpha → 0.6.0-alpha

package/src/optimization/smartFilterOptimizer.ts

@@ -18,6 +18,7 @@ import {
 } from "../utils/shaderCodeUtils.js";
 import { DependencyGraph } from "./dependencyGraph.js";
 import { DisableableShaderBlock, BlockDisableStrategy } from "../blocks/disableableShaderBlock.js";
+import { textureOptionsMatch, type OutputTextureOptions } from "../blocks/textureOptions.js";
 
 const showDebugData = false;
 
@@ -104,7 +105,7 @@ export class SmartFilterOptimizer {
     private _mainFunctionNameToCode: Map<string, string> = new Map();
     private _dependencyGraph: DependencyGraph<string> = new DependencyGraph<string>();
     private _vertexShaderCode: string | undefined;
-    private _textureRatio: number | undefined;
+    private _currentOutputTextureOptions: OutputTextureOptions | undefined;
     private _forceUnoptimized: boolean = false;
 
     /**
@@ -224,7 +225,7 @@ export class SmartFilterOptimizer {
         this._mainFunctionNameToCode = new Map();
         this._dependencyGraph = new DependencyGraph();
         this._vertexShaderCode = undefined;
-        this._textureRatio = undefined;
+        this._currentOutputTextureOptions = undefined;
         this._forceUnoptimized = false;
     }
 
@@ -266,7 +267,7 @@ export class SmartFilterOptimizer {
                     s.type === "function" &&
                     s.name === funcName &&
                     s.owners[0] &&
-                    s.owners[0].getClassName() === block.getClassName()
+                    s.owners[0].blockType === block.blockType
             );
 
             const newVarName = existingRemapped?.remappedName ?? decorateSymbol(this._makeSymbolUnique(funcName));
@@ -334,7 +335,7 @@ export class SmartFilterOptimizer {
                         s.type === varDecl &&
                         s.name === varName &&
                         s.owners[0] &&
-                        s.owners[0].getClassName() === block.getClassName()
+                        s.owners[0].blockType === block.blockType
                 );
                 if (existingRemapped && singleInstance) {
                     newVarName = existingRemapped.remappedName;
@@ -424,7 +425,7 @@ export class SmartFilterOptimizer {
                 return false;
             }
 
-            if (block.textureRatio !== this._textureRatio) {
+            if (!textureOptionsMatch(block.outputTextureOptions, this._currentOutputTextureOptions)) {
                 return false;
             }
         }
@@ -442,8 +443,8 @@ export class SmartFilterOptimizer {
         const block = outputConnectionPoint.ownerBlock;
 
         if (block instanceof ShaderBlock) {
-            if (this._textureRatio === undefined) {
-                this._textureRatio = block.textureRatio;
+            if (this._currentOutputTextureOptions === undefined) {
+                this._currentOutputTextureOptions = block.outputTextureOptions;
             }
 
             const shaderProgram = block.getShaderProgram();
@@ -590,7 +591,7 @@ export class SmartFilterOptimizer {
             return newShaderFuncName;
         }
 
-        throw `Unhandled block type! className=${block.getClassName()}`;
+        throw `Unhandled block type! blockType=${block.blockType}`;
     }
 
     private _saveBlockStackState(): void {
@@ -712,8 +713,8 @@ export class SmartFilterOptimizer {
             },
         });
 
-        if (this._textureRatio !== undefined) {
-            optimizedBlock.textureRatio = this._textureRatio;
+        if (this._currentOutputTextureOptions !== undefined) {
+            optimizedBlock.outputTextureOptions = this._currentOutputTextureOptions;
         }
 
         optimizedBlock.setShaderBindings(Array.from(blockOwnerToShaderBinding.values()));

package/src/runtime/renderTargetGenerator.ts

@@ -1,6 +1,7 @@
 import type { ThinTexture } from "@babylonjs/core/Materials/Textures/thinTexture";
 import type { Nullable } from "@babylonjs/core/types";
 import { ThinRenderTargetTexture } from "@babylonjs/core/Materials/Textures/thinRenderTargetTexture.js";
+import type { RenderTargetCreationOptions } from "@babylonjs/core/Materials/Textures/textureCreationOptions";
 
 import type { BaseBlock } from "../blocks/baseBlock";
 import type { InitializationData, SmartFilter } from "../smartFilter";
@@ -8,6 +9,7 @@ import type { InternalSmartFilterRuntime } from "./smartFilterRuntime";
 import { ShaderBlock } from "../blocks/shaderBlock.js";
 import { createStrongRef } from "./strongRef.js";
 import { ConnectionPointType } from "../connection/connectionPointType.js";
+import type { OutputTextureOptions } from "../blocks/textureOptions";
 
 /**
  * @internal
@@ -29,7 +31,9 @@ interface RefCountedTexture {
  */
 export class RenderTargetGenerator {
     private _optimize: boolean;
-    private _renderTargetPool: Map<number, Set<RefCountedTexture>>;
+    private _renderTargetPool: Map<string, Set<RefCountedTexture>>;
+    private _textureOptionsHashCache = new Map<ShaderBlock, string>();
+
     private _numTargetsCreated;
 
     /**
@@ -63,11 +67,17 @@ export class RenderTargetGenerator {
                 }
 
                 let refCountedTexture: Nullable<RefCountedTexture> = null;
+                const textureOptionsHash = this._getTextureOptionsHash(block);
 
                 // We assign a texture to the output of the block only if this is not the last block in the chain,
                 // i.e. not the block connected to the smart output block (in which case the output of the block is to the canvas and not a texture).
                 if (!block.output.endpoints.some((cp) => cp.ownerBlock === smartFilter.output.ownerBlock)) {
-                    refCountedTexture = this._getTexture(initializationData.runtime, block.textureRatio, smartFilter);
+                    refCountedTexture = this._getTexture(
+                        initializationData.runtime,
+                        block.outputTextureOptions,
+                        textureOptionsHash,
+                        smartFilter
+                    );
 
                     if (!block.output.runtimeData) {
                         const runtimeOutput = createStrongRef(refCountedTexture.texture);
@@ -98,17 +108,21 @@ export class RenderTargetGenerator {
                             connectedBlock.output.runtimeData &&
                             connectedBlock.output.runtimeData.value
                         ) {
-                            this._releaseTexture(connectedBlock.output.runtimeData.value, connectedBlock.textureRatio);
+                            this._releaseTexture(
+                                connectedBlock.output.runtimeData.value,
+                                this._getTextureOptionsHash(connectedBlock)
+                            );
                         }
                     }
                 }
             }
         );
         this._renderTargetPool.clear();
+        this._textureOptionsHashCache.clear();
     }
 
-    private _findAvailableTexture(ratio: number): Nullable<RefCountedTexture> {
-        const refCountedTextures = this._renderTargetPool.get(ratio);
+    private _findAvailableTexture(textureOptionsHash: string): Nullable<RefCountedTexture> {
+        const refCountedTextures = this._renderTargetPool.get(textureOptionsHash);
         if (!refCountedTextures) {
             return null;
         }
@@ -124,27 +138,28 @@ export class RenderTargetGenerator {
 
     private _getTexture(
         runtime: InternalSmartFilterRuntime,
-        ratio: number,
+        textureOptions: OutputTextureOptions,
+        textureOptionsHash: string,
         smartFilter: SmartFilter
     ): RefCountedTexture {
         if (!this._optimize) {
             this._numTargetsCreated++;
             return {
-                texture: this._createTexture(runtime, smartFilter, ratio),
+                texture: this._createTexture(runtime, smartFilter, textureOptions),
                 refCount: 0,
             };
         }
 
-        let refCountedTextures = this._renderTargetPool.get(ratio);
+        let refCountedTextures = this._renderTargetPool.get(textureOptionsHash);
         if (!refCountedTextures) {
             refCountedTextures = new Set();
-            this._renderTargetPool.set(ratio, refCountedTextures);
+            this._renderTargetPool.set(textureOptionsHash, refCountedTextures);
         }
 
-        let refCountedTexture = this._findAvailableTexture(ratio);
+        let refCountedTexture = this._findAvailableTexture(textureOptionsHash);
         if (!refCountedTexture) {
             refCountedTexture = {
-                texture: this._createTexture(runtime, smartFilter, ratio),
+                texture: this._createTexture(runtime, smartFilter, textureOptions),
                 refCount: 0,
             };
             refCountedTextures.add(refCountedTexture);
@@ -154,14 +169,16 @@ export class RenderTargetGenerator {
         return refCountedTexture;
     }
 
-    private _releaseTexture(texture: ThinTexture, ratio: number) {
+    private _releaseTexture(texture: ThinTexture, textureOptionsHash: string) {
         if (!this._optimize) {
             return;
         }
 
-        const refCountedTextures = this._renderTargetPool.get(ratio);
+        const refCountedTextures = this._renderTargetPool.get(textureOptionsHash);
         if (!refCountedTextures) {
-            throw new Error(`_releaseTextureToPool: Trying to add a texture to a non existing pool ${ratio}!`);
+            throw new Error(
+                `_releaseTexture: Trying to release a texture from a non existing pool ${textureOptionsHash}!`
+            );
         }
 
         for (const refCountedTexture of refCountedTextures) {
@@ -171,29 +188,31 @@ export class RenderTargetGenerator {
             }
         }
 
-        throw new Error(`_releaseTextureToPool: Can't find the texture in the pool ${ratio}!`);
+        throw new Error(`_releaseTexture: Can't find the texture in the pool ${textureOptionsHash}!`);
     }
 
     /**
      * Creates an offscreen texture to hold on the result of the block rendering.
      * @param runtime - The current runtime we create the texture for
      * @param smartFilter - The smart filter the texture is created for
-     * @param ratio - The ratio of the texture to create compared to the final output
+     * @param textureOptions - The options to use to create the texture
      * @returns The render target texture
      */
     private _createTexture(
         runtime: InternalSmartFilterRuntime,
         smartFilter: SmartFilter,
-        ratio: number
+        textureOptions: OutputTextureOptions
     ): ThinRenderTargetTexture {
         const engine = runtime.engine;
 
         // We are only rendering full screen post process without depth or stencil information
-        const setup = {
+        const setup: RenderTargetCreationOptions = {
             generateDepthBuffer: false,
             generateStencilBuffer: false,
             generateMipMaps: false,
             samplingMode: 2, // Babylon Constants.TEXTURE_LINEAR_LINEAR,
+            format: textureOptions.format,
+            type: textureOptions.type,
         };
 
         // Get the smartFilter output size - either from the output block's renderTargetTexture or the engine's render size
@@ -207,8 +226,8 @@ export class RenderTargetGenerator {
             outputHeight = engine.getRenderHeight(true);
         }
         const size = {
-            width: Math.floor(outputWidth * ratio),
-            height: Math.floor(outputHeight * ratio),
+            width: Math.floor(outputWidth * textureOptions.ratio),
+            height: Math.floor(outputHeight * textureOptions.ratio),
         };
 
         // Creates frame buffers for effects
@@ -219,6 +238,22 @@ export class RenderTargetGenerator {
         finalRenderTarget.wrapU = 0;
         finalRenderTarget.wrapV = 0;
 
+        finalRenderTarget.anisotropicFilteringLevel = 1;
+
         return finalRenderTarget;
     }
+
+    /**
+     * Gets a textureOptionsHash for a block, using a cache to avoid recomputing it.
+     * @param block - The block to get the texture options hash for
+     * @returns The texture options hash for the block
+     */
+    private _getTextureOptionsHash(block: ShaderBlock): string {
+        let textureOptionsHash = this._textureOptionsHashCache.get(block);
+        if (textureOptionsHash === undefined) {
+            textureOptionsHash = JSON.stringify(block.outputTextureOptions);
+            this._textureOptionsHashCache.set(block, textureOptionsHash);
+        }
+        return textureOptionsHash;
+    }
 }

package/src/serialization/importCustomShaderBlockDefinition.ts

@@ -0,0 +1,85 @@
+import { ConnectionPointType } from "../connection/connectionPointType.js";
+import { hasGlslHeader, parseFragmentShader } from "../utils/buildTools/shaderConverter.js";
+import type { SerializedBlockDefinition } from "./serializedBlockDefinition.js";
+import type { SerializedInputConnectionPointV1 } from "./v1/blockSerialization.types.js";
+
+/**
+ * Imports a serialized custom shader block definition. Supports importing a JSON string
+ * of an SerializedBlockDefinition object, or a glsl shader with the required annotations
+ * so it can be converted to a SerializedBlockDefinition object.
+ * See readme.md for more information.
+ * @param serializedBlockDefinition - The serialized block definition - either a SerializedBlockDefinition object in a JSON string, or an annotated glsl shader
+ * @returns The serialized block definition
+ */
+export function importCustomShaderBlockDefinition(serializedBlockDefinition: string): SerializedBlockDefinition {
+    if (hasGlslHeader(serializedBlockDefinition)) {
+        return importAnnotatedGlsl(serializedBlockDefinition);
+    } else {
+        // Assume this is a serialized SerializedBlockDefinition object
+        return JSON.parse(serializedBlockDefinition);
+    }
+}
+
+/**
+ * Converts a fragment shader .glsl file to an SerializedBlockDefinition instance for use
+ * as a CustomShaderBlock. The .glsl file must contain certain annotations to be imported.
+ * See readme.md for more information.
+ * @param fragmentShader - The contents of the .glsl fragment shader file
+ * @returns The serialized block definition
+ */
+function importAnnotatedGlsl(fragmentShader: string): SerializedBlockDefinition {
+    const fragmentShaderInfo = parseFragmentShader(fragmentShader);
+
+    if (!fragmentShaderInfo.blockType) {
+        throw new Error("blockType must be defined");
+    }
+
+    // Calculate the input connection points
+    const inputConnectionPoints: SerializedInputConnectionPointV1[] = [];
+    for (const uniform of fragmentShaderInfo.uniforms) {
+        // Convert to ConnectionPointType
+        let type: ConnectionPointType;
+        switch (uniform.type) {
+            case "float":
+                type = ConnectionPointType.Float;
+                break;
+            case "sampler2D":
+                type = ConnectionPointType.Texture;
+                break;
+            case "vec3":
+                type = ConnectionPointType.Color3;
+                break;
+            case "vec4":
+                type = ConnectionPointType.Color4;
+                break;
+            case "bool":
+                type = ConnectionPointType.Boolean;
+                break;
+            case "vec2":
+                type = ConnectionPointType.Vector2;
+                break;
+            default:
+                throw new Error(`Unsupported uniform type: '${uniform.type}'`);
+        }
+
+        // Add to input connection point list
+        const inputConnectionPoint: SerializedInputConnectionPointV1 = {
+            name: uniform.name,
+            type,
+        };
+        if (inputConnectionPoint.type !== ConnectionPointType.Texture && uniform.properties?.default !== undefined) {
+            inputConnectionPoint.defaultValue = uniform.properties.default;
+        }
+        inputConnectionPoints.push(inputConnectionPoint);
+    }
+
+    return {
+        formatVersion: 1,
+        blockType: fragmentShaderInfo.blockType,
+        shaderProgram: {
+            fragment: fragmentShaderInfo.shaderCode,
+        },
+        inputConnectionPoints,
+        disableOptimization: !!fragmentShaderInfo.disableOptimization,
+    };
+}

package/src/serialization/index.ts

@@ -2,3 +2,4 @@ export * from "./v1/index.js";
 export * from "./serializedSmartFilter.js";
 export * from "./smartFilterDeserializer.js";
 export * from "./smartFilterSerializer.js";
+export * from "./serializedBlockDefinition.js";

package/src/serialization/serializedBlockDefinition.ts

@@ -0,0 +1,7 @@
+import type { SerializedBlockDefinitionV1 } from "./v1/blockSerialization.types";
+
+/**
+ * Type union of all versions of serialized SmartFilter block definitions
+ * A block definition is an object which is used to create a CustomShaderBlock instance.
+ */
+export type SerializedBlockDefinition = SerializedBlockDefinitionV1;

package/src/serialization/serializedSmartFilter.ts

@@ -1,4 +1,4 @@
-import type { SerializedSmartFilterV1 } from "./v1/serialization.types";
+import type { SerializedSmartFilterV1 } from "./v1/smartFilterSerialization.types";
 
 /**
  * Type union of all versions of serialized SmartFilters

package/src/serialization/smartFilterDeserializer.ts

@@ -6,13 +6,22 @@ import { OutputBlock } from "../blocks/outputBlock.js";
 import type { ThinEngine } from "@babylonjs/core/Engines/thinEngine";
 import { InputBlock } from "../blocks/inputBlock.js";
 import type {
-    DeserializeBlockV1,
     ISerializedBlockV1,
     ISerializedConnectionV1,
     OptionalBlockDeserializerV1,
     SerializedSmartFilterV1,
-} from "./v1/serialization.types";
+} from "./v1/smartFilterSerialization.types";
 import { UniqueIdGenerator } from "../utils/uniqueIdGenerator.js";
+import type { Nullable } from "@babylonjs/core/types";
+
+/**
+ * A function that creates a block instance of the given class block type, or return null if it cannot.
+ */
+export type BlockFactory = (
+    smartFilter: SmartFilter,
+    engine: ThinEngine,
+    serializedBlock: ISerializedBlockV1
+) => Promise<Nullable<BaseBlock>>;
 
 /**
  * Deserializes serialized SmartFilters. The caller passes in a map of block deserializers it wants to use,
@@ -20,39 +29,17 @@ import { UniqueIdGenerator } from "../utils/uniqueIdGenerator.js";
  * The deserializer supports versioned serialized SmartFilters.
  */
 export class SmartFilterDeserializer {
-    private readonly _blockDeserializersV1: Map<string, DeserializeBlockV1> = new Map();
+    private readonly _blockFactory: BlockFactory;
+    private readonly _customInputBlockDeserializer?: OptionalBlockDeserializerV1;
 
     /**
      * Creates a new SmartFilterDeserializer
-     * @param blockDeserializers - The map of block serializers to use, beyond those for the core blocks
+     * @param blockFactory - A function that creates a block of the given class name, or returns null if it cannot
      * @param customInputBlockDeserializer - An optional custom deserializer for InputBlocks - if supplied and it returns null, the default deserializer will be used
      */
-    public constructor(
-        blockDeserializers: Map<string, DeserializeBlockV1>,
-        customInputBlockDeserializer?: OptionalBlockDeserializerV1
-    ) {
-        this._blockDeserializersV1 = blockDeserializers;
-
-        this._blockDeserializersV1.set(
-            InputBlock.ClassName,
-            async (smartFilter: SmartFilter, serializedBlock: ISerializedBlockV1, engine: ThinEngine) => {
-                if (customInputBlockDeserializer) {
-                    const customDeserializerResult = await customInputBlockDeserializer(
-                        smartFilter,
-                        serializedBlock,
-                        engine
-                    );
-                    if (customDeserializerResult !== null) {
-                        return customDeserializerResult;
-                    }
-                }
-                return inputBlockDeserializer(smartFilter, serializedBlock);
-            }
-        );
-
-        this._blockDeserializersV1.set(OutputBlock.ClassName, (smartFilter: SmartFilter) =>
-            Promise.resolve(smartFilter.output.ownerBlock)
-        );
+    public constructor(blockFactory: BlockFactory, customInputBlockDeserializer?: OptionalBlockDeserializerV1) {
+        this._blockFactory = blockFactory;
+        this._customInputBlockDeserializer = customInputBlockDeserializer;
     }
 
     /**
@@ -63,7 +50,14 @@ export class SmartFilterDeserializer {
      */
     public async deserialize(engine: ThinEngine, smartFilterJson: any): Promise<SmartFilter> {
         const serializedSmartFilter: SerializedSmartFilter = smartFilterJson;
-        switch (serializedSmartFilter.version) {
+
+        // Back-compat for the rename of version to formatVersion, didn't warrant a new version
+        if ((serializedSmartFilter as any).version && serializedSmartFilter.formatVersion === undefined) {
+            serializedSmartFilter.formatVersion = (serializedSmartFilter as any).version;
+            delete (serializedSmartFilter as any).version;
+        }
+
+        switch (serializedSmartFilter.formatVersion) {
             case 1:
                 return await this._deserializeV1(engine, serializedSmartFilter);
         }
@@ -85,31 +79,28 @@ export class SmartFilterDeserializer {
 
         // Deserialize the blocks
         const blockDeserializationWork: Promise<void>[] = [];
+        const blockDefinitionsWhichCouldNotBeDeserialized: string[] = [];
         serializedSmartFilter.blocks.forEach((serializedBlock: ISerializedBlockV1) => {
-            const blockDeserializer = this._blockDeserializersV1.get(serializedBlock.className);
-            if (!blockDeserializer) {
-                throw new Error(`No deserializer found for block type ${serializedBlock.className}`);
-            }
             blockDeserializationWork.push(
-                blockDeserializer(smartFilter, serializedBlock, engine).then((newBlock) => {
-                    // Deserializers are not responsible for setting the uniqueId or comments.
-                    // This is so they don't have to be passed into the constructors when programmatically creating
-                    // blocks, and so each deserializer doesn't have to remember to do it.
-                    newBlock.uniqueId = serializedBlock.uniqueId;
-                    newBlock.comments = serializedBlock.comments;
-
-                    // We need to ensure any uniqueIds generated in the future (e.g. a new block is added to the SmartFilter)
-                    // are higher than this one.
-                    UniqueIdGenerator.EnsureIdsGreaterThan(newBlock.uniqueId);
-
-                    // Save in the map
-                    blockIdMap.set(newBlock.uniqueId, newBlock);
-                    blockNameMap.set(newBlock.name, newBlock);
-                })
+                this._deserializeBlockV1(
+                    smartFilter,
+                    serializedBlock,
+                    engine,
+                    blockDefinitionsWhichCouldNotBeDeserialized,
+                    blockIdMap,
+                    blockNameMap
+                )
             );
         });
         await Promise.all(blockDeserializationWork);
 
+        // If any block definitions could not be deserialized, throw an error
+        if (blockDefinitionsWhichCouldNotBeDeserialized.length > 0) {
+            throw new Error(
+                `Could not deserialize the following block definitions: ${blockDefinitionsWhichCouldNotBeDeserialized.join(", ")}`
+            );
+        }
+
         // Deserialize the connections
         serializedSmartFilter.connections.forEach((connection: ISerializedConnectionV1) => {
             // Find the source block and its connection point's connectTo function
@@ -121,7 +112,9 @@ export class SmartFilterDeserializer {
             if (!sourceBlock) {
                 throw new Error(`Source block ${connection.outputBlock} not found`);
             }
-            const sourceConnectionPoint = (sourceBlock as any)[connection.outputConnectionPoint];
+            const sourceConnectionPoint = sourceBlock.outputs.find(
+                (output) => output.name === connection.outputConnectionPoint
+            );
             if (!sourceConnectionPoint || typeof sourceConnectionPoint.connectTo !== "function") {
                 throw new Error(
                     `Block ${connection.outputBlock} does not have an connection point named ${connection.outputConnectionPoint}`
@@ -137,7 +130,10 @@ export class SmartFilterDeserializer {
             if (!targetBlock) {
                 throw new Error(`Target block ${connection.inputBlock} not found`);
             }
-            const targetConnectionPoint = (targetBlock as any)[connection.inputConnectionPoint];
+
+            const targetConnectionPoint = targetBlock.inputs.find(
+                (input) => input.name === connection.inputConnectionPoint
+            );
             if (!targetConnectionPoint || typeof targetConnectionPoint !== "object") {
                 throw new Error(
                     `Block ${connection.inputBlock} does not have a connection point named ${connection.inputConnectionPoint}`
@@ -150,4 +146,62 @@ export class SmartFilterDeserializer {
 
         return smartFilter;
     }
+
+    private async _deserializeBlockV1(
+        smartFilter: SmartFilter,
+        serializedBlock: ISerializedBlockV1,
+        engine: ThinEngine,
+        blockTypesWhichCouldNotBeDeserialized: string[],
+        blockIdMap: Map<number, BaseBlock>,
+        blockNameMap: Map<string, BaseBlock>
+    ): Promise<void> {
+        let newBlock: Nullable<BaseBlock> = null;
+
+        // Back compat for early Smart Filter V1 serialization where the blockType was stored in className
+        // Not worth creating a new version for this, as it's only used in the deserializer
+        if ((serializedBlock as any).className && !serializedBlock.blockType) {
+            serializedBlock.blockType = (serializedBlock as any).className;
+        }
+
+        // Get the instance of the block
+        switch (serializedBlock.blockType) {
+            case InputBlock.ClassName:
+                {
+                    if (this._customInputBlockDeserializer) {
+                        newBlock = await this._customInputBlockDeserializer(smartFilter, serializedBlock, engine);
+                    }
+                    if (newBlock === null) {
+                        newBlock = inputBlockDeserializer(smartFilter, serializedBlock);
+                    }
+                }
+                break;
+            case OutputBlock.ClassName:
+                {
+                    newBlock = smartFilter.output.ownerBlock;
+                }
+                break;
+            default: {
+                // If it's not an input or output block, use the provided block factory
+                newBlock = await this._blockFactory(smartFilter, engine, serializedBlock);
+                if (!newBlock) {
+                    blockTypesWhichCouldNotBeDeserialized.push(serializedBlock.blockType);
+                    return;
+                }
+            }
+        }
+
+        // Deserializers are not responsible for setting the uniqueId or comments.
+        // This is so they don't have to be passed into the constructors when programmatically creating
+        // blocks, and so each deserializer doesn't have to remember to do it.
+        newBlock.uniqueId = serializedBlock.uniqueId;
+        newBlock.comments = serializedBlock.comments;
+
+        // We need to ensure any uniqueIds generated in the future (e.g. a new block is added to the SmartFilter)
+        // are higher than this one.
+        UniqueIdGenerator.EnsureIdsGreaterThan(newBlock.uniqueId);
+
+        // Save in the map
+        blockIdMap.set(newBlock.uniqueId, newBlock);
+        blockNameMap.set(newBlock.name, newBlock);
+    }
 }

package/src/serialization/smartFilterSerializer.ts

@@ -10,7 +10,8 @@ import type {
     ISerializedConnectionV1,
     SerializeBlockV1,
     SerializedSmartFilterV1,
-} from "./v1/serialization.types";
+} from "./v1/smartFilterSerialization.types";
+import { CustomShaderBlock } from "../blocks/customShaderBlock.js";
 
 /**
  * Determines if two serialized connection points are equivalent to each other
@@ -37,17 +38,17 @@ export class SmartFilterSerializer {
 
     /**
      * Creates a new SmartFilterSerializer
-     * @param blocksUsingDefaultSerialization - A list of the classNames of blocks which can use default serialization (they only have ConnectionPoint properties and no constructor parameters)
+     * @param blocksUsingDefaultSerialization - A list of the blockType of blocks which can use default serialization (they only have ConnectionPoint properties and no constructor parameters)
      * @param additionalBlockSerializers - An array of block serializers to use, beyond those for the core blocks
      */
     public constructor(blocksUsingDefaultSerialization: string[], additionalBlockSerializers: IBlockSerializerV1[]) {
-        this._blockSerializers.set(inputBlockSerializer.className, inputBlockSerializer.serialize);
+        this._blockSerializers.set(inputBlockSerializer.blockType, inputBlockSerializer.serialize);
         this._blockSerializers.set(OutputBlock.ClassName, defaultBlockSerializer);
         blocksUsingDefaultSerialization.forEach((block) => {
             this._blockSerializers.set(block, defaultBlockSerializer);
         });
         additionalBlockSerializers.forEach((serializer) =>
-            this._blockSerializers.set(serializer.className, serializer.serialize)
+            this._blockSerializers.set(serializer.blockType, serializer.serialize)
         );
     }
 
@@ -61,9 +62,12 @@ export class SmartFilterSerializer {
 
         const blocks = smartFilter.attachedBlocks.map((block: BaseBlock) => {
             // Serialize the block itself
-            const serializeFn = this._blockSerializers.get(block.getClassName());
+            const serializeFn =
+                block.getClassName() === CustomShaderBlock.ClassName
+                    ? defaultBlockSerializer
+                    : this._blockSerializers.get(block.blockType);
             if (!serializeFn) {
-                throw new Error(`No serializer was provided for a block of type ${block.getClassName()}`);
+                throw new Error(`No serializer was provided for a block of type ${block.blockType}`);
             }
             const serializedBlock: ISerializedBlockV1 = serializeFn(block);
 
@@ -102,7 +106,7 @@ export class SmartFilterSerializer {
         });
 
         return {
-            version: 1,
+            formatVersion: 1,
             name: smartFilter.name,
             comments: smartFilter.comments,
             editorData: smartFilter.editorData,