I found that the edges of my gltf model were jagged and blurred.

Then I looked up a lot of code.

Finally, when I remove the code of effectcomposer, the model is normal.
my code:

 this.composer = new EffectComposer(this.renderer);
        const renderPass = new RenderPass(this.scene, this.camera);
        this.composer.addPass(renderPass);
        this.outlinePass = new OutlinePass(new THREE.Vector2(window.innerWidth, window.innerHeight),
            this.scene, this.camera);
        this.composer.addPass(this.outlinePass);
        this.outlinePass.pulsePeriod = 1.5;
        this.outlinePass.edgeThickness = 2.5;
        this.outlinePass.edgeGlow = 1;
        this.outlinePass.edgeStrength = 3;
        this.outlinePass.visibleEdgeColor.set('#f6c204');
        this.effectFXAA = new ShaderPass(FXAAShader);
        this.effectFXAA.uniforms['resolution'].value.set(1 / window.innerWidth, 1 / window.innerHeight);
        this.composer.addPass(this.effectFXAA);
What should I do? I don’t want to lose this post-processing effect

help me, thank you !
              
I don’t know, but from EffectComposer.js was deleted code for good color gradient
const parameters = {
minFilter: THREE.LinearFilter,
magFilter: THREE.LinearFilter,
format: THREE.RGBAFormat,
type: THREE.FloatType
image1190×540 87.4 KB
this shouldn’t be needed any longer, you can use MSAA.
const target = new WebGLRenderTarget(size.width, size.height, {
  type: HalfFloatType,
  format: RGBAFormat,
  encoding: gl.outputEncoding,
target.samples = 8 // <---- 🙏
new EffectComposer(gl, target)
or is this only about OutlinePass? that one will blur selected edges.
Fxaashader’s anti aliasing treatment causes some blurring in the model.

const target = new WebGLRenderTarget… …

this code is very good!

thank you!
const target = new WebGLRenderTarget(size.width, size.height, {
  type: HalfFloatType,
  format: RGBAFormat,
  encoding: gl.outputEncoding,
target.samples = 8 
from webgl2