@galacean/engine-core 1.0.0-beta.7 → 1.0.0-beta.8

package/dist/module.js

@@ -9513,11 +9513,11 @@ var camera_declare = "#define GLSLIFY 1\nuniform vec3 camera_Position;"; // esli
 
 var common = "#define GLSLIFY 1\n#define PI 3.14159265359\n#define RECIPROCAL_PI 0.31830988618\n#define EPSILON 1e-6\n#define LOG2 1.442695\n#define saturate( a ) clamp( a, 0.0, 1.0 )\nfloat pow2(float x){return x*x;}vec4 RGBMToLinear(vec4 value,float maxRange){return vec4(value.rgb*value.a*maxRange,1.0);}vec4 gammaToLinear(vec4 srgbIn){return vec4(pow(srgbIn.rgb,vec3(2.2)),srgbIn.a);}vec4 linearToGamma(vec4 linearIn){return vec4(pow(linearIn.rgb,vec3(1.0/2.2)),linearIn.a);}\n#ifdef GRAPHICS_API_WEBGL2\n#define INVERSE_MAT(mat) inverse(mat)\n#else\nmat2 inverseMat(mat2 m){return mat2(m[1][1],-m[0][1],-m[1][0],m[0][0])/(m[0][0]*m[1][1]-m[0][1]*m[1][0]);}mat3 inverseMat(mat3 m){float a00=m[0][0],a01=m[0][1],a02=m[0][2];float a10=m[1][0],a11=m[1][1],a12=m[1][2];float a20=m[2][0],a21=m[2][1],a22=m[2][2];float b01=a22*a11-a12*a21;float b11=-a22*a10+a12*a20;float b21=a21*a10-a11*a20;float det=a00*b01+a01*b11+a02*b21;return mat3(b01,(-a22*a01+a02*a21),(a12*a01-a02*a11),b11,(a22*a00-a02*a20),(-a12*a00+a02*a10),b21,(-a21*a00+a01*a20),(a11*a00-a01*a10))/det;}mat4 inverseMat(mat4 m){float a00=m[0][0],a01=m[0][1],a02=m[0][2],a03=m[0][3],a10=m[1][0],a11=m[1][1],a12=m[1][2],a13=m[1][3],a20=m[2][0],a21=m[2][1],a22=m[2][2],a23=m[2][3],a30=m[3][0],a31=m[3][1],a32=m[3][2],a33=m[3][3],b00=a00*a11-a01*a10,b01=a00*a12-a02*a10,b02=a00*a13-a03*a10,b03=a01*a12-a02*a11,b04=a01*a13-a03*a11,b05=a02*a13-a03*a12,b06=a20*a31-a21*a30,b07=a20*a32-a22*a30,b08=a20*a33-a23*a30,b09=a21*a32-a22*a31,b10=a21*a33-a23*a31,b11=a22*a33-a23*a32,det=b00*b11-b01*b10+b02*b09+b03*b08-b04*b07+b05*b06;return mat4(a11*b11-a12*b10+a13*b09,a02*b10-a01*b11-a03*b09,a31*b05-a32*b04+a33*b03,a22*b04-a21*b05-a23*b03,a12*b08-a10*b11-a13*b07,a00*b11-a02*b08+a03*b07,a32*b02-a30*b05-a33*b01,a20*b05-a22*b02+a23*b01,a10*b10-a11*b08+a13*b06,a01*b08-a00*b10-a03*b06,a30*b04-a31*b02+a33*b00,a21*b02-a20*b04-a23*b00,a11*b07-a10*b09-a12*b06,a00*b09-a01*b07+a02*b06,a31*b01-a30*b03-a32*b00,a20*b03-a21*b01+a22*b00)/det;}\n#define INVERSE_MAT(mat) inverseMat(mat)\n#endif\n"; // eslint-disable-line
 
-var common_vert = "#define GLSLIFY 1\nattribute vec3 POSITION;\n#ifdef RENDERER_HAS_UV\nattribute vec2 TEXCOORD_0;\n#endif\n#ifdef RENDERER_HAS_UV1\nattribute vec2 TEXCOORD_1;\n#endif\n#ifdef RENDERER_HAS_SKIN\nattribute vec4 JOINTS_0;attribute vec4 WEIGHTS_0;\n#ifdef RENDERER_USE_JOINT_TEXTURE\nuniform sampler2D renderer_JointSampler;uniform float renderer_JointCount;mat4 getJointMatrix(sampler2D smp,float index){float base=index/renderer_JointCount;float hf=0.5/renderer_JointCount;float v=base+hf;vec4 m0=texture2D(smp,vec2(0.125,v));vec4 m1=texture2D(smp,vec2(0.375,v));vec4 m2=texture2D(smp,vec2(0.625,v));vec4 m3=texture2D(smp,vec2(0.875,v));return mat4(m0,m1,m2,m3);}\n#else\nuniform mat4 renderer_JointMatrix[RENDERER_JOINTS_NUM];\n#endif\n#endif\n#ifdef RENDERER_HAS_VERTEXCOLOR\nattribute vec4 COLOR_0;\n#endif\n#include <transform_declare>\n#include <camera_declare>\nuniform vec4 material_TilingOffset;\n#ifndef MATERIAL_OMIT_NORMAL\n#ifdef RENDERER_HAS_NORMAL\nattribute vec3 NORMAL;\n#endif\n#ifdef RENDERER_HAS_TANGENT\nattribute vec4 TANGENT;\n#endif\n#endif\n"; // eslint-disable-line
+var common_vert = "#define GLSLIFY 1\nattribute vec3 POSITION;\n#ifdef RENDERER_HAS_UV\nattribute vec2 TEXCOORD_0;\n#endif\n#ifdef RENDERER_HAS_UV1\nattribute vec2 TEXCOORD_1;\n#endif\n#ifdef RENDERER_HAS_SKIN\nattribute vec4 JOINTS_0;attribute vec4 WEIGHTS_0;\n#ifdef RENDERER_USE_JOINT_TEXTURE\nuniform sampler2D renderer_JointSampler;uniform float renderer_JointCount;mat4 getJointMatrix(sampler2D smp,float index){float base=index/renderer_JointCount;float hf=0.5/renderer_JointCount;float v=base+hf;vec4 m0=texture2D(smp,vec2(0.125,v));vec4 m1=texture2D(smp,vec2(0.375,v));vec4 m2=texture2D(smp,vec2(0.625,v));vec4 m3=texture2D(smp,vec2(0.875,v));return mat4(m0,m1,m2,m3);}\n#else\nuniform mat4 renderer_JointMatrix[RENDERER_JOINTS_NUM];\n#endif\n#endif\n#ifdef RENDERER_ENABLE_VERTEXCOLOR\nattribute vec4 COLOR_0;\n#endif\n#include <transform_declare>\n#include <camera_declare>\nuniform vec4 material_TilingOffset;\n#ifndef MATERIAL_OMIT_NORMAL\n#ifdef RENDERER_HAS_NORMAL\nattribute vec3 NORMAL;\n#endif\n#ifdef RENDERER_HAS_TANGENT\nattribute vec4 TANGENT;\n#endif\n#endif\n"; // eslint-disable-line
 
 var transform_declare = "#define GLSLIFY 1\nuniform mat4 renderer_LocalMat;uniform mat4 renderer_ModelMat;uniform mat4 camera_ViewMat;uniform mat4 camera_ProjMat;uniform mat4 renderer_MVMat;uniform mat4 renderer_MVPMat;uniform mat4 renderer_NormalMat;"; // eslint-disable-line
 
