Wappler using 4.5% of CPU in Design view (16 core CPU)

Wappler General Need Help
1

I have quite a decent modern processor, Intel® Core™ Ultra 9 185H × 22, and Wappler (7.2.1) is using 4.5% of it when in focus, causing fans to spin up when Wappler is open in Design view.

image

Only been like this for the last two versions (latest version is even more CPU intensive).

The Project is a simple single page Node JS/Docker/Bootstrap application on Ubuntu 25.04.

2

Your fans spin up heavy by only 4.5% cpu? Maybe they need tuning.

Btw when not on focus the Wappler editors now go in sleep so shouldn’t use much at all.

And also there weren’t any changes in cpu usage since Wappler release. It might be more page specific?

3

This may be the cause. The page has a slight animation on a header image and when I scroll past it in Design view the fans reduce (the page uses only 37.9mb of memory in the browser and even with the animation showing within Chrome itself does not cause my fans to ramp up). Not sure why this happens now but was not the case a couple of versions back (same page no changes). Can only say what I'm experiencing... 4.5% is not harming performance in any way it is just noticeable as the fans ramp up only when Wappler is in focus.

I can't tune the fan curve it is set in BIOS George.

image
image1628×1185 200 KB

4.5% is more than everything else running combined.

CPU drops to pretty much zero usage in 'sleep'.

4

@George

Just an update on this issue. It is down to a simple animation applied to a hero element in the page (via CSS styles file and not using JavaScript).

-webkit-animation: heroZoom 20s ease-in-out infinite;
animation: heroZoom 20s ease-in-out infinite;

@-webkit-keyframes heroZoom {
  0%,
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
  }
}

@keyframes heroZoom {
  0%,
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.05);
    transform: scale(1.05);
  }
}

If this is included in our style.css file then CPU usage significantly increases (but the same does not happen when the page is displayed in Chrome so it is a Wappler issue with the animation). Surely such a simple animation should not cause this? If we remove it CPU basically falls to zero...

5

Forget the above it IS still happening GRRRRRRRRRRRRRRRRRR!!!! However it only happens in Wappler and not in Chrome when viewed in the browser...

6

Ive mentioned before on posts about performance issues that I find problems most frequently on pages with multiple animated items (especially when nested) - collapses, modals, offcanvas, accordion etc.

8

Will see if we can disable such css animations when in design view as some might interfere with our editing overlay and tools and that is why they execute more heavily than in the browser.

Could send a sample page @Cheese

1 Like
9

Will send to you in a PM @George. Thank you.

11

Please check with the latest update - Wappler 7.3.1
The animations should no longer use cpu resource in design view.

13

Thanks Teodor I did try it and it fails to display the page as the CSS itself is ignored all together. I pointed this out to George in a message. I'll go ahead and tag you in to the message thread and if you wish I can submit a bug report regarding the issue based upon your input?