Sluggish performance from GlowEffect and overlay?


#1

I'm developing now using mostly JUCE components and I've noticed slow performance when adding GlowEffect.

I've seen it's Gussian filter but it might seem there is some efficiency issues.

 

Here is the code (I've created simple JUCE application):

    MainContentComponent()
    {
        setSize (400 , 400);
        setFramesPerSecond (60);
        addAndMakeVisible(simpleCircle_ = Drawable::createFromImageData (BinaryData::orange_circle_206x206_svg , BinaryData::orange_circle_206x206_svgSize));
        
        addAndMakeVisible(overlappingCircle_ = Drawable::createFromImageData (BinaryData::orange_circle_206x206_svg , BinaryData::orange_circle_206x206_svgSize));
        
        glowEffect_ = new GlowEffect();
        glowEffect_->setGlowProperties(10.f, Colours::green);
        
        overlappingCircle_->setComponentEffect(glowEffect_);
    }

private:
    //==============================================================================

    // Your private member variables go here...
    ScopedPointer<Drawable> simpleCircle_;
    ScopedPointer<Drawable> overlappingCircle_;
    ScopedPointer<GlowEffect> glowEffect_;

And here is the svg:

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     viewBox="0 0 206 206" enable-background="new 0 0 206 206" xml:space="preserve">
<g>
    <defs>
        <rect id="SVGID_1_" x="0.5" y="0.5" width="205" height="205"/>
    </defs>
    <clipPath id="SVGID_2_">
        <use xlink:href="#SVGID_1_"  overflow="visible"/>
    </clipPath>
    <path clip-path="url(#SVGID_2_)" fill="#F4821F" d="M103,205.5c-56.5,0-102.5-46-102.5-102.5C0.5,46.5,46.5,0.5,103,0.5
        c56.5,0,102.5,46,102.5,102.5C205.5,159.5,159.5,205.5,103,205.5z M103,6.5C49.8,6.5,6.5,49.8,6.5,103c0,53.2,43.3,96.5,96.5,96.5
        c53.2,0,96.5-43.3,96.5-96.5C199.5,49.8,156.2,6.5,103,6.5z"/>
</g>
</svg>

 

I've made the radius big to show that it cause slugishness.

I've yet to test it under PC but I've tried it with my Macbook Air (2013/HD5000) and iMac 5k of a colleague.

 

Any ideas would be helpful :)

 

 


#2

Hello,

Have you tried profiling your application? It's always a good place to start where debugging performance is concerned.


#3

I’ve posted the code exactly to show it seems to be within JUCE.
This is not the app but rather an example of how simple code cause such behavior.

I’ll try some profiling but I guess since JUCE folks could have better insight about threading, ui and juce objects.


#4

Things like GlowEffect which need to render and process bitmaps will take a lot of CPU power! Should be much faster in a release build, but on high-res displays you should avoid really heavy operations like this.

As we beef-up the OpenGL renderer in the future hopefully a lot of stuff like this will migrate onto the GPU where it'll be really fast, but at the moment the effects are still CPU-bound.


#5

In the specific code above this seems to resolve a lot:

overlappingCircle_->setBufferedToImage(true);

I've looked for some example usage of setCachedComponentImage but didn't find such even within JUCE Demos.

Wonder if it can be used for better tweaking/optimizing.

 

Thank you!