-var color_share = "#define GLSLIFY 1\n#ifdef RENDERER_HAS_VERTEXCOLOR\nvarying vec4 v_color;\n#endif\n"; // eslint-disable-line
+var color_share = "#define GLSLIFY 1\n#ifdef RENDERER_ENABLE_VERTEXCOLOR\nvarying vec4 v_color;\n#endif\n"; // eslint-disable-line
 
 var FogFragmentDeclaration = "#define GLSLIFY 1\n#if SCENE_FOG_MODE != 0\nvarying vec3 v_positionVS;uniform vec4 scene_FogColor;uniform vec4 scene_FogParams;float ComputeFogIntensity(float fogDepth){\n#if SCENE_FOG_MODE == 1\nreturn clamp(fogDepth*scene_FogParams.x+scene_FogParams.y,0.0,1.0);\n#elif SCENE_FOG_MODE == 2\nreturn clamp(exp2(-fogDepth*scene_FogParams.z),0.0,1.0);\n#elif SCENE_FOG_MODE == 3\nfloat factor=fogDepth*scene_FogParams.w;return clamp(exp2(-factor*factor),0.0,1.0);\n#endif\n}\n#endif\n"; // eslint-disable-line
 
@@ -9537,7 +9537,7 @@ var blendShape_input = "#define GLSLIFY 1\n#ifdef RENDERER_HAS_BLENDSHAPE\n#ifde
 
 var blendShape_vert = "#define GLSLIFY 1\n#ifdef RENDERER_HAS_BLENDSHAPE\n#ifdef RENDERER_BLENDSHAPE_USE_TEXTURE\nint vertexOffset=gl_VertexID*renderer_BlendShapeTextureInfo.x;for(int i=0;i<RENDERER_BLENDSHAPE_COUNT;i++){int vertexElementOffset=vertexOffset;float weight=renderer_BlendShapeWeights[i];position.xyz+=getBlendShapeVertexElement(i,vertexElementOffset)*weight;\n#ifndef MATERIAL_OMIT_NORMAL\n#if defined( RENDERER_HAS_NORMAL ) && defined( RENDERER_BLENDSHAPE_HAS_NORMAL )\nvertexElementOffset+=1;normal+=getBlendShapeVertexElement(i,vertexElementOffset)*weight;\n#endif\n#if defined( RENDERER_HAS_TANGENT ) && defined(RENDERER_BLENDSHAPE_HAS_TANGENT) && ( defined(MATERIAL_HAS_NORMALTEXTURE) || defined(MATERIAL_HAS_CLEAR_COAT_NORMAL_TEXTURE) )\nvertexElementOffset+=1;tangent.xyz+=getBlendShapeVertexElement(i,vertexElementOffset)*weight;\n#endif\n#endif\n}\n#else\nposition.xyz+=POSITION_BS0*renderer_BlendShapeWeights[0];position.xyz+=POSITION_BS1*renderer_BlendShapeWeights[1];\n#if defined( RENDERER_BLENDSHAPE_HAS_NORMAL ) && defined( RENDERER_BLENDSHAPE_HAS_TANGENT )\n#ifndef MATERIAL_OMIT_NORMAL\n#ifdef RENDERER_HAS_NORMAL\nnormal+=NORMAL_BS0*renderer_BlendShapeWeights[0];normal+=NORMAL_BS1*renderer_BlendShapeWeights[1];\n#endif\n#if defined( RENDERER_HAS_TANGENT ) && ( defined(MATERIAL_HAS_NORMALTEXTURE) || defined(MATERIAL_HAS_CLEAR_COAT_NORMAL_TEXTURE) )\ntangent.xyz+=TANGENT_BS0*renderer_BlendShapeWeights[0];tangent.xyz+=TANGENT_BS1*renderer_BlendShapeWeights[1];\n#endif\n#endif\n#else\n#if defined( RENDERER_BLENDSHAPE_HAS_NORMAL ) || defined( RENDERER_BLENDSHAPE_HAS_TANGENT )\n#ifndef MATERIAL_OMIT_NORMAL\nposition.xyz+=POSITION_BS2*renderer_BlendShapeWeights[2];position.xyz+=POSITION_BS3*renderer_BlendShapeWeights[3];\n#if defined( RENDERER_BLENDSHAPE_HAS_NORMAL ) && defined( RENDERER_HAS_NORMAL )\nnormal+=NORMAL_BS0*renderer_BlendShapeWeights[0];normal+=NORMAL_BS1*renderer_BlendShapeWeights[1];normal+=NORMAL_BS2*renderer_BlendShapeWeights[2];normal+=NORMAL_BS3*renderer_BlendShapeWeights[3];\n#endif\n#if defined(RENDERER_BLENDSHAPE_HAS_TANGENT) && defined( RENDERER_HAS_TANGENT ) && ( defined(MATERIAL_HAS_NORMALTEXTURE) || defined(MATERIAL_HAS_CLEAR_COAT_NORMAL_TEXTURE) )\ntangent.xyz+=TANGENT_BS0*renderer_BlendShapeWeights[0];tangent.xyz+=TANGENT_BS1*renderer_BlendShapeWeights[1];tangent.xyz+=TANGENT_BS2*renderer_BlendShapeWeights[2];tangent.xyz+=TANGENT_BS3*renderer_BlendShapeWeights[3];\n#endif\n#endif\n#else\nposition.xyz+=POSITION_BS2*renderer_BlendShapeWeights[2];position.xyz+=POSITION_BS3*renderer_BlendShapeWeights[3];position.xyz+=POSITION_BS4*renderer_BlendShapeWeights[4];position.xyz+=POSITION_BS5*renderer_BlendShapeWeights[5];position.xyz+=POSITION_BS6*renderer_BlendShapeWeights[6];position.xyz+=POSITION_BS7*renderer_BlendShapeWeights[7];\n#endif\n#endif\n#endif\n#endif\n"; // eslint-disable-line
 
-var color_vert = "#define GLSLIFY 1\n#ifdef RENDERER_HAS_VERTEXCOLOR\nv_color=COLOR_0;\n#endif\n"; // eslint-disable-line
+var color_vert = "#define GLSLIFY 1\n#ifdef RENDERER_ENABLE_VERTEXCOLOR\nv_color=COLOR_0;\n#endif\n"; // eslint-disable-line
 
 var FogVertex = "#define GLSLIFY 1\n#if SCENE_FOG_MODE != 0\nvec4 positionVS=renderer_MVMat*position;v_positionVS=positionVS.xyz/positionVS.w;\n#endif\n"; // eslint-disable-line
 
@@ -9557,7 +9557,7 @@ var light_frag_define = "#define GLSLIFY 1\n#ifdef SCENE_DIRECT_LIGHT_COUNT\nstr
 
 var mobile_material_frag = "#define GLSLIFY 1\nuniform vec4 material_EmissiveColor;uniform vec4 material_BaseColor;uniform vec4 material_SpecularColor;uniform float material_Shininess;uniform float material_NormalIntensity;uniform float material_AlphaCutoff;\n#ifdef MATERIAL_HAS_EMISSIVETEXTURE\nuniform sampler2D material_EmissiveTexture;\n#endif\n#ifdef MATERIAL_HAS_BASETEXTURE\nuniform sampler2D material_BaseTexture;\n#endif\n#ifdef MATERIAL_HAS_SPECULAR_TEXTURE\nuniform sampler2D material_SpecularTexture;\n#endif\n#ifdef MATERIAL_HAS_NORMALTEXTURE\nuniform sampler2D material_NormalTexture;\n#endif\n"; // eslint-disable-line
 
