React three fiber postprocessing

Questions
,
1

Hi, I have a question about '@react-three/postprocessing' and postprocessing package.

According to React Postprocessing Documentation this documentation, we can create a custom effects and add it to EffectComposer.
For test purpose, I’ve created two components:

export const Pixelation = forwardRef(({ granularity = 5 }, ref) => {
  const effect = useMemo(() => new PixelationEffect(50), [granularity]);
  return <primitive ref={ref} object={effect} dispose={null} />;
});

export const Composer = () => {
  return (
    <EffectComposer multisampling={8}>
      <Noise opacity={0.01} />
      <Pixelation />
    </EffectComposer>
  );
};

But in here, pixelation has no effect at all. What am I doing wrong? Is it possible?

  • Another question is that, is it any way to achieve addPass on that effect composer from '@react-three/postprocessing' package? I mean, put a ref onto composer and somehow achieve composer.current.addPass(pass).

Thank you in an advance :slight_smile: