I think this is a chrome issue as it only seems to Chrome, Edge, and OBS. However, that is a problem because that is most of my intended audience. There is no flicker in Firefox so I believe I just need a work around for Chromium based browsers.

The flickering only seems to last for 1 rotation through the animation, however, it will occasionally come back at random times. It also comes back whenever we change the sprite animation

Prior to the below code running we have already imported the image as a Javascript Object. Each image has multiple states we can cycle between. Each state has 10 frames which are loaded as DataURLs and switched between so the flickering would not be caused by loading the images.

Currently we are testing with very few images so the total object size is only a few Kb.

 //Set up Canvas Javascript Elements
    const canvas = document.getElementById('mainCanvas');
    const bufferCanvas = document.getElementById('bufferCanvas'); 
    
    //Get Canavas 2d context
    const ctx = canvas.getContext('2d');
    const bctx = bufferCanvas.getContext('2d');


    //Set Canvas Size - Broken up into multiple lines to more easily enable and disable elements during testing
    const CANVAS_WIDTH  = 364;
    const CANVAS_HEIGHT  = 444;
    canvas.width = CANVAS_WIDTH;
    canvas.height = CANVAS_HEIGHT;
    bufferCanvas.width = CANVAS_WIDTH;
    bufferCanvas.height = CANVAS_HEIGHT;

    //Sets current animation, initial frame, and cycle count
    var currentAnimation = 'idle'
    var currentFrame = 0;
    var cycle = 0;

    function animate(){
      //Only incrementing frames when the cycle mod 10 is 0 slows it down
      if(cycle % 10 == 0){
        currentFrame++;
        if(currentFrame >= currentImage[currentAnimation].length){
          currentFrame = 0;
        }
        playerImage.src = currentImage[currentAnimation][currentFrame];
      }
      
      //Draws the buffer canvas prior to clearing the main canvas
      bctx.drawImage(playerImage, 0, 0); 

      //Clears main Canvas
      ctx.clearRect(0, 0, CANVAS_WIDTH, CANVAS_HEIGHT);

      //Draws new image to main Canvas
      ctx.drawImage(bufferCanvas, 0, 0); 
      
      //Clears buffer canvas once main canvas has been drawn
      bctx.clearRect(0, 0, CANVAS_WIDTH, CANVAS_HEIGHT);
      //Resets cycle to maintain a manageable number
      cycle++;
      if(cycle >= 10000){
        cycle = 0;
      }
      //Calls itself to loop
      requestAnimationFrame(animate);
    }