-var begin_mobile_frag = "#define GLSLIFY 1\nvec4 ambient=vec4(0.0);vec4 emission=material_EmissiveColor;vec4 diffuse=material_BaseColor;vec4 specular=material_SpecularColor;\n#ifdef MATERIAL_HAS_EMISSIVETEXTURE\nvec4 emissiveTextureColor=texture2D(material_EmissiveTexture,v_uv);\n#ifndef ENGINE_IS_COLORSPACE_GAMMA\nemissiveTextureColor=gammaToLinear(emissiveTextureColor);\n#endif\nemission*=emissiveTextureColor;\n#endif\n#ifdef MATERIAL_HAS_BASETEXTURE\nvec4 diffuseTextureColor=texture2D(material_BaseTexture,v_uv);\n#ifndef ENGINE_IS_COLORSPACE_GAMMA\ndiffuseTextureColor=gammaToLinear(diffuseTextureColor);\n#endif\ndiffuse*=diffuseTextureColor;\n#endif\n#ifdef RENDERER_HAS_VERTEXCOLOR\ndiffuse*=v_color;\n#endif\n#ifdef MATERIAL_HAS_SPECULAR_TEXTURE\nvec4 specularTextureColor=texture2D(material_SpecularTexture,v_uv);\n#ifndef ENGINE_IS_COLORSPACE_GAMMA\nspecularTextureColor=gammaToLinear(specularTextureColor);\n#endif\nspecular*=specularTextureColor;\n#endif\nambient=vec4(scene_EnvMapLight.diffuse*scene_EnvMapLight.diffuseIntensity,1.0)*diffuse;"; // eslint-disable-line
+var begin_mobile_frag = "#define GLSLIFY 1\nvec4 ambient=vec4(0.0);vec4 emission=material_EmissiveColor;vec4 diffuse=material_BaseColor;vec4 specular=material_SpecularColor;\n#ifdef MATERIAL_HAS_EMISSIVETEXTURE\nvec4 emissiveTextureColor=texture2D(material_EmissiveTexture,v_uv);\n#ifndef ENGINE_IS_COLORSPACE_GAMMA\nemissiveTextureColor=gammaToLinear(emissiveTextureColor);\n#endif\nemission*=emissiveTextureColor;\n#endif\n#ifdef MATERIAL_HAS_BASETEXTURE\nvec4 diffuseTextureColor=texture2D(material_BaseTexture,v_uv);\n#ifndef ENGINE_IS_COLORSPACE_GAMMA\ndiffuseTextureColor=gammaToLinear(diffuseTextureColor);\n#endif\ndiffuse*=diffuseTextureColor;\n#endif\n#ifdef RENDERER_ENABLE_VERTEXCOLOR\ndiffuse*=v_color;\n#endif\n#ifdef MATERIAL_HAS_SPECULAR_TEXTURE\nvec4 specularTextureColor=texture2D(material_SpecularTexture,v_uv);\n#ifndef ENGINE_IS_COLORSPACE_GAMMA\nspecularTextureColor=gammaToLinear(specularTextureColor);\n#endif\nspecular*=specularTextureColor;\n#endif\nambient=vec4(scene_EnvMapLight.diffuse*scene_EnvMapLight.diffuseIntensity,1.0)*diffuse;"; // eslint-disable-line
 
 var begin_viewdir_frag = "#define GLSLIFY 1\n#ifdef MATERIAL_NEED_WORLD_POS\nvec3 V=normalize(camera_Position-v_pos);\n#endif\n"; // eslint-disable-line
 
@@ -9597,7 +9597,7 @@ var noise_simplex_4D = "#define GLSLIFY 1\nvec4 grad4(float j,vec4 ip){const vec
 
 var pbr_frag_define = "#define GLSLIFY 1\nuniform float material_AlphaCutoff;uniform vec4 material_BaseColor;uniform float material_Metal;uniform float material_Roughness;uniform float material_IOR;uniform vec3 material_PBRSpecularColor;uniform float material_Glossiness;uniform vec3 material_EmissiveColor;\n#ifdef MATERIAL_ENABLE_CLEAR_COAT\nuniform float material_ClearCoat;uniform float material_ClearCoatRoughness;\n#endif\nuniform float material_NormalIntensity;uniform float material_OcclusionIntensity;uniform float material_OcclusionTextureCoord;\n#ifdef MATERIAL_HAS_BASETEXTURE\nuniform sampler2D material_BaseTexture;\n#endif\n#ifdef MATERIAL_HAS_NORMALTEXTURE\nuniform sampler2D material_NormalTexture;\n#endif\n#ifdef MATERIAL_HAS_EMISSIVETEXTURE\nuniform sampler2D material_EmissiveTexture;\n#endif\n#ifdef MATERIAL_HAS_ROUGHNESS_METALLIC_TEXTURE\nuniform sampler2D material_RoughnessMetallicTexture;\n#endif\n#ifdef MATERIAL_HAS_SPECULAR_GLOSSINESS_TEXTURE\nuniform sampler2D material_SpecularGlossinessTexture;\n#endif\n#ifdef MATERIAL_HAS_OCCLUSION_TEXTURE\nuniform sampler2D material_OcclusionTexture;\n#endif\n#ifdef MATERIAL_HAS_CLEAR_COAT_TEXTURE\nuniform sampler2D material_ClearCoatTexture;\n#endif\n#ifdef MATERIAL_HAS_CLEAR_COAT_ROUGHNESS_TEXTURE\nuniform sampler2D material_ClearCoatRoughnessTexture;\n#endif\n#ifdef MATERIAL_HAS_CLEAR_COAT_NORMAL_TEXTURE\nuniform sampler2D material_ClearCoatNormalTexture;\n#endif\nstruct ReflectedLight{vec3 directDiffuse;vec3 directSpecular;vec3 indirectDiffuse;vec3 indirectSpecular;};struct Geometry{vec3 position;vec3 normal;vec3 viewDir;float dotNV;\n#ifdef MATERIAL_ENABLE_CLEAR_COAT\nvec3 clearCoatNormal;float clearCoatDotNV;\n#endif\n};struct Material{vec3 diffuseColor;float roughness;vec3 specularColor;float opacity;\n#ifdef MATERIAL_ENABLE_CLEAR_COAT\nfloat clearCoat;float clearCoatRoughness;\n#endif\n};"; // eslint-disable-line
 
