@galacean/effects-threejs 2.4.0-beta.0 → 2.4.0-beta.2

package/dist/index.mjs

@@ -3,7 +3,7 @@
  * Description: Galacean Effects runtime threejs plugin for the web
  * Author: Ant Group CO., Ltd.
  * Contributors: 燃然,飂兮,十弦,云垣,茂安,意绮
- * Version: v2.4.0-beta.0
+ * Version: v2.4.0-beta.2
  */
 
 import * as THREE from 'three';
@@ -2002,7 +2002,7 @@ function getDirectStore(target) {
     function EffectsObject(engine) {
         this.engine = engine;
         this.guid = generateGUID();
-        this.taggedProperties = {};
+        this.defination = {};
         this.engine.addInstance(this);
     }
     var _proto = EffectsObject.prototype;
@@ -2027,11 +2027,7 @@ function getDirectStore(target) {
    * 反序列化函数
    *
    * @param data - 对象的序列化的数据
-   */ _proto.fromData = function fromData(data) {
-        if (data.id) {
-            this.setInstanceId(data.id);
-        }
-    };
+   */ _proto.fromData = function fromData(data) {};
     /**
    *
    */ _proto.dispose = function dispose() {};
@@ -2127,9 +2123,6 @@ function getDirectStore(target) {
     };
     _proto.fromData = function fromData(data) {
         EffectsObject.prototype.fromData.call(this, data);
-        if (data.item) {
-            this.item = data.item;
-        }
     };
     _proto.dispose = function dispose() {
         if (this.isEnableCalled) {
@@ -2194,11 +2187,15 @@ function getDirectStore(target) {
     ]);
     return Component;
 }(EffectsObject);
+__decorate([
+    serialize()
+], Component.prototype, "item", void 0);
 __decorate([
     serialize()
 ], Component.prototype, "_enabled", void 0);
 /**
  * @since 2.0.0
+ * @deprecated 2.4.0 Please use Component instead
  */ var Behaviour = /*#__PURE__*/ function(Component) {
     _inherits(Behaviour, Component);
     function Behaviour() {
@@ -2228,10 +2225,6 @@ __decorate([
     }
     var _proto = RendererComponent.prototype;
     _proto.render = function render(renderer) {};
-    _proto.setVFXItem = function setVFXItem(item) {
-        Component.prototype.setVFXItem.call(this, item);
-        this.item.rendererComponents.push(this);
-    };
     _proto.onEnable = function onEnable() {
         var _this_item_composition;
         (_this_item_composition = this.item.composition) == null ? void 0 : _this_item_composition.renderFrame.addMeshToDefaultRenderPass(this);
@@ -2240,18 +2233,6 @@ __decorate([
         var _this_item_composition;
         (_this_item_composition = this.item.composition) == null ? void 0 : _this_item_composition.renderFrame.removeMeshFromDefaultRenderPass(this);
     };
-    _proto.fromData = function fromData(data) {
-        Component.prototype.fromData.call(this, data);
-    };
-    _proto.toData = function toData() {
-        Component.prototype.toData.call(this);
-    };
-    _proto.dispose = function dispose() {
-        if (this.item) {
-            removeItem(this.item.rendererComponents, this);
-        }
-        Component.prototype.dispose.call(this);
-    };
     _create_class(RendererComponent, [
         {
             key: "priority",
@@ -3874,11 +3855,11 @@ EffectComponent = __decorate([
     effectsClass(DataType.EffectComponent)
 ], EffectComponent);
 
-var PostProcessVolume = /*#__PURE__*/ function(Behaviour) {
-    _inherits(PostProcessVolume, Behaviour);
+var PostProcessVolume = /*#__PURE__*/ function(Component) {
+    _inherits(PostProcessVolume, Component);
     function PostProcessVolume(engine) {
         var _this;
-        _this = Behaviour.call(this, engine) || this;
+        _this = Component.call(this, engine) || this;
         _this.bloom = {
             threshold: 0,
             intensity: 0,
@@ -3909,7 +3890,7 @@ var PostProcessVolume = /*#__PURE__*/ function(Behaviour) {
         }
     };
     return PostProcessVolume;
-}(Behaviour);
+}(Component);
 __decorate([
     serialize()
 ], PostProcessVolume.prototype, "bloom", void 0);
@@ -6142,12 +6123,7 @@ function setMaskMode(material, maskMode, colorMask) {
                 glContext.REPLACE
             ];
             // 关闭/开启蒙版元素的颜色写入
-            material.colorMask = [
-                colorMask,
-                colorMask,
-                colorMask,
-                colorMask
-            ];
+            material.colorMask = colorMask;
             break;
         case MaskMode.OBSCURED:
             material.stencilTest = true;
@@ -7619,13 +7595,6 @@ var MaterialRenderType;
             set: /**
    * 设置 Material 的通过 alpha 值决定临时覆盖值计算的开关
    * @param value - 是否开启 alpha 抖动
-   */ function set(value) {}
-        },
-        {
-            key: "colorMask",
-            set: /**
-   * 设置 Material 颜色缓冲区的写入开关
-   * @param value
    */ function set(value) {}
         },
         {
@@ -7684,10 +7653,15 @@ var MaskProcessor = /*#__PURE__*/ function() {
             } else if (mode === ObscuredMode.OBSCURED || mode === ObscuredMode.REVERSE_OBSCURED) {
                 maskMode = mode === ObscuredMode.OBSCURED ? MaskMode.OBSCURED : MaskMode.REVERSE_OBSCURED;
                 this.maskRef = ref.maskManager.getRefValue();
+                this.maskable = ref;
             }
         }
         return maskMode;
     };
+    _proto.drawStencilMask = function drawStencilMask(renderer) {
+        var _this_maskable;
+        (_this_maskable = this.maskable) == null ? void 0 : _this_maskable.drawStencilMask(renderer);
+    };
     return MaskProcessor;
 }();
 
@@ -12594,17 +12568,16 @@ function getBezier2DValue(out, t, p0, p1, cpx0, cpy0, cpx1, cpy1) {
         if (!this.getVisible()) {
             return;
         }
-        if (renderer.renderingData.currentFrame.globalUniforms) {
-            renderer.setGlobalMatrix("effects_ObjectToWorld", this.transform.getWorldMatrix());
-        }
-        for(var i = 0; i < this.materials.length; i++){
-            var material = this.materials[i];
-            material.setVector2("_Size", this.transform.size);
-            if (this.renderer.renderMode === RenderMode.BILLBOARD || this.renderer.renderMode === RenderMode.VERTICAL_BILLBOARD || this.renderer.renderMode === RenderMode.HORIZONTAL_BILLBOARD) {
-                material.setVector3("_Scale", this.transform.scale);
-            }
-            renderer.drawGeometry(this.geometry, material, i);
-        }
+        this.maskManager.drawStencilMask(renderer);
+        this.draw(renderer);
+    };
+    /**
+   * @internal
+   */ _proto.drawStencilMask = function drawStencilMask(renderer) {
+        var previousColorMask = this.material.colorMask;
+        this.material.colorMask = false;
+        this.draw(renderer);
+        this.material.colorMask = previousColorMask;
     };
     _proto.onStart = function onStart() {
         this.item.getHitTestParams = this.getHitTestParams;
@@ -12742,10 +12715,27 @@ function getBezier2DValue(out, t, p0, p1, cpx0, cpy0, cpx1, cpy1) {
         }
         return material;
     };
+    _proto.draw = function draw(renderer) {
+        if (renderer.renderingData.currentFrame.globalUniforms) {
+            renderer.setGlobalMatrix("effects_ObjectToWorld", this.transform.getWorldMatrix());
+        }
+        for(var i = 0; i < this.materials.length; i++){
+            var material = this.materials[i];
+            material.setVector2("_Size", this.transform.size);
+            if (this.renderer.renderMode === RenderMode.BILLBOARD || this.renderer.renderMode === RenderMode.VERTICAL_BILLBOARD || this.renderer.renderMode === RenderMode.HORIZONTAL_BILLBOARD) {
+                material.setVector3("_Scale", this.transform.scale);
+            }
+            renderer.drawGeometry(this.geometry, material, i);
+        }
+    };
     _proto.fromData = function fromData(data) {
         RendererComponent.prototype.fromData.call(this, data);
         var _data_renderer;
         var renderer = (_data_renderer = data.renderer) != null ? _data_renderer : {};
+        var maskProps = data.mask;
+        if (maskProps && maskProps.ref) {
+            maskProps.ref = this.engine.findObject(maskProps.ref);
+        }
         var maskMode = this.maskManager.getMaskMode(data);
         // TODO 新蒙板上线后移除
         //-------------------------------------------------------------------------
@@ -12753,15 +12743,15 @@ function getBezier2DValue(out, t, p0, p1, cpx0, cpy0, cpx1, cpy1) {
         //@ts-expect-error
         var split = data.splits && !data.textureSheetAnimation ? data.splits[0] : undefined;
         var shapeGeometry = undefined;
-        if (shapeData !== undefined && !("aPoint" in shapeData && "index" in shapeData)) {
+        if (shapeData !== undefined && shapeData !== null && !("aPoint" in shapeData && "index" in shapeData)) {
             shapeGeometry = getGeometryByShape(shapeData, split);
         }
-        var _renderer_renderMode, _renderer_blending, _renderer_texture, _renderer_side;
+        var _renderer_renderMode, _renderer_blending, _renderer_side;
         //-------------------------------------------------------------------------
         this.renderer = {
             renderMode: (_renderer_renderMode = renderer.renderMode) != null ? _renderer_renderMode : RenderMode.MESH,
             blending: (_renderer_blending = renderer.blending) != null ? _renderer_blending : BlendingMode.ALPHA,
-            texture: (_renderer_texture = renderer.texture) != null ? _renderer_texture : this.engine.emptyTexture,
+            texture: renderer.texture ? this.engine.findObject(renderer.texture) : this.engine.emptyTexture,
             occlusion: !!renderer.occlusion,
             transparentOcclusion: !!renderer.transparentOcclusion || maskMode === MaskMode.MASK,
             side: (_renderer_side = renderer.side) != null ? _renderer_side : SideMode.DOUBLE,
@@ -12978,14 +12968,14 @@ var ShapeComponent = /*#__PURE__*/ function(BaseRenderComponent) {
                             var control2 = easingIns[pointIndex.easingIn];
                             this.graphicsPath.bezierCurveTo(control1.x + lastPoint.x, control1.y + lastPoint.y, control2.x + point.x, control2.y + point.y, point.x, point.y, 1);
                         }
-                        var pointIndex1 = indices[0];
-                        var lastPointIndex1 = indices[indices.length - 1];
-                        var point1 = points[pointIndex1.point];
-                        var lastPoint1 = points[lastPointIndex1.point];
-                        var control11 = easingOuts[lastPointIndex1.easingOut];
-                        var control21 = easingIns[pointIndex1.easingIn];
-                        this.graphicsPath.bezierCurveTo(control11.x + lastPoint1.x, control11.y + lastPoint1.y, control21.x + point1.x, control21.y + point1.y, point1.x, point1.y, 1);
                         if (shape.close) {
+                            var pointIndex1 = indices[0];
+                            var lastPointIndex1 = indices[indices.length - 1];
+                            var point1 = points[pointIndex1.point];
+                            var lastPoint1 = points[lastPointIndex1.point];
+                            var control11 = easingOuts[lastPointIndex1.easingOut];
+                            var control21 = easingIns[pointIndex1.easingIn];
+                            this.graphicsPath.bezierCurveTo(control11.x + lastPoint1.x, control11.y + lastPoint1.y, control21.x + point1.x, control21.y + point1.y, point1.x, point1.y, 1);
                             this.graphicsPath.closePath();
                         }
                     }
@@ -13115,6 +13105,10 @@ var ShapeComponent = /*#__PURE__*/ function(BaseRenderComponent) {
                     break;
                 }
         }
+        var maskProps = data.mask;
+        if (maskProps && maskProps.ref) {
+            maskProps.ref = this.engine.findObject(maskProps.ref);
+        }
         var maskMode = this.maskManager.getMaskMode(data);
         var maskRef = this.maskManager.getRefValue();
         this.material.stencilRef = maskRef !== undefined ? [
@@ -13264,11 +13258,11 @@ var Fake3DAnimationMode;
     Fake3DAnimationMode[Fake3DAnimationMode["Linear"] = 1] = "Linear";
 })(Fake3DAnimationMode || (Fake3DAnimationMode = {}));
 
-var CameraController = /*#__PURE__*/ function(Behaviour) {
-    _inherits(CameraController, Behaviour);
+var CameraController = /*#__PURE__*/ function(Component) {
+    _inherits(CameraController, Component);
     function CameraController(engine, props) {
         var _this;
-        _this = Behaviour.call(this, engine) || this;
+        _this = Component.call(this, engine) || this;
         if (props) {
             _this.fromData(props);
         }
@@ -13289,11 +13283,11 @@ var CameraController = /*#__PURE__*/ function(Behaviour) {
         }
     };
     _proto.fromData = function fromData(data) {
-        Behaviour.prototype.fromData.call(this, data);
+        Component.prototype.fromData.call(this, data);
         this.options = data.options;
     };
     return CameraController;
-}(Behaviour);
+}(Component);
 CameraController = __decorate([
     effectsClass(DataType.CameraController)
 ], CameraController);
@@ -15374,6 +15368,7 @@ var InteractComponent = /*#__PURE__*/ function(RendererComponent) {
         };
         _this.duringPlay = false;
         /** 是否响应点击和拖拽交互事件 */ _this._interactive = true;
+        _this.lastTime = -1;
         _this.getHitTestParams = function(force) {
             if (!_this.clickable) {
                 return;
@@ -15464,11 +15459,21 @@ var InteractComponent = /*#__PURE__*/ function(RendererComponent) {
         var _this_previewContent;
         this.duringPlay = true;
         // trigger messageBegin when item enter
-        if (this.item.time > 0 && this.item.time - dt / 1000 <= 0) {
-            var _this_item_composition;
-            var options = this.item.props.content.options;
-            (_this_item_composition = this.item.composition) == null ? void 0 : _this_item_composition.addInteractiveItem(this.item, options.type);
+        if (this.lastTime <= this.item.time) {
+            if (this.item.time >= 0 && this.lastTime < 0) {
+                var _this_item_composition;
+                var options = this.item.props.content.options;
+                (_this_item_composition = this.item.composition) == null ? void 0 : _this_item_composition.addInteractiveItem(this.item, options.type);
+            }
+        } else {
+            // loop trigger
+            if (this.item.time >= 0) {
+                var _this_item_composition1;
+                var options1 = this.item.props.content.options;
+                (_this_item_composition1 = this.item.composition) == null ? void 0 : _this_item_composition1.addInteractiveItem(this.item, options1.type);
+            }
         }
+        this.lastTime = this.item.time;
         (_this_previewContent = this.previewContent) == null ? void 0 : _this_previewContent.updateMesh();
         if (!this.dragEvent || !this.bouncingArg) {
             return;
@@ -18600,6 +18605,7 @@ function modifyMaxKeyframeShader(shader, maxVertex, maxFrag) {
         this.particleMesh.mesh.material.setVector4("uParams", uParams.set(time, this.item.duration, 0, 0));
     };
     _proto.render = function render(renderer) {
+        this.maskManager.drawStencilMask(renderer);
         for(var _iterator = _create_for_of_iterator_helper_loose(this.meshes), _step; !(_step = _iterator()).done;){
             var mesh = _step.value;
             mesh.render(renderer);
@@ -19441,7 +19447,7 @@ var ParticleSystem = /*#__PURE__*/ function(Component) {
             mask: maskProps.maskRef,
             maskMode: maskProps.maskMode,
             forceTarget: forceTarget,
-            diffuse: renderer.texture,
+            diffuse: renderer.texture ? this.engine.findObject(renderer.texture) : undefined,
             sizeOverLifetime: sizeOverLifetimeGetter,
             anchor: anchor
         };
@@ -19528,7 +19534,7 @@ var ParticleSystem = /*#__PURE__*/ function(Component) {
                 maxTrailCount: options.maxCount,
                 pointCountPerTrail: Math.round(trails.maxPointPerTrail) || 32,
                 blending: trails.blending,
-                texture: trails.texture,
+                texture: trails.texture ? this.engine.findObject(trails.texture) : undefined,
                 opacityOverLifetime: createValueGetter(trails.opacityOverLifetime || 1),
                 widthOverTrail: createValueGetter(trails.widthOverTrail || 1),
                 // order: vfxItem.listIndex + (trails.orderOffset || 0),
@@ -19549,6 +19555,7 @@ var ParticleSystem = /*#__PURE__*/ function(Component) {
         }
         this.renderer = new ParticleSystemRenderer(this.engine, particleMeshProps, trailMeshProps);
         this.renderer.item = this.item;
+        this.renderer.maskManager = this.maskManager;
         this.meshes = this.renderer.meshes;
         var interaction = props.interaction;
         if (interaction) {
@@ -19567,8 +19574,9 @@ var ParticleSystem = /*#__PURE__*/ function(Component) {
         var maskRef = 0;
         if (data.mask) {
             var _data_mask = data.mask, mode = _data_mask.mode, ref = _data_mask.ref;
+            var refComponent = this.engine.findObject(ref);
             maskMode = mode;
-            maskRef = ref.maskManager.getRefValue();
+            maskRef = refComponent.maskManager.getRefValue();
         }
         return {
             maskMode: maskMode,
@@ -20656,13 +20664,11 @@ Vector2PropertyPlayableAsset = __decorate([
     effectsClass(DataType.Vector2PropertyPlayableAsset)
 ], Vector2PropertyPlayableAsset);
 
-/**
- * @since 2.0.0
- */ var CompositionComponent = /*#__PURE__*/ function(Behaviour) {
-    _inherits(CompositionComponent, Behaviour);
+var CompositionComponent = /*#__PURE__*/ function(Component) {
+    _inherits(CompositionComponent, Component);
     function CompositionComponent() {
         var _this;
-        _this = Behaviour.apply(this, arguments) || this;
+        _this = Component.apply(this, arguments) || this;
         _this.time = 0;
         _this.startTime = 0;
         _this.items = [] // 场景的所有元素
@@ -20838,13 +20844,10 @@ Vector2PropertyPlayableAsset = __decorate([
         return startOrder;
     };
     _proto.fromData = function fromData(data) {
-        Behaviour.prototype.fromData.call(this, data);
+        Component.prototype.fromData.call(this, data);
         var compositionData = data;
-        this.items = compositionData.items;
         var _compositionData_startTime;
         this.startTime = (_compositionData_startTime = compositionData.startTime) != null ? _compositionData_startTime : 0;
-        this.sceneBindings = compositionData.sceneBindings;
-        this.timelineAsset = compositionData.timelineAsset;
     };
     _proto.resolveBindings = function resolveBindings() {
         for(var _iterator = _create_for_of_iterator_helper_loose(this.sceneBindings), _step; !(_step = _iterator()).done;){
@@ -20867,7 +20870,19 @@ Vector2PropertyPlayableAsset = __decorate([
         }
     };
     return CompositionComponent;
-}(Behaviour);
+}(Component);
+__decorate([
+    serialize()
+], CompositionComponent.prototype, "items", void 0);
+__decorate([
+    serialize()
+], CompositionComponent.prototype, "sceneBindings", void 0);
+__decorate([
+    serialize()
+], CompositionComponent.prototype, "timelineAsset", void 0);
+CompositionComponent = __decorate([
+    effectsClass("CompositionComponent")
+], CompositionComponent);
 
 /**
  *
@@ -21059,482 +21074,6 @@ var LateUpdateTickData = /*#__PURE__*/ function(TickData) {
  // }
 (TickData);
 
-var SerializationHelper = /*#__PURE__*/ function() {
-    function SerializationHelper() {}
-    SerializationHelper.collectSerializableObject = function collectSerializableObject(effectsObject, res) {
-        if (res[effectsObject.getInstanceId()]) {
-            return;
-        }
-        effectsObject.toData();
-        res[effectsObject.getInstanceId()] = effectsObject;
-        var serializedProperties = getMergedStore(effectsObject);
-        if (serializedProperties) {
-            for(var _iterator = _create_for_of_iterator_helper_loose(Object.keys(serializedProperties)), _step; !(_step = _iterator()).done;){
-                var key = _step.value;
-                // TODO 待移除，序列化属性通过 effectsObject 对象直接获取
-                var value = effectsObject.taggedProperties[key];
-                if (value === undefined) {
-                    value = effectsObject[key];
-                }
-                if (EffectsObject.is(value)) {
-                    SerializationHelper.collectSerializableObject(value, res);
-                } else if (isArray(value)) {
-                    for(var _iterator1 = _create_for_of_iterator_helper_loose(value), _step1; !(_step1 = _iterator1()).done;){
-                        var arrayValue = _step1.value;
-                        if (EffectsObject.is(arrayValue)) {
-                            SerializationHelper.collectSerializableObject(arrayValue, res);
-                        }
-                    }
-                } else if (isObject(value)) {
-                    // 非 EffectsObject 对象只递归一层
-                    for(var _iterator2 = _create_for_of_iterator_helper_loose(Object.keys(value)), _step2; !(_step2 = _iterator2()).done;){
-                        var objectKey = _step2.value;
-                        var objectValue = value[objectKey];
-                        if (EffectsObject.is(objectValue)) {
-                            SerializationHelper.collectSerializableObject(objectValue, res);
-                        }
-                    }
-                }
-            }
-        }
-    };
-    SerializationHelper.serializeEffectObject = function serializeEffectObject(effectsObject) {
-        // 持有所有需要序列化的引擎对象
-        var serializableMap = {};
-        var engine = effectsObject.engine;
-        // 加入内存中已加载的资产数据，避免重复创建资产数据
-        var serializedDatas = _extends({}, engine.jsonSceneData);
-        // 递归收集所有需要序列化的对象
-        SerializationHelper.collectSerializableObject(effectsObject, serializableMap);
-        // 依次序列化
-        for(var _iterator = _create_for_of_iterator_helper_loose(Object.keys(serializableMap)), _step; !(_step = _iterator()).done;){
-            var guid = _step.value;
-            var serializeObject = serializableMap[guid];
-            if (!serializedDatas[serializeObject.getInstanceId()]) {
-                serializedDatas[serializeObject.getInstanceId()] = {};
-            }
-            SerializationHelper.serialize(serializeObject, serializedDatas[serializeObject.getInstanceId()]);
-        }
-        return serializedDatas;
-    };
-    SerializationHelper.serialize = function serialize(effectsObject, serializedData) {
-        effectsObject.toData();
-        if (!serializedData) {
-            serializedData = {};
-        }
-        var serializedProperties = getMergedStore(effectsObject);
-        if (serializedProperties) {
-            for(var _iterator = _create_for_of_iterator_helper_loose(Object.keys(serializedProperties)), _step; !(_step = _iterator()).done;){
-                var key = _step.value;
-                var value = effectsObject[key];
-                if (typeof value === "number" || typeof value === "string" || typeof value === "boolean" || SerializationHelper.checkTypedArray(value)) {
-                    // TODO json 数据避免传 typedArray
-                    serializedData[key] = value;
-                } else if (isArray(value)) {
-                    if (!serializedData[key]) {
-                        serializedData[key] = [];
-                    }
-                    SerializationHelper.serializeArrayProperty(value, serializedData[key], 0);
-                } else if (EffectsObject.is(value)) {
-                    // TODO 处理 EffectsObject 递归序列化
-                    serializedData[key] = {
-                        id: value.getInstanceId()
-                    };
-                } else if (isObject(value)) {
-                    if (!serializedData[key]) {
-                        serializedData[key] = {};
-                    }
-                    SerializationHelper.serializeObjectProperty(value, serializedData[key], 0);
-                }
-            }
-        }
-        // TODO 待移除 tagggedProperties 为没有装饰器的临时方案
-        for(var _iterator1 = _create_for_of_iterator_helper_loose(Object.keys(effectsObject.taggedProperties)), _step1; !(_step1 = _iterator1()).done;){
-            var key1 = _step1.value;
-            var value1 = effectsObject.taggedProperties[key1];
-            if (typeof value1 === "number" || typeof value1 === "string" || typeof value1 === "boolean" || SerializationHelper.checkTypedArray(value1)) {
-                // TODO json 数据避免传 typedArray
-                serializedData[key1] = value1;
-            } else if (isArray(value1)) {
-                if (!serializedData[key1]) {
-                    serializedData[key1] = [];
-                }
-                SerializationHelper.serializeArrayProperty(value1, serializedData[key1], 0);
-            } else if (EffectsObject.is(value1)) {
-                // TODO 处理 EffectsObject 递归序列化
-                serializedData[key1] = {
-                    id: value1.getInstanceId()
-                };
-            } else if (isObject(value1)) {
-                if (!serializedData[key1]) {
-                    serializedData[key1] = {};
-                }
-                SerializationHelper.serializeObjectProperty(value1, serializedData[key1], 0);
-            }
-        }
-        return serializedData;
-    };
-    SerializationHelper.deserialize = function deserialize(serializedData, effectsObject) {
-        var taggedProperties = effectsObject.taggedProperties;
-        var serializedProperties = getMergedStore(effectsObject);
-        var engine = effectsObject.engine;
-        for(var _iterator = _create_for_of_iterator_helper_loose(Object.keys(serializedData)), _step; !(_step = _iterator()).done;){
-            var key = _step.value;
-            if (serializedProperties && serializedProperties[key]) {
-                continue;
-            }
-            var value = serializedData[key];
-            taggedProperties[key] = SerializationHelper.deserializeProperty(value, engine, 0);
-        }
-        if (serializedProperties) {
-            for(var _iterator1 = _create_for_of_iterator_helper_loose(Object.keys(serializedProperties)), _step1; !(_step1 = _iterator1()).done;){
-                var key1 = _step1.value;
-                var value1 = serializedData[key1];
-                if (value1 === undefined) {
-                    continue;
-                }
-                var propertyType = serializedProperties[key1].type;
-                // FIXME: taggedProperties 为 readonly，这里存在强制赋值
-                // @ts-expect-error
-                effectsObject[key1] = SerializationHelper.deserializeProperty(value1, engine, 0, propertyType);
-            }
-        }
-        effectsObject.fromData(taggedProperties);
-    };
-    SerializationHelper.deserializeAsync = function deserializeAsync(serializedData, effectsObject) {
-        return _async_to_generator(function() {
-            var taggedProperties, serializedProperties, engine, _iterator, _step, key, value, _iterator1, _step1, key1, value1, propertyType;
-            return __generator(this, function(_state) {
-                switch(_state.label){
-                    case 0:
-                        taggedProperties = effectsObject.taggedProperties;
-                        serializedProperties = getMergedStore(effectsObject);
-                        engine = effectsObject.engine;
-                        _iterator = _create_for_of_iterator_helper_loose(Object.keys(serializedData));
-                        _state.label = 1;
-                    case 1:
-                        if (!!(_step = _iterator()).done) return [
-                            3,
-                            4
-                        ];
-                        key = _step.value;
-                        if (serializedProperties && serializedProperties[key]) {
-                            return [
-                                3,
-                                3
-                            ];
-                        }
-                        value = serializedData[key];
-                        return [
-                            4,
-                            SerializationHelper.deserializePropertyAsync(value, engine, 0)
-                        ];
-                    case 2:
-                        taggedProperties[key] = _state.sent();
-                        _state.label = 3;
-                    case 3:
-                        return [
-                            3,
-                            1
-                        ];
-                    case 4:
-                        if (!serializedProperties) return [
-                            3,
-                            8
-                        ];
-                        _iterator1 = _create_for_of_iterator_helper_loose(Object.keys(serializedProperties));
-                        _state.label = 5;
-                    case 5:
-                        if (!!(_step1 = _iterator1()).done) return [
-                            3,
-                            8
-                        ];
-                        key1 = _step1.value;
-                        value1 = serializedData[key1];
-                        if (value1 === undefined) {
-                            return [
-                                3,
-                                7
-                            ];
-                        }
-                        propertyType = serializedProperties[key1].type;
-                        return [
-                            4,
-                            SerializationHelper.deserializePropertyAsync(value1, engine, 0, propertyType)
-                        ];
-                    case 6:
-                        // FIXME: taggedProperties 为 readonly，这里存在强制赋值
-                        // @ts-expect-error
-                        effectsObject[key1] = _state.sent();
-                        _state.label = 7;
-                    case 7:
-                        return [
-                            3,
-                            5
-                        ];
-                    case 8:
-                        effectsObject.fromData(taggedProperties);
-                        return [
-                            2
-                        ];
-                }
-            });
-        })();
-    };
-    SerializationHelper.checkTypedArray = function checkTypedArray(obj) {
-        return _instanceof1(obj, Int8Array) || _instanceof1(obj, Uint8Array) || _instanceof1(obj, Uint8ClampedArray) || _instanceof1(obj, Int16Array) || _instanceof1(obj, Uint16Array) || _instanceof1(obj, Int32Array) || _instanceof1(obj, Uint32Array) || _instanceof1(obj, Float32Array) || _instanceof1(obj, Float64Array) || _instanceof1(obj, ArrayBuffer);
-    };
-    // check value is { id: 7e69662e964e4892ae8933f24562395b }
-    SerializationHelper.checkDataPath = function checkDataPath(value) {
-        return !!(isObject(value) && Object.keys(value).length === 1 && "id" in value && isString(value.id) && value.id.length === 32);
-    };
-    // TODO 测试函数，2.0 上线后移除
-    SerializationHelper.checkGLTFNode = function checkGLTFNode(value) {
-        return isObject(value) && value.nodeIndex !== undefined && value.isJoint !== undefined;
-    };
-    SerializationHelper.checkImageSource = function checkImageSource(value) {
-        return isCanvas(value) || _instanceof1(value, HTMLImageElement);
-    };
-    SerializationHelper.deserializeProperty = function deserializeProperty(property, engine, level, type) {
-        if (level > 14) {
-            console.error("The nested object layers of the serialized data exceed the maximum limit.");
-            return;
-        }
-        // 加载并链接 DataPath 字段表示的 EffectsObject 引用。Class 对象 copy [key, value] 会丢失对象信息，因此只递归数组对象和普通 js Object 结构对象。
-        if (isArray(property)) {
-            var res = [];
-            for(var _iterator = _create_for_of_iterator_helper_loose(property), _step; !(_step = _iterator()).done;){
-                var value = _step.value;
-                res.push(SerializationHelper.deserializeProperty(value, engine, level + 1, type));
-            }
-            return res;
-        // TODO json 数据避免传 typedArray
-        } else if (SerializationHelper.checkDataPath(property)) {
-            return engine.assetLoader.loadGUID(property.id);
-        } else if (isObject(property) && property.constructor === Object) {
-            var res1;
-            if (type) {
-                res1 = new type();
-            } else {
-                res1 = {};
-            }
-            for(var _iterator1 = _create_for_of_iterator_helper_loose(Object.keys(property)), _step1; !(_step1 = _iterator1()).done;){
-                var key = _step1.value;
-                res1[key] = SerializationHelper.deserializeProperty(property[key], engine, level + 1);
-            }
-            return res1;
-        } else {
-            return property;
-        }
-    };
-    SerializationHelper.deserializePropertyAsync = function deserializePropertyAsync(property, engine, level, type) {
-        return _async_to_generator(function() {
-            var res, _iterator, _step, value, _, res1, res2, _iterator1, _step1, key;
-            return __generator(this, function(_state) {
-                switch(_state.label){
-                    case 0:
-                        if (level > 14) {
-                            console.error("The nested object layers of the serialized data exceed the maximum limit.");
-                            return [
-                                2
-                            ];
-                        }
-                        if (!isArray(property)) return [
-                            3,
-                            5
-                        ];
-                        res = [];
-                        _iterator = _create_for_of_iterator_helper_loose(property);
-                        _state.label = 1;
-                    case 1:
-                        if (!!(_step = _iterator()).done) return [
-                            3,
-                            4
-                        ];
-                        value = _step.value;
-                        _ = res.push;
-                        return [
-                            4,
-                            SerializationHelper.deserializePropertyAsync(value, engine, level + 1, type)
-                        ];
-                    case 2:
-                        _.apply(res, [
-                            _state.sent()
-                        ]);
-                        _state.label = 3;
-                    case 3:
-                        return [
-                            3,
-                            1
-                        ];
-                    case 4:
-                        return [
-                            2,
-                            res
-                        ];
-                    case 5:
-                        if (!SerializationHelper.checkDataPath(property)) return [
-                            3,
-                            7
-                        ];
-                        return [
-                            4,
-                            engine.assetLoader.loadGUIDAsync(property.id)
-                        ];
-                    case 6:
-                        res1 = _state.sent();
-                        return [
-                            2,
-                            res1
-                        ];
-                    case 7:
-                        if (!(isObject(property) && property.constructor === Object)) return [
-                            3,
-                            12
-                        ];
-                        if (type) {
-                            res2 = new type();
-                        } else {
-                            res2 = {};
-                        }
-                        _iterator1 = _create_for_of_iterator_helper_loose(Object.keys(property));
-                        _state.label = 8;
-                    case 8:
-                        if (!!(_step1 = _iterator1()).done) return [
-                            3,
-                            11
-                        ];
-                        key = _step1.value;
-                        return [
-                            4,
-                            SerializationHelper.deserializePropertyAsync(property[key], engine, level + 1)
-                        ];
-                    case 9:
-                        res2[key] = _state.sent();
-                        _state.label = 10;
-                    case 10:
-                        return [
-                            3,
-                            8
-                        ];
-                    case 11:
-                        return [
-                            2,
-                            res2
-                        ];
-                    case 12:
-                        return [
-                            2,
-                            property
-                        ];
-                    case 13:
-                        return [
-                            2
-                        ];
-                }
-            });
-        })();
-    };
-    SerializationHelper.serializeObjectProperty = function serializeObjectProperty(objectProperty, serializedData, level) {
-        if (level > 14) {
-            console.error("The nested object layers of the serialized data exceed the maximum limit.");
-            return;
-        }
-        if (!serializedData) {
-            serializedData = {};
-        }
-        for(var _iterator = _create_for_of_iterator_helper_loose(Object.keys(objectProperty)), _step; !(_step = _iterator()).done;){
-            var key = _step.value;
-            var value = objectProperty[key];
-            if (typeof value === "number" || typeof value === "string" || typeof value === "boolean" || SerializationHelper.checkTypedArray(objectProperty)) {
-                // TODO json 数据避免传 typedArray
-                serializedData[key] = value;
-            } else if (isArray(value)) {
-                if (!serializedData[key]) {
-                    serializedData[key] = [];
-                }
-                SerializationHelper.serializeArrayProperty(value, serializedData[key], level + 1);
-            } else if (EffectsObject.is(value)) {
-                // TODO 处理 EffectsObject 递归序列化
-                serializedData[key] = {
-                    id: value.getInstanceId()
-                };
-            } else if (isObject(value)) {
-                if (!serializedData[key]) {
-                    serializedData[key] = {};
-                }
-                SerializationHelper.serializeObjectProperty(value, serializedData[key], level + 1);
-            }
-        }
-    };
-    SerializationHelper.serializeArrayProperty = function serializeArrayProperty(arrayProperty, serializedData, level) {
-        if (level > 14) {
-            console.error("The nested object layers of the serialized data exceed the maximum limit.");
-            return;
-        }
-        if (!serializedData) {
-            serializedData = [];
-        }
-        for(var i = 0; i < arrayProperty.length; i++){
-            var value = arrayProperty[i];
-            if (typeof value === "number" || typeof value === "string" || typeof value === "boolean" || SerializationHelper.checkTypedArray(arrayProperty)) {
-                // TODO json 数据避免传 typedArray
-                serializedData[i] = value;
-            } else if (isArray(value)) {
-                if (!serializedData[i]) {
-                    serializedData[i] = [];
-                }
-                SerializationHelper.serializeArrayProperty(value, serializedData[i], level + 1);
-            } else if (EffectsObject.is(value)) {
-                // TODO 处理 EffectsObject 递归序列化
-                serializedData[i] = {
-                    id: value.getInstanceId()
-                };
-            } else if (isObject(value)) {
-                if (!serializedData[i]) {
-                    serializedData[i] = {};
-                }
-                SerializationHelper.serializeObjectProperty(value, serializedData[i], level + 1);
-            }
-        }
-    };
-    return SerializationHelper;
-}();
-
-var _obj$2;
-/**
- * 机型和渲染等级对应表
- *
- * 机型：B-低端机、A-中端机、S-高端机
- * 渲染等级：B-低、A-中、S-高、A+-中高、B+-全部
- *
- * - S（高端机）：高、全部、中高
- * - A（中端机）：中、全部、中高
- * - B（低端机）：低、全部
- * - undefined（全部机型）
- */ var renderLevelPassSet = (_obj$2 = {}, _obj$2[RenderLevel.S] = [
-    RenderLevel.S,
-    RenderLevel.BPlus,
-    RenderLevel.APlus
-], _obj$2[RenderLevel.A] = [
-    RenderLevel.A,
-    RenderLevel.BPlus,
-    RenderLevel.APlus
-], _obj$2[RenderLevel.B] = [
-    RenderLevel.B,
-    RenderLevel.BPlus
-], _obj$2);
-function passRenderLevel(l, renderLevel) {
-    if (!l || !renderLevel) {
-        return true;
-    }
-    var arr = renderLevelPassSet[renderLevel];
-    if (arr) {
-        return arr.includes(l);
-    }
-    return false;
-}
-
 /**
  * 合成抽象类：核心对象，通常一个场景只包含一个合成，可能会有多个合成。
  * 合成中包含了相关的 Item 元素，支持对 Item 元素的创建、更新和销毁。
@@ -21600,10 +21139,16 @@ function passRenderLevel(l, renderLevel) {
         _this.rootItem.duration = sourceContent.duration;
         _this.rootItem.endBehavior = sourceContent.endBehavior;
         _this.rootItem.composition = _assert_this_initialized(_this);
-        // Create rootCompositionComponent
-        _this.rootComposition = _this.rootItem.addComponent(CompositionComponent);
-        filterItemsByRenderLevel(sourceContent, _this.getEngine(), scene.renderLevel);
-        SerializationHelper.deserialize(sourceContent, _this.rootComposition);
+        // Create rootItem components
+        //@ts-expect-error TODO update spec.
+        var componentPaths = sourceContent.components;
+        for(var _iterator1 = _create_for_of_iterator_helper_loose(componentPaths), _step1; !(_step1 = _iterator1()).done;){
+            var componentPath = _step1.value;
+            var component = _this.getEngine().findObject(componentPath);
+            _this.rootItem.components.push(component);
+            component.item = _this.rootItem;
+        }
+        _this.rootComposition = _this.rootItem.getComponent(CompositionComponent);
         _this.width = width;
         _this.height = height;
         _this.renderOrder = baseRenderOrder;
@@ -21631,7 +21176,7 @@ function passRenderLevel(l, renderLevel) {
         _this.handleItemMessage = handleItemMessage;
         _this.createRenderFrame();
         _this.rendererOptions = null;
-        _this.buildItemTree(_this.rootItem);
+        Composition.buildItemTree(_this.rootItem);
         _this.rootComposition.setChildrenRenderOrder(0);
         _this.pluginSystem.resetComposition(_assert_this_initialized(_this), _this.renderFrame);
         return _this;
@@ -21849,38 +21394,6 @@ function passRenderLevel(l, renderLevel) {
         }
     };
     /**
-   * 构建父子树，同时保存到 itemCacheMap 中便于查找
-   */ _proto.buildItemTree = function buildItemTree(compVFXItem) {
-        if (!compVFXItem.composition) {
-            return;
-        }
-        var itemMap = new Map();
-        var contentItems = compVFXItem.getComponent(CompositionComponent).items;
-        for(var _iterator = _create_for_of_iterator_helper_loose(contentItems), _step; !(_step = _iterator()).done;){
-            var item = _step.value;
-            itemMap.set(item.id, item);
-        }
-        for(var _iterator1 = _create_for_of_iterator_helper_loose(contentItems), _step1; !(_step1 = _iterator1()).done;){
-            var item1 = _step1.value;
-            if (item1.parentId === undefined) {
-                item1.setParent(compVFXItem);
-            } else {
-                var parent = itemMap.get(item1.parentId);
-                if (parent) {
-                    item1.setParent(parent);
-                } else {
-                    throw new Error("The element references a non-existent element, please check the data.");
-                }
-            }
-        }
-        for(var _iterator2 = _create_for_of_iterator_helper_loose(contentItems), _step2; !(_step2 = _iterator2()).done;){
-            var item2 = _step2.value;
-            if (VFXItem.isComposition(item2)) {
-                this.buildItemTree(item2);
-            }
-        }
-    };
-    /**
    * 更新视频数据到纹理
    * @override
    */ _proto.updateVideo = function updateVideo() {
@@ -22239,6 +21752,30 @@ function passRenderLevel(l, renderLevel) {
             });
         })();
     };
+    /**
+   * @internal
+   * 构建父子树，同时保存到 itemCacheMap 中便于查找
+   */ Composition.buildItemTree = function buildItemTree(compVFXItem) {
+        var itemMap = new Map();
+        var contentItems = compVFXItem.getComponent(CompositionComponent).items;
+        for(var _iterator = _create_for_of_iterator_helper_loose(contentItems), _step; !(_step = _iterator()).done;){
+            var item = _step.value;
+            itemMap.set(item.id, item);
+        }
+        for(var _iterator1 = _create_for_of_iterator_helper_loose(contentItems), _step1; !(_step1 = _iterator1()).done;){
+            var item1 = _step1.value;
+            if (item1.parentId === undefined) {
+                item1.setParent(compVFXItem);
+            } else {
+                var parent = itemMap.get(item1.parentId);
+                if (parent) {
+                    item1.setParent(parent);
+                } else {
+                    throw new Error("The element references a non-existent element, please check the data.");
+                }
+            }
+        }
+    };
     _create_class(Composition, [
         {
             key: "transform",
@@ -22300,25 +21837,6 @@ function passRenderLevel(l, renderLevel) {
     ]);
     return Composition;
 }(EventEmitter);
-function filterItemsByRenderLevel(composition, engine, renderLevel) {
-    var items = [];
-    for(var _iterator = _create_for_of_iterator_helper_loose(composition.items), _step; !(_step = _iterator()).done;){
-        var itemDataPath = _step.value;
-        var itemProps = engine.findEffectsObjectData(itemDataPath.id);
-        if (passRenderLevel(itemProps.renderLevel, renderLevel)) {
-            items.push(itemDataPath);
-        } else {
-            // 非预合成元素未达到渲染等级的转化为空节点。
-            // 预合成元素有根据 item type 的子元素加载判断，没法保留空节点，这边先整体过滤掉。
-            if (itemProps.type !== ItemType.composition) {
-                itemProps.components = [];
-                items.push(itemDataPath);
-            }
-        }
-    }
-    composition.items = items;
-    return composition;
-}
 
 var VFXItem = /*#__PURE__*/ function(EffectsObject) {
     _inherits(VFXItem, EffectsObject);
@@ -22331,7 +21849,7 @@ var VFXItem = /*#__PURE__*/ function(EffectsObject) {
    */ _this.transform = new Transform();
         /**
    * 元素动画的当前时间
-   */ _this.time = 0;
+   */ _this.time = -1;
         /**
    * 元素动画的持续时间
    */ _this.duration = 0;
@@ -22342,9 +21860,8 @@ var VFXItem = /*#__PURE__*/ function(EffectsObject) {
    * 元素动画结束时行为（如何处理元素）
    */ _this.endBehavior = EndBehavior.forward;
         _this.type = ItemType.base;
-        _this.isDuringPlay = false;
         _this.components = [];
-        _this.rendererComponents = [];
+        _this.isDuringPlay = false;
         /**
    * 元素是否激活
    */ _this.active = true;
@@ -22612,6 +22129,25 @@ var VFXItem = /*#__PURE__*/ function(EffectsObject) {
         return undefined;
     };
     /**
+   * 复制 VFXItem，返回一个新的 VFXItem
+   * @since 2.4.0
+   * @returns 复制的新 VFXItem
+   */ _proto.duplicate = function duplicate() {
+        var previousObjectIDMap = new Map();
+        this.gatherPreviousObjectID(previousObjectIDMap);
+        // 重新设置当前元素和组件的 ID 以及子元素和子元素组件的 ID，避免实例化新的对象时产生碰撞
+        this.resetGUID();
+        var newItem = this.engine.findObject({
+            id: this.defination.id
+        });
+        newItem.resetGUID();
+        this.resetGUID(previousObjectIDMap);
+        if (this.composition) {
+            newItem.setParent(this.composition.rootItem);
+        }
+        return newItem;
+    };
+    /**
    * @internal
    */ _proto.beginPlay = function beginPlay() {
         this.isDuringPlay = true;
@@ -22706,19 +22242,18 @@ var VFXItem = /*#__PURE__*/ function(EffectsObject) {
         if (duration < 0) {
             throw new Error("Item duration can't be less than 0, see " + HELP_LINK["Item duration can't be less than 0"] + ".");
         }
-        this.rendererComponents.length = 0;
-        for(var _iterator = _create_for_of_iterator_helper_loose(this.components), _step; !(_step = _iterator()).done;){
-            var component = _step.value;
-            component.item = this;
-            if (_instanceof1(component, RendererComponent)) {
-                this.rendererComponents.push(component);
-            }
-            // TODO ParticleSystemRenderer 现在是动态生成的，后面需要在 json 中单独表示为一个组件
-            if (_instanceof1(component, ParticleSystem)) {
-                if (!this.components.includes(component.renderer)) {
-                    this.components.push(component.renderer);
+        if (data.components) {
+            this.components.length = 0;
+            for(var _iterator = _create_for_of_iterator_helper_loose(data.components), _step; !(_step = _iterator()).done;){
+                var componentPath = _step.value;
+                var component = this.engine.findObject(componentPath);
+                this.components.push(component);
+                // TODO ParticleSystemRenderer 现在是动态生成的，后面需要在 json 中单独表示为一个组件
+                if (_instanceof1(component, ParticleSystem)) {
+                    if (!this.components.includes(component.renderer)) {
+                        this.components.push(component.renderer);
+                    }
                 }
-                this.rendererComponents.push(component.renderer);
             }
         }
         if (VFXItem.isComposition(this)) {
@@ -22727,24 +22262,24 @@ var VFXItem = /*#__PURE__*/ function(EffectsObject) {
     };
     _proto.toData = function toData() {
         var _this_parent;
-        this.taggedProperties.id = this.guid;
-        this.taggedProperties.transform = this.transform.toData();
-        this.taggedProperties.dataType = DataType.VFXItemData;
+        this.defination.id = this.guid;
+        this.defination.transform = this.transform.toData();
+        this.defination.dataType = DataType.VFXItemData;
         if (((_this_parent = this.parent) == null ? void 0 : _this_parent.name) !== "rootItem") {
             var _this_parent1;
-            this.taggedProperties.parentId = (_this_parent1 = this.parent) == null ? void 0 : _this_parent1.guid;
+            this.defination.parentId = (_this_parent1 = this.parent) == null ? void 0 : _this_parent1.guid;
         }
         // TODO 统一 sprite 等其他组件的序列化逻辑
-        if (!this.taggedProperties.components) {
-            this.taggedProperties.components = [];
+        if (!this.defination.components) {
+            this.defination.components = [];
             for(var _iterator = _create_for_of_iterator_helper_loose(this.components), _step; !(_step = _iterator()).done;){
                 var component = _step.value;
                 if (_instanceof1(component, EffectComponent)) {
-                    this.taggedProperties.components.push(component);
+                    this.defination.components.push(component);
                 }
             }
         }
-        this.taggedProperties.content = {};
+        this.defination.content = {};
     };
     _proto.translateByPixel = function translateByPixel(x, y) {
         if (this.composition) {
@@ -22801,17 +22336,52 @@ var VFXItem = /*#__PURE__*/ function(EffectsObject) {
         if (!props) {
             throw new Error("Referenced precomposition with Id: " + refId + " does not exist.");
         }
-        var compositionComponent = this.addComponent(CompositionComponent);
-        filterItemsByRenderLevel(props, this.engine, this.engine.renderLevel);
-        SerializationHelper.deserialize(props, compositionComponent);
-        for(var _iterator = _create_for_of_iterator_helper_loose(compositionComponent.items), _step; !(_step = _iterator()).done;){
-            var vfxItem = _step.value;
-            vfxItem.setInstanceId(generateGUID());
-            for(var _iterator1 = _create_for_of_iterator_helper_loose(vfxItem.components), _step1; !(_step1 = _iterator1()).done;){
-                var component = _step1.value;
-                component.setInstanceId(generateGUID());
+        //@ts-expect-error TODO update spec.
+        var componentPaths = props.components;
+        for(var _iterator = _create_for_of_iterator_helper_loose(componentPaths), _step; !(_step = _iterator()).done;){
+            var componentPath = _step.value;
+            var component = this.engine.findObject(componentPath);
+            component.item = this;
+            this.components.push(component);
+            component.setInstanceId(generateGUID());
+            if (_instanceof1(component, CompositionComponent)) {
+                for(var _iterator1 = _create_for_of_iterator_helper_loose(component.items), _step1; !(_step1 = _iterator1()).done;){
+                    var vfxItem = _step1.value;
+                    vfxItem.setInstanceId(generateGUID());
+                    for(var _iterator2 = _create_for_of_iterator_helper_loose(vfxItem.components), _step2; !(_step2 = _iterator2()).done;){
+                        var component1 = _step2.value;
+                        component1.setInstanceId(generateGUID());
+                    }
+                }
             }
         }
+        Composition.buildItemTree(this);
+    };
+    _proto.resetGUID = function resetGUID(previousObjectIDMap) {
+        var _previousObjectIDMap_get;
+        var itemGUID = (_previousObjectIDMap_get = previousObjectIDMap == null ? void 0 : previousObjectIDMap.get(this)) != null ? _previousObjectIDMap_get : generateGUID();
+        this.setInstanceId(itemGUID);
+        for(var _iterator = _create_for_of_iterator_helper_loose(this.components), _step; !(_step = _iterator()).done;){
+            var component = _step.value;
+            var _previousObjectIDMap_get1;
+            var componentGUID = (_previousObjectIDMap_get1 = previousObjectIDMap == null ? void 0 : previousObjectIDMap.get(component)) != null ? _previousObjectIDMap_get1 : generateGUID();
+            component.setInstanceId(componentGUID);
+        }
+        for(var _iterator1 = _create_for_of_iterator_helper_loose(this.children), _step1; !(_step1 = _iterator1()).done;){
+            var child = _step1.value;
+            child.resetGUID(previousObjectIDMap);
+        }
+    };
+    _proto.gatherPreviousObjectID = function gatherPreviousObjectID(previousObjectIDMap) {
+        previousObjectIDMap.set(this, this.getInstanceId());
+        for(var _iterator = _create_for_of_iterator_helper_loose(this.components), _step; !(_step = _iterator()).done;){
+            var component = _step.value;
+            previousObjectIDMap.set(component, component.getInstanceId());
+        }
+        for(var _iterator1 = _create_for_of_iterator_helper_loose(this.children), _step1; !(_step1 = _iterator1()).done;){
+            var child = _step1.value;
+            child.gatherPreviousObjectID(previousObjectIDMap);
+        }
     };
     /**
    *
@@ -22918,9 +22488,11 @@ var VFXItem = /*#__PURE__*/ function(EffectsObject) {
             set: function set(value) {
                 if (this.listIndex !== value) {
                     this.listIndex = value;
-                    for(var _iterator = _create_for_of_iterator_helper_loose(this.rendererComponents), _step; !(_step = _iterator()).done;){
-                        var rendererComponent = _step.value;
-                        rendererComponent.priority = value;
+                    for(var _iterator = _create_for_of_iterator_helper_loose(this.components), _step; !(_step = _iterator()).done;){
+                        var component = _step.value;
+                        if (_instanceof1(component, RendererComponent)) {
+                            component.priority = value;
+                        }
                     }
                 }
             }
@@ -22944,9 +22516,6 @@ var VFXItem = /*#__PURE__*/ function(EffectsObject) {
     ]);
     return VFXItem;
 }(EffectsObject);
-__decorate([
-    serialize()
-], VFXItem.prototype, "components", void 0);
 VFXItem = __decorate([
     effectsClass(DataType.VFXItemData)
 ], VFXItem);
@@ -27011,8 +26580,6 @@ var BinaryAsset = /*#__PURE__*/ function(EffectsObject) {
     function BinaryAsset() {
         return EffectsObject.apply(this, arguments);
     }
-    var _proto = BinaryAsset.prototype;
-    _proto.fromData = function fromData(data) {};
     return BinaryAsset;
 }(EffectsObject);
 __decorate([
@@ -27022,6 +26589,197 @@ BinaryAsset = __decorate([
     effectsClass(DataType.BinaryAsset)
 ], BinaryAsset);
 
+var SerializationHelper = /*#__PURE__*/ function() {
+    function SerializationHelper() {}
+    SerializationHelper.serialize = function serialize(effectsObject, serializedData) {
+        effectsObject.toData();
+        if (!serializedData) {
+            serializedData = {};
+        }
+        var serializedProperties = getMergedStore(effectsObject);
+        if (serializedProperties) {
+            for(var _iterator = _create_for_of_iterator_helper_loose(Object.keys(serializedProperties)), _step; !(_step = _iterator()).done;){
+                var key = _step.value;
+                var value = effectsObject[key];
+                if (typeof value === "number" || typeof value === "string" || typeof value === "boolean" || SerializationHelper.checkTypedArray(value)) {
+                    // TODO json 数据避免传 typedArray
+                    serializedData[key] = value;
+                } else if (isArray(value)) {
+                    if (!serializedData[key]) {
+                        serializedData[key] = [];
+                    }
+                    SerializationHelper.serializeArrayProperty(value, serializedData[key], 0);
+                } else if (EffectsObject.is(value)) {
+                    // TODO 处理 EffectsObject 递归序列化
+                    serializedData[key] = {
+                        id: value.getInstanceId()
+                    };
+                } else if (isObject(value)) {
+                    if (!serializedData[key]) {
+                        serializedData[key] = {};
+                    }
+                    SerializationHelper.serializeObjectProperty(value, serializedData[key], 0);
+                }
+            }
+        }
+        // TODO 待移除 tagggedProperties 为没有装饰器的临时方案
+        for(var _iterator1 = _create_for_of_iterator_helper_loose(Object.keys(effectsObject.defination)), _step1; !(_step1 = _iterator1()).done;){
+            var key1 = _step1.value;
+            var value1 = effectsObject.defination[key1];
+            if (typeof value1 === "number" || typeof value1 === "string" || typeof value1 === "boolean" || SerializationHelper.checkTypedArray(value1)) {
+                // TODO json 数据避免传 typedArray
+                serializedData[key1] = value1;
+            } else if (isArray(value1)) {
+                if (!serializedData[key1]) {
+                    serializedData[key1] = [];
+                }
+                SerializationHelper.serializeArrayProperty(value1, serializedData[key1], 0);
+            } else if (EffectsObject.is(value1)) {
+                // TODO 处理 EffectsObject 递归序列化
+                serializedData[key1] = {
+                    id: value1.getInstanceId()
+                };
+            } else if (isObject(value1)) {
+                if (!serializedData[key1]) {
+                    serializedData[key1] = {};
+                }
+                SerializationHelper.serializeObjectProperty(value1, serializedData[key1], 0);
+            }
+        }
+        return serializedData;
+    };
+    SerializationHelper.deserialize = function deserialize(serializedData, effectsObject) {
+        effectsObject.defination = serializedData;
+        var serializedProperties = getMergedStore(effectsObject);
+        var engine = effectsObject.engine;
+        if (serializedProperties) {
+            for(var _iterator = _create_for_of_iterator_helper_loose(Object.keys(serializedProperties)), _step; !(_step = _iterator()).done;){
+                var key = _step.value;
+                var value = serializedData[key];
+                if (value === undefined) {
+                    continue;
+                }
+                var propertyType = serializedProperties[key].type;
+                // FIXME: taggedProperties 为 readonly，这里存在强制赋值
+                effectsObject[key] = SerializationHelper.deserializeProperty(value, engine, 0, propertyType);
+            }
+        }
+        effectsObject.fromData(effectsObject.defination);
+    };
+    SerializationHelper.checkTypedArray = function checkTypedArray(obj) {
+        return _instanceof1(obj, Int8Array) || _instanceof1(obj, Uint8Array) || _instanceof1(obj, Uint8ClampedArray) || _instanceof1(obj, Int16Array) || _instanceof1(obj, Uint16Array) || _instanceof1(obj, Int32Array) || _instanceof1(obj, Uint32Array) || _instanceof1(obj, Float32Array) || _instanceof1(obj, Float64Array) || _instanceof1(obj, ArrayBuffer);
+    };
+    // check value is { id: 7e69662e964e4892ae8933f24562395b }
+    SerializationHelper.checkDataPath = function checkDataPath(value) {
+        return !!(isObject(value) && Object.keys(value).length === 1 && "id" in value && isString(value.id) && value.id.length === 32);
+    };
+    // TODO 测试函数，2.0 上线后移除
+    SerializationHelper.checkGLTFNode = function checkGLTFNode(value) {
+        return isObject(value) && value.nodeIndex !== undefined && value.isJoint !== undefined;
+    };
+    SerializationHelper.checkImageSource = function checkImageSource(value) {
+        return isCanvas(value) || _instanceof1(value, HTMLImageElement);
+    };
+    SerializationHelper.deserializeProperty = function deserializeProperty(property, engine, level, type, overrideDataPath) {
+        if (overrideDataPath === void 0) overrideDataPath = true;
+        if (level > 14) {
+            console.error("The nested object layers of the serialized data exceed the maximum limit.");
+            return;
+        }
+        // 加载并链接 DataPath 字段表示的 EffectsObject 引用。Class 对象 copy [key, value] 会丢失对象信息，因此只递归数组对象和普通 js Object 结构对象。
+        if (isArray(property)) {
+            var res = [];
+            for(var _iterator = _create_for_of_iterator_helper_loose(property), _step; !(_step = _iterator()).done;){
+                var value = _step.value;
+                res.push(SerializationHelper.deserializeProperty(value, engine, level + 1, type, overrideDataPath));
+            }
+            return res;
+        // TODO json 数据避免传 typedArray
+        } else if (SerializationHelper.checkDataPath(property)) {
+            var referenceObject = engine.findObject(property);
+            return overrideDataPath ? referenceObject : property;
+        } else if (isObject(property) && property.constructor === Object) {
+            var res1;
+            if (type) {
+                res1 = new type();
+            } else {
+                res1 = {};
+            }
+            for(var _iterator1 = _create_for_of_iterator_helper_loose(Object.keys(property)), _step1; !(_step1 = _iterator1()).done;){
+                var key = _step1.value;
+                res1[key] = SerializationHelper.deserializeProperty(property[key], engine, level + 1, undefined, overrideDataPath);
+            }
+            return res1;
+        } else {
+            return property;
+        }
+    };
+    SerializationHelper.serializeObjectProperty = function serializeObjectProperty(objectProperty, serializedData, level) {
+        if (level > 14) {
+            console.error("The nested object layers of the serialized data exceed the maximum limit.");
+            return;
+        }
+        if (!serializedData) {
+            serializedData = {};
+        }
+        for(var _iterator = _create_for_of_iterator_helper_loose(Object.keys(objectProperty)), _step; !(_step = _iterator()).done;){
+            var key = _step.value;
+            var value = objectProperty[key];
+            if (typeof value === "number" || typeof value === "string" || typeof value === "boolean" || SerializationHelper.checkTypedArray(objectProperty)) {
+                // TODO json 数据避免传 typedArray
+                serializedData[key] = value;
+            } else if (isArray(value)) {
+                if (!serializedData[key]) {
+                    serializedData[key] = [];
+                }
+                SerializationHelper.serializeArrayProperty(value, serializedData[key], level + 1);
+            } else if (EffectsObject.is(value)) {
+                // TODO 处理 EffectsObject 递归序列化
+                serializedData[key] = {
+                    id: value.getInstanceId()
+                };
+            } else if (isObject(value)) {
+                if (!serializedData[key]) {
+                    serializedData[key] = {};
+                }
+                SerializationHelper.serializeObjectProperty(value, serializedData[key], level + 1);
+            }
+        }
+    };
+    SerializationHelper.serializeArrayProperty = function serializeArrayProperty(arrayProperty, serializedData, level) {
+        if (level > 14) {
+            console.error("The nested object layers of the serialized data exceed the maximum limit.");
+            return;
+        }
+        if (!serializedData) {
+            serializedData = [];
+        }
+        for(var i = 0; i < arrayProperty.length; i++){
+            var value = arrayProperty[i];
+            if (typeof value === "number" || typeof value === "string" || typeof value === "boolean" || SerializationHelper.checkTypedArray(arrayProperty)) {
+                // TODO json 数据避免传 typedArray
+                serializedData[i] = value;
+            } else if (isArray(value)) {
+                if (!serializedData[i]) {
+                    serializedData[i] = [];
+                }
+                SerializationHelper.serializeArrayProperty(value, serializedData[i], level + 1);
+            } else if (EffectsObject.is(value)) {
+                // TODO 处理 EffectsObject 递归序列化
+                serializedData[i] = {
+                    id: value.getInstanceId()
+                };
+            } else if (isObject(value)) {
+                if (!serializedData[i]) {
+                    serializedData[i] = {};
+                }
+                SerializationHelper.serializeObjectProperty(value, serializedData[i], level + 1);
+            }
+        }
+    };
+    return SerializationHelper;
+}();
+
 /**
  * @since 2.0.0
  */ var AssetLoader = /*#__PURE__*/ function() {
@@ -27029,9 +26787,10 @@ BinaryAsset = __decorate([
         this.engine = engine;
     }
     var _proto = AssetLoader.prototype;
-    _proto.loadGUID = function loadGUID(guid) {
-        if (this.engine.objectInstance[guid]) {
-            return this.engine.objectInstance[guid];
+    _proto.loadGUID = function loadGUID(dataPath) {
+        var guid = dataPath.id;
+        if (!dataPath) {
+            return null;
         }
         var effectsObjectData = this.findData(guid);
         var effectsObject;
@@ -27066,92 +26825,6 @@ BinaryAsset = __decorate([
         SerializationHelper.deserialize(effectsObjectData, effectsObject);
         return effectsObject;
     };
-    // 加载本地文件资产
-    _proto.loadGUIDAsync = function loadGUIDAsync(guid) {
-        var _this = this;
-        return _async_to_generator(function() {
-            var effectsObjectData, effectsObject, classConstructor;
-            return __generator(this, function(_state) {
-                switch(_state.label){
-                    case 0:
-                        if (_this.engine.objectInstance[guid]) {
-                            return [
-                                2,
-                                _this.engine.objectInstance[guid]
-                            ];
-                        }
-                        effectsObjectData = _this.findData(guid);
-                        if (!!effectsObjectData) return [
-                            3,
-                            2
-                        ];
-                        if (!_this.engine.database) {
-                            console.error("Object data with uuid: " + guid + " not found.");
-                            return [
-                                2,
-                                undefined
-                            ];
-                        }
-                        return [
-                            4,
-                            _this.engine.database.loadGUID(guid)
-                        ];
-                    case 1:
-                        effectsObject = _state.sent();
-                        if (!effectsObject) {
-                            console.error("Disk data with uuid: " + guid + " not found.");
-                            return [
-                                2,
-                                undefined
-                            ];
-                        }
-                        _this.engine.addInstance(effectsObject);
-                        return [
-                            2,
-                            effectsObject
-                        ];
-                    case 2:
-                        switch(effectsObjectData.dataType){
-                            case DataType.Material:
-                                effectsObject = Material.create(_this.engine);
-                                break;
-                            case DataType.Geometry:
-                                effectsObject = Geometry.create(_this.engine);
-                                break;
-                            case DataType.Texture:
-                                effectsObject = Texture.create(_this.engine);
-                                break;
-                            default:
-                                {
-                                    classConstructor = AssetLoader.getClass(effectsObjectData.dataType);
-                                    if (classConstructor) {
-                                        effectsObject = new classConstructor(_this.engine);
-                                    }
-                                }
-                        }
-                        if (!effectsObject) {
-                            console.error("Constructor for DataType: " + effectsObjectData.dataType + " not found.");
-                            return [
-                                2,
-                                undefined
-                            ];
-                        }
-                        effectsObject.setInstanceId(effectsObjectData.id);
-                        _this.engine.addInstance(effectsObject);
-                        return [
-                            4,
-                            SerializationHelper.deserializeAsync(effectsObjectData, effectsObject)
-                        ];
-                    case 3:
-                        _state.sent();
-                        return [
-                            2,
-                            effectsObject
-                        ];
-                }
-            });
-        })();
-    };
     _proto.findData = function findData(uuid) {
         return this.engine.jsonSceneData[uuid];
     };
@@ -27501,35 +27174,35 @@ function rotationZYXFromQuat(out, quat) {
         ];
     }
 }
-var _obj$1;
-var particleOriginTranslateMap = (_obj$1 = {}, _obj$1[ParticleOrigin.PARTICLE_ORIGIN_CENTER] = [
+var _obj$2;
+var particleOriginTranslateMap = (_obj$2 = {}, _obj$2[ParticleOrigin.PARTICLE_ORIGIN_CENTER] = [
     0,
     0
-], _obj$1[ParticleOrigin.PARTICLE_ORIGIN_CENTER_BOTTOM] = [
+], _obj$2[ParticleOrigin.PARTICLE_ORIGIN_CENTER_BOTTOM] = [
     0,
     -0.5
-], _obj$1[ParticleOrigin.PARTICLE_ORIGIN_CENTER_TOP] = [
+], _obj$2[ParticleOrigin.PARTICLE_ORIGIN_CENTER_TOP] = [
     0,
     0.5
-], _obj$1[ParticleOrigin.PARTICLE_ORIGIN_LEFT_TOP] = [
+], _obj$2[ParticleOrigin.PARTICLE_ORIGIN_LEFT_TOP] = [
     -0.5,
     0.5
-], _obj$1[ParticleOrigin.PARTICLE_ORIGIN_LEFT_CENTER] = [
+], _obj$2[ParticleOrigin.PARTICLE_ORIGIN_LEFT_CENTER] = [
     -0.5,
     0
-], _obj$1[ParticleOrigin.PARTICLE_ORIGIN_LEFT_BOTTOM] = [
+], _obj$2[ParticleOrigin.PARTICLE_ORIGIN_LEFT_BOTTOM] = [
     -0.5,
     -0.5
-], _obj$1[ParticleOrigin.PARTICLE_ORIGIN_RIGHT_CENTER] = [
+], _obj$2[ParticleOrigin.PARTICLE_ORIGIN_RIGHT_CENTER] = [
     0.5,
     0
-], _obj$1[ParticleOrigin.PARTICLE_ORIGIN_RIGHT_BOTTOM] = [
+], _obj$2[ParticleOrigin.PARTICLE_ORIGIN_RIGHT_BOTTOM] = [
     0.5,
     -0.5
-], _obj$1[ParticleOrigin.PARTICLE_ORIGIN_RIGHT_TOP] = [
+], _obj$2[ParticleOrigin.PARTICLE_ORIGIN_RIGHT_TOP] = [
     0.5,
     0.5
-], _obj$1);
+], _obj$2);
 function getBezierCurveFromHermite(m0, m1, p0, p3) {
     var xStart = p0[0];
     var yStart = p0[1];
@@ -27768,28 +27441,6 @@ var refCompositions = new Map();
             }
         }
     }
-    // Composition id 转 guid
-    var compositionId = json.compositionId;
-    var compositionIdToGUIDMap = {};
-    for(var _iterator3 = _create_for_of_iterator_helper_loose(json.compositions), _step3; !(_step3 = _iterator3()).done;){
-        var composition = _step3.value;
-        var guid = generateGUID();
-        compositionIdToGUIDMap[composition.id] = guid;
-        if (composition.id === compositionId) {
-            json.compositionId = guid;
-        }
-        composition.id = guid;
-    }
-    // 预合成元素 refId 同步改为生成的合成 guid
-    for(var _iterator4 = _create_for_of_iterator_helper_loose(json.items), _step4; !(_step4 = _iterator4()).done;){
-        var item = _step4.value;
-        if (item.content) {
-            var compositionOptions = item.content.options;
-            if (compositionOptions && compositionOptions.refId !== undefined) {
-                compositionOptions.refId = compositionIdToGUIDMap[compositionOptions.refId];
-            }
-        }
-    }
     return json;
 }
 function version32Migration(json) {
@@ -27816,21 +27467,68 @@ function version32Migration(json) {
         itemMap.set(item.id, item);
     }
     processContent(mainComp);
+    return json;
+}
+function version33Migration(json) {
     // 老 shape 数据兼容
-    for(var _iterator3 = _create_for_of_iterator_helper_loose(items), _step3; !(_step3 = _iterator3()).done;){
-        var item1 = _step3.value;
-        if (item1.type === ItemType.sprite) {
-            var spriteComponent = componentMap.get(item1.components[0].id);
+    for(var _iterator = _create_for_of_iterator_helper_loose(json.items), _step; !(_step = _iterator()).done;){
+        var item = _step.value;
+        if (item.type === ItemType.sprite) {
+            var spriteComponent = componentMap.get(item.components[0].id);
             if (spriteComponent) {
                 var shape = spriteComponent.renderer.shape;
                 var shapeData = void 0;
                 if (Number.isInteger(shape)) {
                     shapeData = json.shapes[shape];
+                } else {
+                    shapeData = shape;
                 }
                 spriteComponent.renderer.shape = shapeData;
             }
         }
     }
+    // Composition id 转 guid, Composition 分离 CompositionComponent
+    var compositionId = json.compositionId;
+    var compositionIdToGUIDMap = {};
+    for(var _iterator1 = _create_for_of_iterator_helper_loose(json.compositions), _step1; !(_step1 = _iterator1()).done;){
+        var composition = _step1.value;
+        var guid = generateGUID();
+        compositionIdToGUIDMap[composition.id] = guid;
+        if (composition.id === compositionId) {
+            json.compositionId = guid;
+        }
+        composition.id = guid;
+        var compositionComponent = {
+            id: generateGUID(),
+            dataType: "CompositionComponent",
+            items: composition.items,
+            timelineAsset: composition.timelineAsset,
+            sceneBindings: composition.sceneBindings,
+            startTime: composition.startTime
+        };
+        //@ts-expect-error
+        composition.timelineAsset = undefined;
+        //@ts-expect-error
+        composition.sceneBindings = undefined;
+        composition.startTime = undefined;
+        //@ts-expect-error
+        composition.components = [
+            {
+                id: compositionComponent.id
+            }
+        ];
+        json.components.push(compositionComponent);
+    }
+    // 预合成元素 refId 同步改为生成的合成 guid
+    for(var _iterator2 = _create_for_of_iterator_helper_loose(json.items), _step2; !(_step2 = _iterator2()).done;){
+        var item1 = _step2.value;
+        if (item1.content) {
+            var compositionOptions = item1.content.options;
+            if (compositionOptions && compositionOptions.refId !== undefined) {
+                compositionOptions.refId = compositionIdToGUIDMap[compositionOptions.refId];
+            }
+        }
+    }
     return json;
 }
 function processContent(composition) {
@@ -28704,7 +28402,7 @@ function getStandardJSON(json) {
     if (v0.test(json.version)) {
         var _exec;
         reverseParticle = ((_exec = /^(\d+)/.exec(json.version)) == null ? void 0 : _exec[0]) === "0";
-        return version32Migration(version31Migration(version30Migration(version21Migration(getStandardJSONFromV0(json)))));
+        return version33Migration(version32Migration(version31Migration(version30Migration(version21Migration(getStandardJSONFromV0(json))))));
     }
     reverseParticle = false;
     var vs = standardVersion.exec(json.version) || [];
@@ -28729,6 +28427,9 @@ function getStandardJSON(json) {
             if (minorVersion < 3) {
                 json = version32Migration(json);
             }
+            if (minorVersion < 4) {
+                json = version33Migration(json);
+            }
         }
         return json;
     }
@@ -29012,6 +28713,40 @@ function getStandardItem(item, opt) {
     }
 }
 
+var _obj$1;
+/**
+ * 机型和渲染等级对应表
+ *
+ * 机型：B-低端机、A-中端机、S-高端机
+ * 渲染等级：B-低、A-中、S-高、A+-中高、B+-全部
+ *
+ * - S（高端机）：高、全部、中高
+ * - A（中端机）：中、全部、中高
+ * - B（低端机）：低、全部
+ * - undefined（全部机型）
+ */ var renderLevelPassSet = (_obj$1 = {}, _obj$1[RenderLevel.S] = [
+    RenderLevel.S,
+    RenderLevel.BPlus,
+    RenderLevel.APlus
+], _obj$1[RenderLevel.A] = [
+    RenderLevel.A,
+    RenderLevel.BPlus,
+    RenderLevel.APlus
+], _obj$1[RenderLevel.B] = [
+    RenderLevel.B,
+    RenderLevel.BPlus
+], _obj$1);
+function passRenderLevel(l, renderLevel) {
+    if (!l || !renderLevel) {
+        return true;
+    }
+    var arr = renderLevelPassSet[renderLevel];
+    if (arr) {
+        return arr.includes(l);
+    }
+    return false;
+}
+
 var Scene;
 (function(Scene) {
     function isJSONObject(scene) {
@@ -29911,7 +29646,9 @@ function createTextureOptionsBySource(image, sourceFrom, id) {
             if (_instanceof1(textureOptions, Texture)) {
                 this.engine.addInstance(textureOptions);
             } else {
-                textureOptions = this.engine.assetLoader.loadGUID(scene.textureOptions[i].id);
+                textureOptions = this.engine.findObject({
+                    id: scene.textureOptions[i].id
+                });
                 scene.textureOptions[i] = textureOptions;
             }
             textureOptions.initialize();
@@ -31558,8 +31295,18 @@ var FBGeometryDataT = /*#__PURE__*/ function() {
     _proto.addInstance = function addInstance(effectsObject) {
         this.objectInstance[effectsObject.getInstanceId()] = effectsObject;
     };
-    _proto.getInstance = function getInstance(id) {
-        return this.objectInstance[id];
+    /**
+   * @ignore
+   */ _proto.findObject = function findObject(guid) {
+        // 编辑器可能传 Class 对象，这边判断处理一下直接返回原对象。
+        if (!(isObject(guid) && guid.constructor === Object)) {
+            return guid;
+        }
+        if (this.objectInstance[guid.id]) {
+            return this.objectInstance[guid.id];
+        }
+        var result = this.assetLoader.loadGUID(guid);
+        return result;
     };
     _proto.removeInstance = function removeInstance(id) {
         delete this.objectInstance[id];
@@ -31573,6 +31320,10 @@ var FBGeometryDataT = /*#__PURE__*/ function() {
         }
         for(var _iterator1 = _create_for_of_iterator_helper_loose(items), _step1; !(_step1 = _iterator1()).done;){
             var vfxItemData = _step1.value;
+            if (!passRenderLevel(vfxItemData.renderLevel, scene.renderLevel)) {
+                vfxItemData.components = [];
+                vfxItemData.type = ItemType.null;
+            }
             this.addEffectsObjectData(vfxItemData);
         }
         for(var _iterator2 = _create_for_of_iterator_helper_loose(materials), _step2; !(_step2 = _iterator2()).done;){
@@ -31627,45 +31378,20 @@ var FBGeometryDataT = /*#__PURE__*/ function() {
         return _async_to_generator(function() {
             var jsonScene, _iterator, _step, itemData, itemType;
             return __generator(this, function(_state) {
-                switch(_state.label){
-                    case 0:
-                        jsonScene = scene.jsonScene;
-                        _iterator = _create_for_of_iterator_helper_loose(jsonScene.items);
-                        _state.label = 1;
-                    case 1:
-                        if (!!(_step = _iterator()).done) return [
-                            3,
-                            4
-                        ];
-                        itemData = _step.value;
-                        itemType = itemData.type;
-                        if (!(itemType === "ECS" || itemType === "camera" || itemType === ItemType.sprite || itemType === ItemType.particle || itemType === ItemType.mesh || itemType === ItemType.skybox || itemType === ItemType.light || itemType === ItemType.tree || itemType === ItemType.interact || itemType === ItemType.camera)) {
-                            return [
-                                3,
-                                3
-                            ];
-                        }
-                        if (!_this.database) return [
-                            3,
-                            3
-                        ];
-                        return [
-                            4,
-                            _this.assetLoader.loadGUIDAsync(itemData.id)
-                        ];
-                    case 2:
-                        _state.sent();
-                        _state.label = 3;
-                    case 3:
-                        return [
-                            3,
-                            1
-                        ];
-                    case 4:
-                        return [
-                            2
-                        ];
+                jsonScene = scene.jsonScene;
+                for(_iterator = _create_for_of_iterator_helper_loose(jsonScene.items); !(_step = _iterator()).done;){
+                    itemData = _step.value;
+                    itemType = itemData.type;
+                    if (!(itemType === "ECS" || itemType === "camera" || itemType === ItemType.sprite || itemType === ItemType.particle || itemType === ItemType.mesh || itemType === ItemType.skybox || itemType === ItemType.light || itemType === ItemType.tree || itemType === ItemType.interact || itemType === ItemType.camera)) {
+                        continue;
+                    }
+                    if (_this.database) {
+                        _this.assetLoader.loadGUID(itemData);
+                    }
                 }
+                return [
+                    2
+                ];
             });
         })();
     };
@@ -31913,7 +31639,7 @@ registerPlugin("sprite", SpriteLoader, VFXItem);
 registerPlugin("particle", ParticleLoader, VFXItem);
 registerPlugin("cal", CalculateLoader, VFXItem);
 registerPlugin("interact", InteractLoader, VFXItem);
-var version$1 = "2.4.0-beta.0";
+var version$1 = "2.4.0-beta.2";
 logger.info("Core version: " + version$1 + ".");
 
 var _obj;
@@ -32506,6 +32232,17 @@ var _obj3;
                     this.material.side = THREE.BackSide;
                 }
             }
+        },
+        {
+            key: "colorMask",
+            get: function get() {
+                return this.material.colorWrite;
+            },
+            set: /**
+   * 获取颜色写入开关
+   */ function set(value) {
+                this.material.colorWrite = value;
+            }
         }
     ]);
     return ThreeMaterial;
@@ -33504,8 +33241,8 @@ setMaxSpriteMeshItemCount(8);
  */ Mesh.create = function(engine, props) {
     return new ThreeMesh(engine, props);
 };
-var version = "2.4.0-beta.0";
+var version = "2.4.0-beta.2";
 logger.info("THREEJS plugin version: " + version + ".");
 
-export { AbstractPlugin, ActivationPlayable, ActivationPlayableAsset, ActivationTrack, AnimationClip, AnimationClipPlayable, Asset, AssetLoader, AssetManager, AssetService, BYTES_TYPE_MAP, BaseRenderComponent, Behaviour, BezierCurve, BezierCurvePath, BezierCurveQuat, BinaryAsset, COMPRESSED_TEXTURE, CONSTANT_MAP_BLEND, CONSTANT_MAP_DEPTH, CONSTANT_MAP_STENCIL_FUNC, CONSTANT_MAP_STENCIL_OP, COPY_FRAGMENT_SHADER, COPY_MESH_SHADER_ID, COPY_VERTEX_SHADER, CalculateLoader, Camera, CameraController, CameraVFXItemLoader, ColorCurve, ColorPropertyPlayableAsset, ColorPropertyTrack, Component, Composition, CompositionComponent, DEFAULT_FONTS, DEFAULT_FPS, Database, DestroyOptions, Downloader, EFFECTS_COPY_MESH_NAME, EVENT_TYPE_CLICK, EVENT_TYPE_TOUCH_END, EVENT_TYPE_TOUCH_MOVE, EVENT_TYPE_TOUCH_START, EffectComponent, EffectsObject, EffectsPackage, Ellipse, Engine, EventEmitter, EventSystem, Fake3DAnimationMode, Fake3DComponent, FilterMode, Float16ArrayWrapper, FloatPropertyPlayableAsset, FloatPropertyTrack, Framebuffer, GLSLVersion, GPUCapability, Geometry, GlobalUniforms, GradientValue, GraphicsPath, HELP_LINK, HitTestType, InteractComponent, InteractLoader, InteractMesh, Item, KTXTexture, LineSegments, LinearValue, MaskMode, MaskProcessor, MaskRefManager, Material, MaterialDataBlock, MaterialRenderType, MaterialTrack, Mesh, MeshCollider, ObjectBindingTrack, OrderType, PLAYER_OPTIONS_ENV_EDITOR, POST_PROCESS_SETTINGS, ParticleBehaviourPlayable, ParticleBehaviourPlayableAsset, ParticleLoader, ParticleMesh, ParticleSystem, ParticleSystemRenderer, ParticleTrack, PassTextureCache, PathSegments, PluginSystem, PolyStar, Polygon, PostProcessVolume, PropertyTrack, RENDER_PASS_NAME_PREFIX, RENDER_PREFER_LOOKUP_TEXTURE, RUNTIME_ENV, RandomSetValue, RandomValue, RandomVectorValue, RenderFrame, RenderPass, RenderPassAttachmentStorageType, RenderPassDestroyAttachmentType, RenderPassPriorityNormal, RenderPassPriorityPostprocess, RenderPassPriorityPrepare, RenderTargetHandle, RenderTextureFormat, Renderbuffer, Renderer, RendererComponent, RuntimeClip, SEMANTIC_MAIN_PRE_COLOR_ATTACHMENT_0, SEMANTIC_MAIN_PRE_COLOR_ATTACHMENT_SIZE_0, SEMANTIC_PRE_COLOR_ATTACHMENT_0, SEMANTIC_PRE_COLOR_ATTACHMENT_SIZE_0, SPRITE_VERTEX_STRIDE, Scene, SemanticMap, SerializationHelper, Shader, ShaderCompileResultStatus, ShaderFactory, ShaderType, ShaderVariant, ShapeComponent, ShapePath, SpriteColorPlayableAsset, SpriteColorTrack, SpriteComponent, SpriteLoader, StarType, StaticValue, SubCompositionPlayableAsset, SubCompositionTrack, TEMPLATE_USE_OFFSCREEN_CANVAS, TEXTURE_UNIFORM_MAP, TextComponent, TextComponentBase, TextLayout, TextLoader, TextStyle, Texture, TextureFactory, TextureLoadAction, TextureSourceType, TextureStoreAction, ThreeComposition, ThreeDisplayObject, ThreeEngine, ThreeMaterial, ThreeSpriteComponent, ThreeTextComponent, ThreeTexture, Ticker, TimelineAsset, TimelineClip, TimelinePlayable, TrackAsset, TrackSortWrapper, TrackType, Transform, TransformAnimationPlayable, TransformPlayableAsset, TransformTrack, VFXItem, ValueGetter, Vector2Curve, Vector2PropertyPlayableAsset, Vector2PropertyTrack, Vector4Curve, Vector4PropertyPlayableAsset, Vector4PropertyTrack, addByOrder, addItem, addItemWithOrder, applyMixins, assertExist, asserts, base64ToFile, blend, buildLine, calculateTranslation, canvasPool, closePointEps, colorGradingFrag, colorStopsFromGradient, colorToArr$1 as colorToArr, combineImageTemplate, createCopyShader, createGLContext, createKeyFrameMeta, createShape, createValueGetter, curveEps, decimalEqual, defaultPlugins, deserializeMipmapTexture, earcut, effectsClass, effectsClassStore, enlargeBuffer, ensureFixedNumber, ensureVec3, filterItemsByRenderLevel, findPreviousRenderPass, gaussianDown_frag as gaussianDownFrag, gaussianDownHFrag, gaussianDownVFrag, gaussianUpFrag, generateEmptyTypedArray, generateGUID, generateHalfFloatTexture, generateTransparentTexture, generateWhiteTexture, getBackgroundImage, getColorFromGradientStops, getConfig, getDefaultTextureFactory, getGeometryByShape, getGeometryTriangles, getKTXTextureOptions, getKeyFrameMetaByRawValue, getMergedStore, getParticleMeshShader, getPixelRatio, getPreMultiAlpha, getStandardComposition, getStandardImage, getStandardItem, getStandardJSON, getTextureSize, glContext, glType2VertexFormatType, gpuTimer, imageDataFromColor, imageDataFromGradient, initErrors, initGLContext, integrate, interpolateColor, isAlipayMiniApp, isAndroid, isArray, isCanvas, isFunction, isIOS, isIOSByUA, isMiniProgram, isObject, isSimulatorCellPhone, isString, isUniformStruct, isUniformStructArray, isValidFontFamily, isWebGL2, isWechatMiniApp, itemFrag, itemFrame_frag as itemFrameFrag, itemVert, loadAVIFOptional, loadBinary, loadBlob, loadImage, loadMedia, loadVideo, loadWebPOptional, logger, index as math, maxSpriteMeshItemCount, modifyMaxKeyframeShader, nearestPowerOfTwo, noop, normalizeColor, numberToFix, parsePercent$1 as parsePercent, particleFrag, particleOriginTranslateMap$1 as particleOriginTranslateMap, particleUniformTypeMap, particleVert, passRenderLevel, pluginLoaderMap, randomInRange, registerPlugin, removeItem, rotateVec2, screenMeshVert, serialize, setBlendMode, setConfig, setDefaultTextureFactory, setMaskMode, setMaxSpriteMeshItemCount, setRayFromCamera, setSideMode, setSpriteMeshMaxItemCountByGPU, setUniformValue, sortByOrder, index$1 as spec, thresholdFrag, throwDestroyedError, trailVert, translatePoint, trianglesFromRect, unregisterPlugin, valIfUndefined, value, valueDefine, vecFill, vecMulCombine, version, vertexFormatType2GLType };
+export { AbstractPlugin, ActivationPlayable, ActivationPlayableAsset, ActivationTrack, AnimationClip, AnimationClipPlayable, Asset, AssetLoader, AssetManager, AssetService, BYTES_TYPE_MAP, BaseRenderComponent, Behaviour, BezierCurve, BezierCurvePath, BezierCurveQuat, BinaryAsset, COMPRESSED_TEXTURE, CONSTANT_MAP_BLEND, CONSTANT_MAP_DEPTH, CONSTANT_MAP_STENCIL_FUNC, CONSTANT_MAP_STENCIL_OP, COPY_FRAGMENT_SHADER, COPY_MESH_SHADER_ID, COPY_VERTEX_SHADER, CalculateLoader, Camera, CameraController, CameraVFXItemLoader, ColorCurve, ColorPropertyPlayableAsset, ColorPropertyTrack, Component, Composition, CompositionComponent, DEFAULT_FONTS, DEFAULT_FPS, Database, DestroyOptions, Downloader, EFFECTS_COPY_MESH_NAME, EVENT_TYPE_CLICK, EVENT_TYPE_TOUCH_END, EVENT_TYPE_TOUCH_MOVE, EVENT_TYPE_TOUCH_START, EffectComponent, EffectsObject, EffectsPackage, Ellipse, Engine, EventEmitter, EventSystem, Fake3DAnimationMode, Fake3DComponent, FilterMode, Float16ArrayWrapper, FloatPropertyPlayableAsset, FloatPropertyTrack, Framebuffer, GLSLVersion, GPUCapability, Geometry, GlobalUniforms, GradientValue, GraphicsPath, HELP_LINK, HitTestType, InteractComponent, InteractLoader, InteractMesh, Item, KTXTexture, LineSegments, LinearValue, MaskMode, MaskProcessor, MaskRefManager, Material, MaterialDataBlock, MaterialRenderType, MaterialTrack, Mesh, MeshCollider, ObjectBindingTrack, OrderType, PLAYER_OPTIONS_ENV_EDITOR, POST_PROCESS_SETTINGS, ParticleBehaviourPlayable, ParticleBehaviourPlayableAsset, ParticleLoader, ParticleMesh, ParticleSystem, ParticleSystemRenderer, ParticleTrack, PassTextureCache, PathSegments, PluginSystem, PolyStar, Polygon, PostProcessVolume, PropertyTrack, RENDER_PASS_NAME_PREFIX, RENDER_PREFER_LOOKUP_TEXTURE, RUNTIME_ENV, RandomSetValue, RandomValue, RandomVectorValue, RenderFrame, RenderPass, RenderPassAttachmentStorageType, RenderPassDestroyAttachmentType, RenderPassPriorityNormal, RenderPassPriorityPostprocess, RenderPassPriorityPrepare, RenderTargetHandle, RenderTextureFormat, Renderbuffer, Renderer, RendererComponent, RuntimeClip, SEMANTIC_MAIN_PRE_COLOR_ATTACHMENT_0, SEMANTIC_MAIN_PRE_COLOR_ATTACHMENT_SIZE_0, SEMANTIC_PRE_COLOR_ATTACHMENT_0, SEMANTIC_PRE_COLOR_ATTACHMENT_SIZE_0, SPRITE_VERTEX_STRIDE, Scene, SemanticMap, SerializationHelper, Shader, ShaderCompileResultStatus, ShaderFactory, ShaderType, ShaderVariant, ShapeComponent, ShapePath, SpriteColorPlayableAsset, SpriteColorTrack, SpriteComponent, SpriteLoader, StarType, StaticValue, SubCompositionPlayableAsset, SubCompositionTrack, TEMPLATE_USE_OFFSCREEN_CANVAS, TEXTURE_UNIFORM_MAP, TextComponent, TextComponentBase, TextLayout, TextLoader, TextStyle, Texture, TextureFactory, TextureLoadAction, TextureSourceType, TextureStoreAction, ThreeComposition, ThreeDisplayObject, ThreeEngine, ThreeMaterial, ThreeSpriteComponent, ThreeTextComponent, ThreeTexture, Ticker, TimelineAsset, TimelineClip, TimelinePlayable, TrackAsset, TrackSortWrapper, TrackType, Transform, TransformAnimationPlayable, TransformPlayableAsset, TransformTrack, VFXItem, ValueGetter, Vector2Curve, Vector2PropertyPlayableAsset, Vector2PropertyTrack, Vector4Curve, Vector4PropertyPlayableAsset, Vector4PropertyTrack, addByOrder, addItem, addItemWithOrder, applyMixins, assertExist, asserts, base64ToFile, blend, buildLine, calculateTranslation, canvasPool, closePointEps, colorGradingFrag, colorStopsFromGradient, colorToArr$1 as colorToArr, combineImageTemplate, createCopyShader, createGLContext, createKeyFrameMeta, createShape, createValueGetter, curveEps, decimalEqual, defaultPlugins, deserializeMipmapTexture, earcut, effectsClass, effectsClassStore, enlargeBuffer, ensureFixedNumber, ensureVec3, findPreviousRenderPass, gaussianDown_frag as gaussianDownFrag, gaussianDownHFrag, gaussianDownVFrag, gaussianUpFrag, generateEmptyTypedArray, generateGUID, generateHalfFloatTexture, generateTransparentTexture, generateWhiteTexture, getBackgroundImage, getColorFromGradientStops, getConfig, getDefaultTextureFactory, getGeometryByShape, getGeometryTriangles, getKTXTextureOptions, getKeyFrameMetaByRawValue, getMergedStore, getParticleMeshShader, getPixelRatio, getPreMultiAlpha, getStandardComposition, getStandardImage, getStandardItem, getStandardJSON, getTextureSize, glContext, glType2VertexFormatType, gpuTimer, imageDataFromColor, imageDataFromGradient, initErrors, initGLContext, integrate, interpolateColor, isAlipayMiniApp, isAndroid, isArray, isCanvas, isFunction, isIOS, isIOSByUA, isMiniProgram, isObject, isSimulatorCellPhone, isString, isUniformStruct, isUniformStructArray, isValidFontFamily, isWebGL2, isWechatMiniApp, itemFrag, itemFrame_frag as itemFrameFrag, itemVert, loadAVIFOptional, loadBinary, loadBlob, loadImage, loadMedia, loadVideo, loadWebPOptional, logger, index as math, maxSpriteMeshItemCount, modifyMaxKeyframeShader, nearestPowerOfTwo, noop, normalizeColor, numberToFix, parsePercent$1 as parsePercent, particleFrag, particleOriginTranslateMap$1 as particleOriginTranslateMap, particleUniformTypeMap, particleVert, passRenderLevel, pluginLoaderMap, randomInRange, registerPlugin, removeItem, rotateVec2, screenMeshVert, serialize, setBlendMode, setConfig, setDefaultTextureFactory, setMaskMode, setMaxSpriteMeshItemCount, setRayFromCamera, setSideMode, setSpriteMeshMaxItemCountByGPU, setUniformValue, sortByOrder, index$1 as spec, thresholdFrag, throwDestroyedError, trailVert, translatePoint, trianglesFromRect, unregisterPlugin, valIfUndefined, value, valueDefine, vecFill, vecMulCombine, version, vertexFormatType2GLType };
 //# sourceMappingURL=index.mjs.map