弱弱的请教,设置了shader的节点淡出时会卡一下的问题

是这样的,

我设定了一个Node,带了模糊效果,
结果在淡出的时候,这个节点会卡一下,也就是不像其他Node在淡出时那么自然

请教各位前辈,
我是应该在淡出之前,将该节点的shader停止,还是该如何做呢?

请前辈们指点,感谢

附带shader的代码:

const _vert = `
attribute vec4 a_position;
attribute vec2 a_texCoord;
attribute vec4 a_color;
varying vec2 v_texCoord;
varying vec4 v_fragmentColor;
void main()
{
    gl_Position = ( CC_PMatrix * CC_MVMatrix ) * a_position;
    v_fragmentColor = a_color;
    v_texCoord = a_texCoord;
}
` 
const _vert_no_mvp = `
attribute vec4 a_position;
attribute vec2 a_texCoord;
attribute vec4 a_color;
varying vec2 v_texCoord;
varying vec4 v_fragmentColor;
void main()
{
   gl_Position = CC_PMatrix  * a_position;
   v_fragmentColor = a_color;
   v_texCoord = a_texCoord;
}
`
const _frag = `
#ifdef GL_ES
precision mediump float;
#endif

varying vec2 v_texCoord;
uniform float u_strength;
uniform float u_widthStep;
uniform float u_heightStep;
const float blurRadius = 3.0;
const float blurPixels = ( blurRadius * 2.0 + 1.0 ) * ( blurRadius * 2.0 + 1.0 );
void main()
{
   float radius = blurRadius;
    vec3 sumColor = vec3( 0.0, 0.0, 0.0 );
    for(float fy = -blurRadius; fy <= blurRadius; ++fy )
    {
        for(float fx = -blurRadius; fx <= blurRadius; ++fx)
        {
            vec2 coord = vec2( fx * u_widthStep, fy * u_heightStep );
            sumColor += texture2D( CC_Texture0, v_texCoord + coord ).rgb;
        }
    }
    gl_FragColor = vec4( mix( texture2D( CC_Texture0, v_texCoord ).rgb, sumColor / blurPixels, u_strength ), 1.0 );;
}
`
let shaderClass = cc.Class(
{
    extends: cc.Component,
   editor:
   {
      requireComponent:  cc.Sprite,
      executeInEditMode: true,
   },
    properties:
   {
      previewId: { default: null, editorOnly: true, visible: false, },
      _program:  { default: null, visible: false, },
      Strength:  { default: 0.8, type: cc.Float, },
   },
    onLoad()
   {
      this.updateRender();
    },
    onEnable()
   {
      this.node.on( 'touchstart', function (event) { event.stopPropagation(); });
      this.node.on( 'touchend', function (event) { event.stopPropagation(); });
    },
   onDestroy()
   {
      //if ( this.previewId !== null ) clearInterval( this.previewId );
   },
   onFocusInEditor()
   {
      this.updateRender();
      // if ( this.previewId !== null ) clearInterval( this.previewId );
      // this.previewId = setInterval( this.updateRender.bind( this ), 1 );
   },
   onLostFocusInEditor()
   {
      //if ( this.previewId !== null ) clearInterval( this.previewId );
   },

   updateRender()
   {
      this.render( this.Strength );
   },
    render( strength )
    {
      if ( !this._program ) this._program = new cc.GLProgram();
        if ( cc.sys.isNative )
        {
            this._program.initWithString( _vert_no_mvp, _frag );
            this._program.link();
            this._program.updateUniforms();
            const glProgram_state = cc.GLProgramState.getOrCreateWithGLProgram( this._program );
        }
        else
        {
            this._program.initWithVertexShaderByteArray( _vert, _frag );

            this._program.addAttribute( cc.macro.ATTRIBUTE_NAME_POSITION, cc.macro.VERTEX_ATTRIB_POSITION);
            this._program.addAttribute( cc.macro.ATTRIBUTE_NAME_COLOR, cc.macro.VERTEX_ATTRIB_COLOR);
            this._program.addAttribute( cc.macro.ATTRIBUTE_NAME_TEX_COORD, cc.macro.VERTEX_ATTRIB_TEX_COORDS);
            this._program.link();
            this._program.updateUniforms();
      }

      this._uniStrength  = this._program.getUniformLocationForName( "u_strength" );
      this._uniWidthStep = this._program.getUniformLocationForName( "u_widthStep" );
      this._uniHeightStep    = this._program.getUniformLocationForName( "u_heightStep" );

        if ( cc.sys.isNative )
        {
            const glProgram_state = cc.GLProgramState.getOrCreateWithGLProgram( this._program );
         glProgram_state.setUniformFloat( "u_strength",    strength );
         glProgram_state.setUniformFloat( "u_widthStep",       ( 1.0 / this.node.getContentSize().width ) );
         glProgram_state.setUniformFloat( "u_heightStep",   ( 1.0 / this.node.getContentSize().height ) );
        }
        else
        {
            /* 模糊 0.5     */
         /* 细节 -2.0    */
         /* 细节 -5.0    */
         /* 细节 -10.0   */
         /* 边缘 2.0     */
         /* 边缘 5.0     */
         /* 边缘 10.0    */
         /* 模糊 1.0     */
         this._program.setUniformLocationWith1f( "u_strength",  ( strength + 0.2 ) );
         this._program.setUniformLocationWith1f( "u_widthStep", ( 1.0 / this.node.getContentSize().width ) );
         this._program.setUniformLocationWith1f( "u_heightStep",    ( 1.0 / this.node.getContentSize().height ) );
      }

        this.setProgram( this.node._sgNode, this._program );
    },
    setProgram( node, program )
   {
        if ( !cc.sys.isNative ) { node.setShaderProgram( program ); }
        else
        {
            let glProgram_state = cc.GLProgramState.getOrCreateWithGLProgram( program );
            node.setGLProgramState( glProgram_state );
        }
        let children = node.children;
        if (!children) return;
        for ( let i = 0; i < children.length; i++ ) this.setProgram( children[i], program );
    },
});

module.exports = shaderClass;

顺带请教一下,
设置了shader的节点,该如何让节点不再使用这个shader呢?

感激不尽:joy:

經由論壇前輩的指點,

只要在淡出之前,把shader停止,就會正常了

停止的方法為:

let sprite = this.node.getComponent( cc.Sprite );
sprite._sgNode.setState( 0 ); //這會還原成預設的shader