-var pbr_helper = "#define GLSLIFY 1\n#include <normal_get>\nfloat computeSpecularOcclusion(float ambientOcclusion,float roughness,float dotNV){return saturate(pow(dotNV+ambientOcclusion,exp2(-16.0*roughness-1.0))-1.0+ambientOcclusion);}float getAARoughnessFactor(vec3 normal){\n#ifdef HAS_DERIVATIVES\nvec3 dxy=max(abs(dFdx(normal)),abs(dFdy(normal)));return 0.04+max(max(dxy.x,dxy.y),dxy.z);\n#else\nreturn 0.04;\n#endif\n}void initGeometry(out Geometry geometry){geometry.position=v_pos;geometry.viewDir=normalize(camera_Position-v_pos);\n#if defined(MATERIAL_HAS_NORMALTEXTURE) || defined(MATERIAL_HAS_CLEAR_COAT_NORMAL_TEXTURE)\nmat3 tbn=getTBN();\n#endif\n#ifdef MATERIAL_HAS_NORMALTEXTURE\ngeometry.normal=getNormalByNormalTexture(tbn,material_NormalTexture,material_NormalIntensity,v_uv);\n#else\ngeometry.normal=getNormal();\n#endif\ngeometry.dotNV=saturate(dot(geometry.normal,geometry.viewDir));\n#ifdef MATERIAL_ENABLE_CLEAR_COAT\n#ifdef MATERIAL_HAS_CLEAR_COAT_NORMAL_TEXTURE\ngeometry.clearCoatNormal=getNormalByNormalTexture(tbn,material_ClearCoatNormalTexture,material_NormalIntensity,v_uv);\n#else\ngeometry.clearCoatNormal=getNormal();\n#endif\ngeometry.clearCoatDotNV=saturate(dot(geometry.clearCoatNormal,geometry.viewDir));\n#endif\n}void initMaterial(out Material material,const in Geometry geometry){vec4 baseColor=material_BaseColor;float metal=material_Metal;float roughness=material_Roughness;vec3 specularColor=material_PBRSpecularColor;float glossiness=material_Glossiness;float alphaCutoff=material_AlphaCutoff;float F0=pow2((material_IOR-1.0)/(material_IOR+1.0));\n#ifdef MATERIAL_HAS_BASETEXTURE\nvec4 baseTextureColor=texture2D(material_BaseTexture,v_uv);\n#ifndef ENGINE_IS_COLORSPACE_GAMMA\nbaseTextureColor=gammaToLinear(baseTextureColor);\n#endif\nbaseColor*=baseTextureColor;\n#endif\n#ifdef RENDERER_HAS_VERTEXCOLOR\nbaseColor*=v_color;\n#endif\n#ifdef MATERIAL_IS_ALPHA_CUTOFF\nif(baseColor.a<alphaCutoff){discard;}\n#endif\n#ifdef MATERIAL_HAS_ROUGHNESS_METALLIC_TEXTURE\nvec4 metalRoughMapColor=texture2D(material_RoughnessMetallicTexture,v_uv);roughness*=metalRoughMapColor.g;metal*=metalRoughMapColor.b;\n#endif\n#ifdef MATERIAL_HAS_SPECULAR_GLOSSINESS_TEXTURE\nvec4 specularGlossinessColor=texture2D(material_SpecularGlossinessTexture,v_uv);\n#ifndef ENGINE_IS_COLORSPACE_GAMMA\nspecularGlossinessColor=gammaToLinear(specularGlossinessColor);\n#endif\nspecularColor*=specularGlossinessColor.rgb;glossiness*=specularGlossinessColor.a;\n#endif\n#ifdef IS_METALLIC_WORKFLOW\nmaterial.diffuseColor=baseColor.rgb*(1.0-metal);material.specularColor=mix(vec3(F0),baseColor.rgb,metal);material.roughness=roughness;\n#else\nfloat specularStrength=max(max(specularColor.r,specularColor.g),specularColor.b);material.diffuseColor=baseColor.rgb*(1.0-specularStrength);material.specularColor=specularColor;material.roughness=1.0-glossiness;\n#endif\nmaterial.roughness=max(material.roughness,getAARoughnessFactor(geometry.normal));\n#ifdef MATERIAL_ENABLE_CLEAR_COAT\nmaterial.clearCoat=material_ClearCoat;material.clearCoatRoughness=material_ClearCoatRoughness;\n#ifdef MATERIAL_HAS_CLEAR_COAT_TEXTURE\nmaterial.clearCoat*=texture2D(material_ClearCoatTexture,v_uv).r;\n#endif\n#ifdef MATERIAL_HAS_CLEAR_COAT_ROUGHNESS_TEXTURE\nmaterial.clearCoatRoughness*=texture2D(material_ClearCoatRoughnessTexture,v_uv).g;\n#endif\nmaterial.clearCoat=saturate(material.clearCoat);material.clearCoatRoughness=max(material.clearCoatRoughness,getAARoughnessFactor(geometry.clearCoatNormal));\n#endif\n#ifdef MATERIAL_IS_TRANSPARENT\nmaterial.opacity=baseColor.a;\n#else\nmaterial.opacity=1.0;\n#endif\n}\n#include <brdf>\n#include <direct_irradiance_frag_define>\n#include <ibl_frag_define>\n"; // eslint-disable-line
+var pbr_helper = "#define GLSLIFY 1\n#include <normal_get>\nfloat computeSpecularOcclusion(float ambientOcclusion,float roughness,float dotNV){return saturate(pow(dotNV+ambientOcclusion,exp2(-16.0*roughness-1.0))-1.0+ambientOcclusion);}float getAARoughnessFactor(vec3 normal){\n#ifdef HAS_DERIVATIVES\nvec3 dxy=max(abs(dFdx(normal)),abs(dFdy(normal)));return 0.04+max(max(dxy.x,dxy.y),dxy.z);\n#else\nreturn 0.04;\n#endif\n}void initGeometry(out Geometry geometry){geometry.position=v_pos;geometry.viewDir=normalize(camera_Position-v_pos);\n#if defined(MATERIAL_HAS_NORMALTEXTURE) || defined(MATERIAL_HAS_CLEAR_COAT_NORMAL_TEXTURE)\nmat3 tbn=getTBN();\n#endif\n#ifdef MATERIAL_HAS_NORMALTEXTURE\ngeometry.normal=getNormalByNormalTexture(tbn,material_NormalTexture,material_NormalIntensity,v_uv);\n#else\ngeometry.normal=getNormal();\n#endif\ngeometry.dotNV=saturate(dot(geometry.normal,geometry.viewDir));\n#ifdef MATERIAL_ENABLE_CLEAR_COAT\n#ifdef MATERIAL_HAS_CLEAR_COAT_NORMAL_TEXTURE\ngeometry.clearCoatNormal=getNormalByNormalTexture(tbn,material_ClearCoatNormalTexture,material_NormalIntensity,v_uv);\n#else\ngeometry.clearCoatNormal=getNormal();\n#endif\ngeometry.clearCoatDotNV=saturate(dot(geometry.clearCoatNormal,geometry.viewDir));\n#endif\n}void initMaterial(out Material material,const in Geometry geometry){vec4 baseColor=material_BaseColor;float metal=material_Metal;float roughness=material_Roughness;vec3 specularColor=material_PBRSpecularColor;float glossiness=material_Glossiness;float alphaCutoff=material_AlphaCutoff;float F0=pow2((material_IOR-1.0)/(material_IOR+1.0));\n#ifdef MATERIAL_HAS_BASETEXTURE\nvec4 baseTextureColor=texture2D(material_BaseTexture,v_uv);\n#ifndef ENGINE_IS_COLORSPACE_GAMMA\nbaseTextureColor=gammaToLinear(baseTextureColor);\n#endif\nbaseColor*=baseTextureColor;\n#endif\n#ifdef RENDERER_ENABLE_VERTEXCOLOR\nbaseColor*=v_color;\n#endif\n#ifdef MATERIAL_IS_ALPHA_CUTOFF\nif(baseColor.a<alphaCutoff){discard;}\n#endif\n#ifdef MATERIAL_HAS_ROUGHNESS_METALLIC_TEXTURE\nvec4 metalRoughMapColor=texture2D(material_RoughnessMetallicTexture,v_uv);roughness*=metalRoughMapColor.g;metal*=metalRoughMapColor.b;\n#endif\n#ifdef MATERIAL_HAS_SPECULAR_GLOSSINESS_TEXTURE\nvec4 specularGlossinessColor=texture2D(material_SpecularGlossinessTexture,v_uv);\n#ifndef ENGINE_IS_COLORSPACE_GAMMA\nspecularGlossinessColor=gammaToLinear(specularGlossinessColor);\n#endif\nspecularColor*=specularGlossinessColor.rgb;glossiness*=specularGlossinessColor.a;\n#endif\n#ifdef IS_METALLIC_WORKFLOW\nmaterial.diffuseColor=baseColor.rgb*(1.0-metal);material.specularColor=mix(vec3(F0),baseColor.rgb,metal);material.roughness=roughness;\n#else\nfloat specularStrength=max(max(specularColor.r,specularColor.g),specularColor.b);material.diffuseColor=baseColor.rgb*(1.0-specularStrength);material.specularColor=specularColor;material.roughness=1.0-glossiness;\n#endif\nmaterial.roughness=max(material.roughness,getAARoughnessFactor(geometry.normal));\n#ifdef MATERIAL_ENABLE_CLEAR_COAT\nmaterial.clearCoat=material_ClearCoat;material.clearCoatRoughness=material_ClearCoatRoughness;\n#ifdef MATERIAL_HAS_CLEAR_COAT_TEXTURE\nmaterial.clearCoat*=texture2D(material_ClearCoatTexture,v_uv).r;\n#endif\n#ifdef MATERIAL_HAS_CLEAR_COAT_ROUGHNESS_TEXTURE\nmaterial.clearCoatRoughness*=texture2D(material_ClearCoatRoughnessTexture,v_uv).g;\n#endif\nmaterial.clearCoat=saturate(material.clearCoat);material.clearCoatRoughness=max(material.clearCoatRoughness,getAARoughnessFactor(geometry.clearCoatNormal));\n#endif\n#ifdef MATERIAL_IS_TRANSPARENT\nmaterial.opacity=baseColor.a;\n#else\nmaterial.opacity=1.0;\n#endif\n}\n#include <brdf>\n#include <direct_irradiance_frag_define>\n#include <ibl_frag_define>\n"; // eslint-disable-line
 
 var brdf = "#define GLSLIFY 1\nfloat F_Schlick(float dotLH){return 0.04+0.96*(pow(1.0-dotLH,5.0));}vec3 F_Schlick(vec3 specularColor,float dotLH){float fresnel=exp2((-5.55473*dotLH-6.98316)*dotLH);return(1.0-specularColor)*fresnel+specularColor;}float G_GGX_SmithCorrelated(float alpha,float dotNL,float dotNV){float a2=pow2(alpha);float gv=dotNL*sqrt(a2+(1.0-a2)*pow2(dotNV));float gl=dotNV*sqrt(a2+(1.0-a2)*pow2(dotNL));return 0.5/max(gv+gl,EPSILON);}float D_GGX(float alpha,float dotNH){float a2=pow2(alpha);float denom=pow2(dotNH)*(a2-1.0)+1.0;return RECIPROCAL_PI*a2/pow2(denom);}vec3 BRDF_Specular_GGX(vec3 incidentDirection,vec3 viewDir,vec3 normal,vec3 specularColor,float roughness){float alpha=pow2(roughness);vec3 halfDir=normalize(incidentDirection+viewDir);float dotNL=saturate(dot(normal,incidentDirection));float dotNV=saturate(dot(normal,viewDir));float dotNH=saturate(dot(normal,halfDir));float dotLH=saturate(dot(incidentDirection,halfDir));vec3 F=F_Schlick(specularColor,dotLH);float G=G_GGX_SmithCorrelated(alpha,dotNL,dotNV);float D=D_GGX(alpha,dotNH);return F*(G*D);}vec3 BRDF_Diffuse_Lambert(vec3 diffuseColor){return RECIPROCAL_PI*diffuseColor;}"; // eslint-disable-line
 
