Performance Image vs Vector Graphics

Hello, what I am trying to achieve is having an interactive program that does some stuff. I am using Keystone library, Pgraphics, PImages (lots of them, drawing them when something happens, translate them around, and others are always drawed with fixed position), PShape (only one) all in P3D mode. I know that processing can be really slow when you draw too many stuff (I realized that few days ago and trying to find how can I make the program lighter). Keystone library gets “stuck” I have difficulties moving the layers around sometimes I can not catch the corners either. I am not having any errors it’s just slow.

Here comes my question “Is there a significant difference on perfοrmance when using Image vs vector graphics? (pshape), will it be lighter if I’ll use only vectors, or it is the same?” It matters if the images are BW or RGB, or the size of the image?


1 Like

I would say it depends on how much data the PShape / PImage / PGraphics contains. The PShape’s heavyness will depend on how many vertices it has. How heavy the PImage / PGraphics will depend on their original sizes in pixels.

If you will never render the image larger than 100x100 on the screen then there is no need to initialize them to 4096x4096 pixels (for example). So size your images according to maximum rendering size.

If you want to draw a rectangle, a PShape rectangle will have only 4 vertices, where a huge pixel based rectangle can have millions of pixels. Sending millions of pixels to the graphics card takes longer than sending 4 vertices.

On the other hand, if you have a complex PShape of a tree with branches and leaves and it has a million vertices, but you only render it at 200x200 pixels, then rendering the vector shape first to a 200x200 PGraphics and drawing that instead will probably be faster, because it takes longer to send and process 1 million vertices than 40.000 pixels.

In some environments BW would be better than RGB, RGBA (3 or 4 times less data), but I don’t remember if you can work with 8bit buffers in Processing by default.

Are you calling vertex() at all? Doing that a lot is slower than creating a PShape and drawing that instead.

Without seeing the program is hard to guess how to optimize it.


Thank you so much, you really helped a lot to understand how all these are working. I have to think if my shapes will have a small number of vertices (I have to create them from scratch and load them as svg files), or if just resizing my images will be easier and less waste of time. :confused:
I am not calling vertex(), I have an obj file (created on blender, I think I’ll change that to an svg cause I don’t need 3D shapes eventually). I have around 40 images some are 300x300 some are 2000x2000, but my PGraphics are

canvas=createGraphics(180, 300, P3D);// canvas for tree and branches
//images that I am displaying on canvas are 3000x3000

for (int i=0; i<canvas2.length; i++) {
canvas2[i]=createGraphics(50, 80, P3D); // canvas for houses
//images that I am displaying on canvas2 are 300x400

Other images are not in PGraphics (maybe not a wise thinking).

image(frames[0], -20, 0, 230, 300);
//here the image is 920x1185

My program is quite big and chaotic :expressionless:

Thank you again. :slight_smile:

1 Like

If I understand it right, sometimes you are rendering 3000x3000 images into 180x300 PGraphics… That’s a lot of unnecessary detail being wasted. Can you pre-process such images to scale them down first? There are many tools to scale down all images in a folder…

Even the 300x400 images are being scaled down to 50x80, so same thing applies. One thing though: if you will be animating the scale or rotation of those images, then it may be good to have them at twice the required resolution, because they will look better. But 2x might be enough. No need for 6x or 10x :slight_smile:

If you scale down in advance all those images the performance should be much better and the quality should be the same. Let us know :slight_smile:


Yes, you are right, now I can see how inefficient my program is. I will try scale them down first and see how this goes. :slightly_smiling_face: Thank you again. :slight_smile: