slow array

Hey guys,

So I am writing a code that puts the values of the X and Y location of the mouse in array and then uses those values to draw a stroke (curve), but what happens is that after a few moments the program becomes really slow and the values aren't stored properly in the array anymore. I know this is because the array is becoming to big because is said for(...) { draw this curve} but is there anyone who could help me out on how I could solve this?

Thank you in advance, here is the `code;`

`// the two arrays that store the values of the position of the mouse
mouseposx = [];
mouseposy = [];

function setup() {
createCanvas(600, 600);

}

function draw() {
background(0);

//make var for array that puts all values in array
for (var i = mouseposx.length ; i >= 0; i--) {

//if the mouse is stopped do not put new values in array
if (mouseX !== pmouseX && mouseY !== pmouseY) {

//put values of the position of the mouse in the array
mouseposx.push(mouseX);
mouseposy.push(mouseY);

}

// draw the curve of where the mouse has been
noFill();
stroke(255);
curve(mouseposx[i], mouseposy[i], mouseposx[i + 1], mouseposy[i + 1], mouseposx[i + 2], mouseposy[i + 2], mouseposx[i + 3], mouseposy[i + 3] );

}

}`

Empieza con el ejemplo en línea de setup() y draw(), especialmente con los arrays mouseposx y mouseposy y el bucle alrededor de curve(). Reproduce la ralentización al dibujar y, después, determina qué cambio evita que los arrays o el bucle de dibujo crezcan sin límite, conservando el trazo del ratón.

Escrito por el modelo de indexación a partir del texto del issue.