How to decrease GPU load when displaying an image in the window?

Processing Coding Questions
1

Hi there,

My first question so please dismiss any silly mistakes with my wording. I am developing a knock off of Photoshop, suitably named ‘Fotoshop’, as a part of my 2nd year university graphics coursework. I am doing fine at the moment developing all the features but I came across a alarming fact, when running the program and displaying an image it appears, according to task manager, that the program is using around 15% of my GPU on load - just to clarify, I have a 3060ti so I assume Processing using 15-20 percent of that GPU to display an image is not right.

My image displaying code is simple as can be in order to minimise it but I cant seem to avoid it. The best I can think of is to make a variable boolean to keep track of when there needs to be a change to the image (like a greyscale function for example) and then update only when it needs to be updated in order to avoid draw the image every single frame even though nothing has changed.

Heres the code;

void draw(){
  println((int) frameRate, "frames per second");
  background(bgColour[0], bgColour[1], bgColour[2]);
  // ===== DRAWING IMAGE (EITHER LOADED OR LIVE DEPENDING ON WHETHER showOriginalImage IS TRUE OR NOT) =====
  showCorrectImage();
    
  myUI.update();
}

You can ignore the FPS readings and the myUI stuff, we are using a SimpleUI library made by my lecturer.

Oh and heres the showCorrectImage() code…

void showCorrectImage() {
  if (loadedImage != null && showLoadedImage == true) {
    showLoadedImage();    
  }
  else if (loadedImage != null && showLoadedImage == false) {
    showLiveImage();  
  }  
}

Anddd then finally both the showLoadedImage() and showLiveImage() code…

void showLiveImage() {
  if (liveImage != null) {
    image(liveImage, windowWidth/2 - liveImage.width/2, windowHeight/2 - liveImage.height/2);
  }  
}

void showLoadedImage() {
  if (loadedImage != null) {
    image(loadedImage, windowWidth/2 - loadedImage.width/2, windowHeight/2 - loadedImage.height/2);
  }    
}
2

Hey @BenjaminColligan, I understand where you’re coming from, but I doubt it’s the image() call that is using that much GPU. Just ran this little test, and found Processing to use no GPU at all displaying a 2K image, using iStat Menus on Mac OS (Apple M1 Max):


PImage testImg;

void setup()
{
  fullScreen(P2D);
  pixelDensity(displayDensity());
  
  testImg = loadImage("test.jpg");
  
  frameRate(60);
}


void draw()
{
  surface.setTitle("FPS: "+nf(frameRate, 1, 1));
  
  // - GPU use in OS: 8-11%
  // - GPU use empty sketch standard renderer: 10-11% (+0%)
  // - GPU use empty sketch P2D renderer: 17-22% (+ ~10%)
  
  //drawImageNormal(); // (+0%)
  drawImageTexture(); // (+0%)
  
}

void drawImageNormal()
{
  imageMode(CENTER);
  image(testImg, width/2, height/2);
}

void drawImageTexture()
{
  beginShape();
  texture(testImg);
  vertex(0, 0, 0, 0);
  vertex(width, 0, testImg.width, 0);
  vertex(width, height, testImg.width, testImg.height);
  vertex(0, height, 0, testImg.height);
  endShape();
}

The only notable effect I saw was when using P2D or P3D as the renderer, with an empty sketch using about 10% of GPU when using these renderers, not doing anything. This is likely to be the render engine loaded; tribuffers etc. that it uses. Adding an image() call to it seems to not have a significant effect.

2 Likes
3

Ahhh right, so what you are implying that these GPU load seems to be just whilst the renderer is idle? Even if it is rather high or not.

4

Right. I also don’t know what the rest of your sketch is doing, but that’s what it looks like here. Honestly, I wouldn’t worry too much about GPU load. It’s pretty hard to hit the limit with Processing without heavy use of shaders. Most of the time (almost always) you’ll hit the CPU limit first.

5

Make sure you are using integers for the image() position values. Using floats can cause high cpu loads unsure why, but its something ive noticed before.

1 Like