<script type="importmap">
  {
    "imports": {
      "three": "https://threejs.org/build/three.module.js"
    }
  }
</script>
<!--
  Had to put JS in the HTML block to import THREE
  Also, issue is more clear with an image material, but I had to use a solid color for this example
-->
<script type="module">
  import * as THREE from "three";
  import {EffectComposer} from "https://threejs.org/examples/jsm/postprocessing/EffectComposer.js";
  import {OutlinePass} from "https://threejs.org/examples/jsm/postprocessing/OutlinePass.js";
  import {RenderPass} from "https://threejs.org/examples/jsm/postprocessing/RenderPass.js";
  // import {ShaderPass} from "https://threejs.org/examples/jsm/postprocessing/ShaderPass.js";
  // import {FXAAShader} from "https://threejs.org/examples/jsm/shaders/FXAAShader.js";

  const windowSize = [256,256],
  mesh = new THREE.Mesh(new THREE.BoxGeometry(16,16,16), new THREE.MeshBasicMaterial({color: 0xd41313})),
  scene = new THREE.Scene(),
  camera = new THREE.OrthographicCamera(-16,16,16,-16),
  renderer = new THREE.WebGLRenderer(),
  textureLoader = new THREE.TextureLoader(),
  effectComposer = new EffectComposer(renderer),
  outline = new OutlinePass(new THREE.Vector2(...windowSize), scene, camera);
  // const effectFXAA = new ShaderPass(FXAAShader);

  // --- Swapping these two passes demonstrates it's the outline causing issues
  effectComposer.addPass(new RenderPass(scene, camera));
  effectComposer.addPass(outline);

  // --- FXAAShader was an attempt to fix it, since some research showed it could be anti-aliasing issues, but this did not seem to make a difference
  // effectFXAA.uniforms['resolution'].value.set(1/windowSize[0],1/windowSize[1]);
  // effectComposer.addPass(effectFXAA);

  renderer.setSize(...windowSize);
  camera.position.set(32,32,32);
  camera.lookAt(0,0,0);
  outline.selectedObjects = [mesh];
  scene.add(mesh);
  document.body.appendChild(renderer.domElement);
  effectComposer.render();
</script>