Unable to get rid of visual artifacts in Processing sketch

Question

int numFrames = 5; //Number of animation frames
int frame = 0;
PImage[] images = new PImage[numFrames]; //Image array

void setup() 
{
    size(800, 800);
    background(180, 180, 180);
    frameRate(15); //Maximum 30 frames per second 
}

void draw() 
{
    images[0] = loadImage("Ayylmfao.0001.png");
    images[1] = loadImage("Ayylmfao.0002.png");
    images[2] = loadImage("Ayylmfao.0003.png");
    images[3] = loadImage("Ayylmfao.0004.png");
    images[4] = loadImage("Ayylmfao.0005.png");
    frame++;
        if (frame == numFrames) 
        {
            frame = 0;
        }

    image(images[frame], 0, 0);
}

So my problem is this: I keep getting an artifact from previous frames when I try to run this animation. I'm using an array to store the images in the animation because I'm trying to practice using arrays in general.

The animation is of an eyeball that blinks. The problem is, when it blinks all of the previous frames are drawn over. The iris of the eyeball disappears and the eyeball starts collecting artifacts from the previous frames.

Answer 1

As Kevin points out, you shouldn't load the images over and over again, multiple times per second in draw(). You should load them once in setup(), then render them in draw():

int numFrames = 5; //Number of animation frames
int frame = 0;
PImage[] images = new PImage[numFrames]; //Image array

void setup() 
{
    size(800, 800);
    background(180, 180, 180);
    frameRate(15); //Maximum 30 frames per second 
    images[0] = loadImage("Ayylmfao.0001.png");
    images[1] = loadImage("Ayylmfao.0002.png");
    images[2] = loadImage("Ayylmfao.0003.png");
    images[3] = loadImage("Ayylmfao.0004.png");
    images[4] = loadImage("Ayylmfao.0005.png");
}

void draw() 
{

    frame++;
        if (frame == numFrames) 
        {
            frame = 0;
        }

    image(images[frame], 0, 0);
}