@@ -11172,8 +11172,10 @@ SimpleSpriteAssembler = __decorate([
         _this = Renderer.call(this, entity) || this;
         /** The mask layers the sprite mask influence to. */ _this.influenceLayers = SpriteMaskLayer.Everything;
         _this._sprite = null;
-        _this._width = undefined;
-        _this._height = undefined;
+        _this._automaticWidth = 0;
+        _this._automaticHeight = 0;
+        _this._customWidth = undefined;
+        _this._customHeight = undefined;
         _this._flipX = false;
         _this._flipY = false;
         _this._alphaCutoff = 0.5;
@@ -11193,12 +11195,11 @@ SimpleSpriteAssembler = __decorate([
     /**
    * @internal
    */ _proto._updateBounds = function _updateBounds(worldBounds) {
-        var _this_sprite;
-        if (!((_this_sprite = this.sprite) == null ? void 0 : _this_sprite.texture) || !this.width || !this.height) {
+        if (this.sprite) {
+            SimpleSpriteAssembler.updatePositions(this);
+        } else {
             worldBounds.min.set(0, 0, 0);
             worldBounds.max.set(0, 0, 0);
-        } else {
-            SimpleSpriteAssembler.updatePositions(this);
         }
     };
     /**
@@ -11209,12 +11210,12 @@ SimpleSpriteAssembler = __decorate([
         if (!((_this_sprite = this.sprite) == null ? void 0 : _this_sprite.texture) || !this.width || !this.height) {
             return;
         }
-        // Update position.
+        // Update position
         if (this._dirtyUpdateFlag & RendererUpdateFlags.WorldVolume) {
             SimpleSpriteAssembler.updatePositions(this);
             this._dirtyUpdateFlag &= ~RendererUpdateFlags.WorldVolume;
         }
-        // Update uv.
+        // Update uv
         if (this._dirtyUpdateFlag & 0x2) {
             SimpleSpriteAssembler.updateUVs(this);
             this._dirtyUpdateFlag &= ~0x2;
@@ -11237,11 +11238,27 @@ SimpleSpriteAssembler = __decorate([
         this._sprite = null;
         this._verticesData = null;
     };
+    _proto._calDefaultSize = function _calDefaultSize() {
+        var sprite = this._sprite;
+        if (sprite) {
+            this._automaticWidth = sprite.width;
+            this._automaticHeight = sprite.height;
+        } else {
+            this._automaticWidth = this._automaticHeight = 0;
+        }
+        this._dirtyUpdateFlag &= ~0x4;
+    };
     _proto._onSpriteChange = function _onSpriteChange(type) {
         switch(type){
             case SpriteModifyFlags.texture:
                 this.shaderData.setTexture(SpriteMask._textureProperty, this.sprite.texture);
                 break;
+            case SpriteModifyFlags.size:
+                this._dirtyUpdateFlag |= 0x4;
+                if (this._customWidth === undefined || this._customHeight === undefined) {
+                    this._dirtyUpdateFlag |= RendererUpdateFlags.WorldVolume;
+                }
+                break;
             case SpriteModifyFlags.region:
             case SpriteModifyFlags.atlasRegionOffset:
                 this._dirtyUpdateFlag |= 0x3;
@@ -11249,22 +11266,31 @@ SimpleSpriteAssembler = __decorate([
             case SpriteModifyFlags.atlasRegion:
                 this._dirtyUpdateFlag |= 0x2;
                 break;
+            case SpriteModifyFlags.pivot:
+                this._dirtyUpdateFlag |= RendererUpdateFlags.WorldVolume;
+                break;
         }
     };
     _create_class(SpriteMask, [
         {
             key: "width",
             get: /**
-   * Render width.
+   * Render width (in world coordinates).
+   *
+   * @remarks
+   * If width is set, return the set value,
+   * otherwise return `SpriteMask.sprite.width`.
    */ function get() {
-                if (this._width === undefined && this._sprite) {
-                    this.width = this._sprite.width;
+                if (this._customWidth !== undefined) {
+                    return this._customWidth;
+                } else {
+                    this._dirtyUpdateFlag & 0x4 && this._calDefaultSize();
+                    return this._automaticWidth;
                 }
-                return this._width;
             },
             set: function set(value) {
-                if (this._width !== value) {
-                    this._width = value;
+                if (this._customWidth !== value) {
+                    this._customWidth = value;
                     this._dirtyUpdateFlag |= RendererUpdateFlags.WorldVolume;
                 }
             }
@@ -11272,16 +11298,22 @@ SimpleSpriteAssembler = __decorate([
         {
             key: "height",
             get: /**
-   * Render height.
+   * Render height (in world coordinates).
+   *
+   * @remarks
+   * If height is set, return the set value,
+   * otherwise return `SpriteMask.sprite.height`.
    */ function get() {
-                if (this._height === undefined && this._sprite) {
-                    this.height = this._sprite.height;
+                if (this._customHeight !== undefined) {
+                    return this._customHeight;
+                } else {
+                    this._dirtyUpdateFlag & 0x4 && this._calDefaultSize();
+                    return this._automaticHeight;
                 }
-                return this._height;
             },
             set: function set(value) {
-                if (this._height !== value) {
-                    this._height = value;
+                if (this._customHeight !== value) {
+                    this._customHeight = value;
                     this._dirtyUpdateFlag |= RendererUpdateFlags.WorldVolume;
                 }
             }
@@ -11325,9 +11357,9 @@ SimpleSpriteAssembler = __decorate([
                 var lastSprite = this._sprite;
                 if (lastSprite !== value) {
                     lastSprite && lastSprite._updateFlagManager.removeListener(this._onSpriteChange);
+                    this._dirtyUpdateFlag |= 0x7;
                     if (value) {
                         value._updateFlagManager.addListener(this._onSpriteChange);
-                        this._dirtyUpdateFlag |= 0x3;
                         this.shaderData.setTexture(SpriteMask._textureProperty, value.texture);
                     } else {
                         this.shaderData.setTexture(SpriteMask._textureProperty, null);
@@ -11367,10 +11399,16 @@ __decorate([
 ], SpriteMask.prototype, "_sprite", void 0);
 __decorate([
     ignoreClone
-], SpriteMask.prototype, "_width", void 0);
+], SpriteMask.prototype, "_automaticWidth", void 0);
 __decorate([
     ignoreClone
-], SpriteMask.prototype, "_height", void 0);
+], SpriteMask.prototype, "_automaticHeight", void 0);
+__decorate([
+    assignmentClone
+], SpriteMask.prototype, "_customWidth", void 0);
+__decorate([
+    assignmentClone
+], SpriteMask.prototype, "_customHeight", void 0);
 __decorate([
     assignmentClone
 ], SpriteMask.prototype, "_flipX", void 0);
@@ -11388,7 +11426,9 @@ var /**
  */ SpriteMaskUpdateFlags;
 (function(SpriteMaskUpdateFlags) {
     SpriteMaskUpdateFlags[SpriteMaskUpdateFlags[/** UV. */ "UV"] = 0x2] = "UV";
-    SpriteMaskUpdateFlags[SpriteMaskUpdateFlags[/** All. */ "All"] = 0x3] = "All";
+    SpriteMaskUpdateFlags[SpriteMaskUpdateFlags[/** WorldVolume and UV . */ "RenderData"] = 0x3] = "RenderData";
+    SpriteMaskUpdateFlags[SpriteMaskUpdateFlags[/** Automatic Size. */ "AutomaticSize"] = 0x4] = "AutomaticSize";
+    SpriteMaskUpdateFlags[SpriteMaskUpdateFlags[/** All. */ "All"] = 0x7] = "All";
 })(SpriteMaskUpdateFlags || (SpriteMaskUpdateFlags = {}));
 
 /**
@@ -12195,6 +12235,7 @@ var MeshModifyFlags;
         var subDataDirtyFlags = this._subDataDirtyFlags;
         var blendShapeFloatStride = this._vertexElementCount * 3;
         var blendShapeByteStride = blendShapeFloatStride * 4;
+        var bufferOffset = this._bufferBindingOffset;
         // @todo: should fix bug when dataChangedFlag is true
         for(var i = 0, n = blendShapes.length; i < n; i++){
             var dataChangedFlag = subDataDirtyFlags[i];
@@ -12212,7 +12253,7 @@ var MeshModifyFlags;
                 var offset = indexInBuffer * blendShapeFloatStride;
                 var storeInfo = storeInfos[i];
                 storeInfo || (storeInfos[i] = storeInfo = new Vector2());
-                storeInfo.set(bufferIndex + 1, indexInBuffer * blendShapeByteStride); // BlendShape buffer is start from 1
+                storeInfo.set(bufferOffset + bufferIndex, indexInBuffer * blendShapeByteStride); // BufferOffset is mesh vertexBuffer offset
                 var deltaPositions = endFrame.deltaPositions;
                 for(var j = 0; j < vertexCount; j++){
                     var start = offset + bufferFloatStride * j;
@@ -13489,6 +13530,7 @@ var VertexChangedFlags;
     function MeshRenderer(entity) {
         var _this;
         _this = Renderer.call(this, entity) || this;
+        _this._enableVertexColor = false;
         _this._onMeshChanged = _this._onMeshChanged.bind(_assert_this_initialized(_this));
         return _this;
     }
@@ -13533,7 +13575,7 @@ var VertexChangedFlags;
                 shaderData.disableMacro(MeshRenderer._uv1Macro);
                 shaderData.disableMacro(MeshRenderer._normalMacro);
                 shaderData.disableMacro(MeshRenderer._tangentMacro);
-                shaderData.disableMacro(MeshRenderer._vertexColorMacro);
+                shaderData.disableMacro(MeshRenderer._enableVertexColorMacro);
                 for(var i = 0, n = vertexElements.length; i < n; i++){
                     switch(vertexElements[i].semantic){
                         case "TEXCOORD_0":
@@ -13549,7 +13591,7 @@ var VertexChangedFlags;
                             shaderData.enableMacro(MeshRenderer._tangentMacro);
                             break;
                         case "COLOR_0":
-                            shaderData.enableMacro(MeshRenderer._vertexColorMacro);
+                            this._enableVertexColor && shaderData.enableMacro(MeshRenderer._enableVertexColorMacro);
                             break;
                     }
                 }
@@ -13600,6 +13642,20 @@ var VertexChangedFlags;
                     this._setMesh(value);
                 }
             }
+        },
+        {
+            key: "enableVertexColor",
+            get: /**
+   * Whether enable vertex color.
+   */ function get() {
+                return this._enableVertexColor;
+            },
+            set: function set(value) {
+                if (value !== this._enableVertexColor) {
+                    this._dirtyUpdateFlag |= 0x2;
+                    this._enableVertexColor = value;
+                }
+            }
         }
     ]);
     return MeshRenderer;
@@ -13617,7 +13673,7 @@ var VertexChangedFlags;
     MeshRenderer._tangentMacro = ShaderMacro.getByName("RENDERER_HAS_TANGENT");
 })();
 (function() {
-    MeshRenderer._vertexColorMacro = ShaderMacro.getByName("RENDERER_HAS_VERTEXCOLOR");
+    MeshRenderer._enableVertexColorMacro = ShaderMacro.getByName("RENDERER_ENABLE_VERTEXCOLOR");
 })();
 __decorate([
     ignoreClone
@@ -20393,8 +20449,10 @@ var TextVerticalAlignment;
         if (name === void 0) name = null;
         var _this;
         _this = ReferResource.call(this, engine) || this;
-        _this._width = undefined;
-        _this._height = undefined;
+        _this._automaticWidth = 0;
+        _this._automaticHeight = 0;
+        _this._customWidth = undefined;
+        _this._customHeight = undefined;
         _this._positions = [
             new Vector2(),
             new Vector2(),
@@ -20415,7 +20473,7 @@ var TextVerticalAlignment;
         _this._region = new Rect(0, 0, 1, 1);
         _this._pivot = new Vector2(0.5, 0.5);
         _this._border = new Vector4(0, 0, 0, 0);
-        _this._dirtyUpdateFlag = 0x3;
+        _this._dirtyUpdateFlag = 0x7;
         /** @internal */ _this._updateFlagManager = new UpdateFlagManager();
         _this._texture = texture;
         region && _this._region.copyFrom(region);
@@ -20463,9 +20521,12 @@ var TextVerticalAlignment;
         if (this._texture) {
             var _this = this, _texture = _this._texture, _atlasRegion = _this._atlasRegion, _atlasRegionOffset = _this._atlasRegionOffset, _region = _this._region;
             var pixelsPerUnitReciprocal = 1.0 / Engine._pixelsPerUnit;
-            this._width = _texture.width * _atlasRegion.width / (1 - _atlasRegionOffset.x - _atlasRegionOffset.z) * _region.width * pixelsPerUnitReciprocal;
-            this._height = _texture.height * _atlasRegion.height / (1 - _atlasRegionOffset.y - _atlasRegionOffset.w) * _region.height * pixelsPerUnitReciprocal;
+            this._automaticWidth = _texture.width * _atlasRegion.width / (1 - _atlasRegionOffset.x - _atlasRegionOffset.z) * _region.width * pixelsPerUnitReciprocal;
+            this._automaticHeight = _texture.height * _atlasRegion.height / (1 - _atlasRegionOffset.y - _atlasRegionOffset.w) * _region.height * pixelsPerUnitReciprocal;
+        } else {
+            this._automaticWidth = this._automaticHeight = 0;
         }
+        this._dirtyUpdateFlag &= ~0x4;
     };
     _proto._updatePositions = function _updatePositions() {
         var blank = this._atlasRegionOffset;
@@ -20519,11 +20580,16 @@ var TextVerticalAlignment;
     };
     _proto._dispatchSpriteChange = function _dispatchSpriteChange(type) {
         switch(type){
+            case SpriteModifyFlags.texture:
+                this._dirtyUpdateFlag |= 0x4;
+                break;
             case SpriteModifyFlags.atlasRegionOffset:
             case SpriteModifyFlags.region:
-                this._dirtyUpdateFlag |= 0x3;
+                this._dirtyUpdateFlag |= 0x7;
                 break;
             case SpriteModifyFlags.atlasRegion:
+                this._dirtyUpdateFlag |= 0x4 | 0x2;
+                break;
             case SpriteModifyFlags.border:
                 this._dirtyUpdateFlag |= 0x2;
                 break;
@@ -20542,7 +20608,9 @@ var TextVerticalAlignment;
                 if (this._texture !== value) {
                     this._texture = value;
                     this._dispatchSpriteChange(SpriteModifyFlags.texture);
-                    (this._width === undefined || this._height === undefined) && this._dispatchSpriteChange(SpriteModifyFlags.size);
+                    if (this._customWidth === undefined || this._customHeight === undefined) {
+                        this._dispatchSpriteChange(SpriteModifyFlags.size);
+                    }
                 }
             }
         },
@@ -20550,13 +20618,21 @@ var TextVerticalAlignment;
             key: "width",
             get: /**
    * The width of the sprite (in world coordinates).
+   * 
+   * @remarks
+   * If width is set, return the set value,
+   * otherwise return the width calculated according to `Texture.width`, `Sprite.region`, `Sprite.atlasRegion`, `Sprite.atlasRegionOffset` and `Engine._pixelsPerUnit`.
    */ function get() {
-                this._width === undefined && this._calDefaultSize();
-                return this._width;
+                if (this._customWidth !== undefined) {
+                    return this._customWidth;
+                } else {
+                    this._dirtyUpdateFlag & 0x4 && this._calDefaultSize();
+                    return this._automaticWidth;
+                }
             },
             set: function set(value) {
-                if (this._width !== value) {
-                    this._width = value;
+                if (this._customWidth !== value) {
+                    this._customWidth = value;
                     this._dispatchSpriteChange(SpriteModifyFlags.size);
                 }
             }
@@ -20565,13 +20641,21 @@ var TextVerticalAlignment;
             key: "height",
             get: /**
    * The height of the sprite (in world coordinates).
+   * 
+   * @remarks
+   * If height is set, return the set value,
+   * otherwise return the height calculated according to `Texture.height`, `Sprite.region`, `Sprite.atlasRegion`, `Sprite.atlasRegionOffset` and `Engine._pixelsPerUnit`.
    */ function get() {
-                this._height === undefined && this._calDefaultSize();
-                return this._height;
+                if (this._customHeight !== undefined) {
+                    return this._customHeight;
+                } else {
+                    this._dirtyUpdateFlag & 0x4 && this._calDefaultSize();
+                    return this._automaticHeight;
+                }
             },
             set: function set(value) {
-                if (this._height !== value) {
-                    this._height = value;
+                if (this._customHeight !== value) {
+                    this._customHeight = value;
                     this._dispatchSpriteChange(SpriteModifyFlags.size);
                 }
             }
@@ -20601,7 +20685,9 @@ var TextVerticalAlignment;
                 var y = MathUtil$1.clamp(value.y, 0, 1);
                 this._atlasRegion.set(x, y, MathUtil$1.clamp(value.width, 0, 1 - x), MathUtil$1.clamp(value.height, 0, 1 - y));
                 this._dispatchSpriteChange(SpriteModifyFlags.atlasRegion);
-                (this._width === undefined || this._height === undefined) && this._dispatchSpriteChange(SpriteModifyFlags.size);
+                if (this._customWidth === undefined || this._customHeight === undefined) {
+                    this._dispatchSpriteChange(SpriteModifyFlags.size);
+                }
             }
         },
         {
@@ -20616,7 +20702,9 @@ var TextVerticalAlignment;
                 var y = MathUtil$1.clamp(value.y, 0, 1);
                 this._atlasRegionOffset.set(x, y, MathUtil$1.clamp(value.z, 0, 1 - x), MathUtil$1.clamp(value.w, 0, 1 - y));
                 this._dispatchSpriteChange(SpriteModifyFlags.atlasRegionOffset);
-                (this._width === undefined || this._height === undefined) && this._dispatchSpriteChange(SpriteModifyFlags.size);
+                if (this._customWidth === undefined || this._customHeight === undefined) {
+                    this._dispatchSpriteChange(SpriteModifyFlags.size);
+                }
             }
         },
         {
@@ -20632,7 +20720,9 @@ var TextVerticalAlignment;
                 var y = MathUtil$1.clamp(value.y, 0, 1);
                 region.set(x, y, MathUtil$1.clamp(value.width, 0, 1 - x), MathUtil$1.clamp(value.height, 0, 1 - y));
                 this._dispatchSpriteChange(SpriteModifyFlags.region);
-                (this._width === undefined || this._height === undefined) && this._dispatchSpriteChange(SpriteModifyFlags.size);
+                if (this._customWidth === undefined || this._customHeight === undefined) {
+                    this._dispatchSpriteChange(SpriteModifyFlags.size);
+                }
             }
         },
         {
@@ -20682,7 +20772,8 @@ var SpriteUpdateFlags;
 (function(SpriteUpdateFlags) {
     SpriteUpdateFlags[SpriteUpdateFlags["positions"] = 0x1] = "positions";
     SpriteUpdateFlags[SpriteUpdateFlags["uvs"] = 0x2] = "uvs";
-    SpriteUpdateFlags[SpriteUpdateFlags["all"] = 0x3] = "all";
+    SpriteUpdateFlags[SpriteUpdateFlags["automaticSize"] = 0x4] = "automaticSize";
+    SpriteUpdateFlags[SpriteUpdateFlags["all"] = 0x7] = "all";
 })(SpriteUpdateFlags || (SpriteUpdateFlags = {}));
 
 var _SlicedSpriteAssembler;
@@ -21174,8 +21265,10 @@ var TiledType;
         _this._tiledAdaptiveThreshold = 0.5;
         _this._color = new Color$1(1, 1, 1, 1);
         _this._sprite = null;
-        _this._width = undefined;
-        _this._height = undefined;
+        _this._automaticWidth = 0;
+        _this._automaticHeight = 0;
+        _this._customWidth = undefined;
+        _this._customHeight = undefined;
         _this._flipX = false;
         _this._flipY = false;
         _this._maskLayer = SpriteMaskLayer.Layer0;
@@ -21192,6 +21285,7 @@ var TiledType;
    */ _proto._cloneTo = function _cloneTo(target) {
         target._assembler.resetData(target);
         target.sprite = this._sprite;
+        target.drawMode = this._drawMode;
     };
     /**
    * @internal
@@ -21202,12 +21296,11 @@ var TiledType;
     /**
    * @internal
    */ _proto._updateBounds = function _updateBounds(worldBounds) {
-        var _this_sprite;
-        if (!((_this_sprite = this.sprite) == null ? void 0 : _this_sprite.texture) || !this.width || !this.height) {
+        if (this.sprite) {
+            this._assembler.updatePositions(this);
+        } else {
             worldBounds.min.set(0, 0, 0);
             worldBounds.max.set(0, 0, 0);
-        } else {
-            this._assembler.updatePositions(this);
         }
     };
     /**
@@ -21217,17 +21310,17 @@ var TiledType;
         if (!((_this_sprite = this.sprite) == null ? void 0 : _this_sprite.texture) || !this.width || !this.height) {
             return;
         }
-        // Update position.
+        // Update position
         if (this._dirtyUpdateFlag & RendererUpdateFlags.WorldVolume) {
             this._assembler.updatePositions(this);
             this._dirtyUpdateFlag &= ~RendererUpdateFlags.WorldVolume;
         }
-        // Update uv.
+        // Update uv
         if (this._dirtyUpdateFlag & 0x2) {
             this._assembler.updateUVs(this);
             this._dirtyUpdateFlag &= ~0x2;
         }
-        // Push render data
+        // Push primitive
         var material = this.getMaterial();
         var texture = this.sprite.texture;
         var renderData = this._engine._spriteRenderDataPool.getFromPool();
@@ -21245,6 +21338,16 @@ var TiledType;
         this._assembler = null;
         this._verticesData = null;
     };
+    _proto._calDefaultSize = function _calDefaultSize() {
+        var sprite = this._sprite;
+        if (sprite) {
+            this._automaticWidth = sprite.width;
+            this._automaticHeight = sprite.height;
+        } else {
+            this._automaticWidth = this._automaticHeight = 0;
+        }
+        this._dirtyUpdateFlag &= ~0x4;
+    };
     _proto._updateStencilState = function _updateStencilState() {
         // Update stencil.
         var material = this.getInstanceMaterial();
@@ -21271,22 +21374,21 @@ var TiledType;
                 break;
             case SpriteModifyFlags.size:
                 var _this = this, drawMode = _this._drawMode;
-                if (drawMode === SpriteDrawMode.Sliced) {
+                this._dirtyUpdateFlag |= 0x4;
+                if (this._drawMode === SpriteDrawMode.Sliced) {
                     this._dirtyUpdateFlag |= RendererUpdateFlags.WorldVolume;
                 } else if (drawMode === SpriteDrawMode.Tiled) {
                     this._dirtyUpdateFlag |= 0x3;
                 } else {
                     // When the width and height of `SpriteRenderer` are `undefined`,
                     // the `size` of `Sprite` will affect the position of `SpriteRenderer`.
-                    if (this._width === undefined || this._height === undefined) {
+                    if (this._customWidth === undefined || this._customHeight === undefined) {
                         this._dirtyUpdateFlag |= RendererUpdateFlags.WorldVolume;
                     }
                 }
                 break;
             case SpriteModifyFlags.border:
-                if (this._drawMode === SpriteDrawMode.Sliced || this._drawMode === SpriteDrawMode.Tiled) {
-                    this._dirtyUpdateFlag |= 0x3;
-                }
+                this._drawMode === SpriteDrawMode.Sliced && (this._dirtyUpdateFlag |= 0x3);
                 break;
             case SpriteModifyFlags.region:
             case SpriteModifyFlags.atlasRegionOffset:
@@ -21371,9 +21473,9 @@ var TiledType;
                 var lastSprite = this._sprite;
                 if (lastSprite !== value) {
                     lastSprite && lastSprite._updateFlagManager.removeListener(this._onSpriteChange);
+                    this._dirtyUpdateFlag |= 0x7;
                     if (value) {
                         value._updateFlagManager.addListener(this._onSpriteChange);
-                        this._dirtyUpdateFlag |= 0x3;
                         this.shaderData.setTexture(SpriteRenderer._textureProperty, value.texture);
                     } else {
                         this.shaderData.setTexture(SpriteRenderer._textureProperty, null);
@@ -21398,16 +21500,22 @@ var TiledType;
         {
             key: "width",
             get: /**
-   * Render width.
+   * Render width (in world coordinates).
+   *
+   * @remarks
+   * If width is set, return the set value,
+   * otherwise return `SpriteRenderer.sprite.width`.
    */ function get() {
-                this._width === undefined && this._sprite && (this.width = this._sprite.width);
-                return this._width;
+                if (this._customWidth !== undefined) {
+                    return this._customWidth;
+                } else {
+                    this._dirtyUpdateFlag & 0x4 && this._calDefaultSize();
+                    return this._automaticWidth;
+                }
             },
             set: function set(value) {
-                // Update width if undefined
-                this._width === undefined && this._sprite && (this._width = this._sprite.width);
-                if (this._width !== value) {
-                    this._width = value;
+                if (this._customWidth !== value) {
+                    this._customWidth = value;
                     this._dirtyUpdateFlag |= RendererUpdateFlags.WorldVolume;
                 }
             }
@@ -21415,16 +21523,22 @@ var TiledType;
         {
             key: "height",
             get: /**
-   * Render height.
+   * Render height (in world coordinates).
+   *
+   * @remarks
+   * If height is set, return the set value,
+   * otherwise return `SpriteRenderer.sprite.height`.
    */ function get() {
-                this._height === undefined && this._sprite && (this.height = this._sprite.height);
-                return this._height;
+                if (this._customHeight !== undefined) {
+                    return this._customHeight;
+                } else {
+                    this._dirtyUpdateFlag & 0x4 && this._calDefaultSize();
+                    return this._automaticHeight;
+                }
             },
             set: function set(value) {
-                // Update height if undefined
-                this._height === undefined && this._sprite && (this._height = this._sprite.height);
-                if (this._height !== value) {
-                    this._height = value;
+                if (this._customHeight !== value) {
+                    this._customHeight = value;
                     this._dirtyUpdateFlag |= RendererUpdateFlags.WorldVolume;
                 }
             }
@@ -21511,10 +21625,16 @@ __decorate([
 ], SpriteRenderer.prototype, "_sprite", void 0);
 __decorate([
     ignoreClone
-], SpriteRenderer.prototype, "_width", void 0);
+], SpriteRenderer.prototype, "_automaticWidth", void 0);
 __decorate([
     ignoreClone
-], SpriteRenderer.prototype, "_height", void 0);
+], SpriteRenderer.prototype, "_automaticHeight", void 0);
+__decorate([
+    assignmentClone
+], SpriteRenderer.prototype, "_customWidth", void 0);
+__decorate([
+    assignmentClone
+], SpriteRenderer.prototype, "_customHeight", void 0);
 __decorate([
     assignmentClone
 ], SpriteRenderer.prototype, "_flipX", void 0);
@@ -21535,7 +21655,9 @@ var /**
  */ SpriteRendererUpdateFlags;
 (function(SpriteRendererUpdateFlags) {
     SpriteRendererUpdateFlags[SpriteRendererUpdateFlags[/** UV. */ "UV"] = 0x2] = "UV";
-    SpriteRendererUpdateFlags[SpriteRendererUpdateFlags[/** All. */ "All"] = 0x3] = "All";
+    SpriteRendererUpdateFlags[SpriteRendererUpdateFlags[/** WorldVolume and UV . */ "RenderData"] = 0x3] = "RenderData";
+    SpriteRendererUpdateFlags[SpriteRendererUpdateFlags[/** Automatic Size. */ "AutomaticSize"] = 0x4] = "AutomaticSize";
+    SpriteRendererUpdateFlags[SpriteRendererUpdateFlags[/** All. */ "All"] = 0x7] = "All";
 })(SpriteRendererUpdateFlags || (SpriteRendererUpdateFlags = {}));
 
 /**