Performance issues

[Chiggy-Playz]

Describe the bug
There's high spikes in CPU usage whenever there's some sort of modal open. Be it the settings, user profile popout (The bigger one), or even clicking on photos. Its very bad.

To Reproduce
Just open settings or profile of a user by right clicking

Infomation (please complete the following information):
Discord channel: Canary OS: Windows Mod: Powercord Discord language: English

[Gibbu]

That is because of the use of backdrop-filter. Nothing I can do about it other than completely removing it, which I am not going to do.

[Chiggy-Playz]

Could it be a toggle which could be on by default just like glow? I really like the theme but would prefer it to be lag free 😅

[AallynReed]

May I give some suggestions to workaround this issue

It is obviously caused by the animation making a 60 fps for 0.2 seconds of that backdrop blur, making it a huge mess performance wise.

I have 2 suggestions for this First option, in case of backdrop and settings I think a blur filter can be instantly applied to the layer that hold everything but backdrop and settings layer, which means chat, server, members etc... blurring globally that part of the UI without tying it to the class that has the animation with a filter rather than using a backdrop-filter for settings and backdrop tabs

My other option which I am unsure if it would actually fix, but would be adding to from and to in the keyframes of fadeIn with the property of backdrop filter with the value set from the beggining rather than making it compute the blur, this also means the blur won't gradually come in which tbh is what causes the issues anyways, so it being gone seems fine to me~~

@-webkit-keyframes fadeIn {
  from {
    backdrop-filter: blur(var(--blur));
    opacity: 0;
  }
  to {
    backdrop-filter: blur(var(--blur));
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    backdrop-filter: blur(var(--blur));
    opacity: 0;
  }
  to {
    backdrop-filter: blur(var(--blur));
    opacity: 1;
  }
}

im no css pro, these are just suggestions, pardon my ignorance

[Gibbu]

Both would still cause the massive lag. The only fix is if I remove them from the entire theme. Which I will not do. Make sure you have Hardware Acceleration enabled in Advanced Discord settings.

Could it be a toggle which could be on by default just like glow? I really like the theme but would prefer it to be lag free 😅

Not possible with CSS. You either have it in, or no.

[Chiggy-Playz]

Not possible with CSS. You either have it in, or no.

Welp. Alright thanks.

[Chiggy-Playz]

I tried out Sly's CSS snippet and it seems to work! It reduces the lag by a lot.