Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums Design Better performances alternatives for this effect

  • This topic is empty.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #269658
    Artemis
    Participant

    I’m trying to find an alternative way to display this svg+css animation I made,

    due to it’s rather poor performances.

    The animation surronds a <div> covering about the entire screen, so it’s rendered usually at high resolutions (I think that’s why the framerate is truggling).

    I am quite sure the guilty is the gaussian blur applied on the path, but I can’t think of any other way to achieve the same result, and that’s why I’m here :) .

    • by using a canvas, I wouldn’t know how to make the path glow
    • using a gif, or a video, is out of discussion

    And those are all the techniques I know.

    What would you use in this situation?

    CodePen snippet:
    https://codepen.io/Lucide/pen/zWeemw

    I don’t actually need the blur filter, I just need that gradient along the path (neon style), any alternative way to do that is more than welcome

    #269717
    Artemis
    Participant

    Anyone? ༼ つ ಥ_ಥ ༽つ

    #269722
    Pogany
    Participant

    This may cause your problem: stroke-dashoffset: -2760;
    Try using only positive numbers with stroke-dashoffset since there are some issues when using negative stroke-dashoffset values.
    I hope this may help.

    #269742
    Artemis
    Participant

    Oh, thank you! (:
    That’s good to know
    I’ll definitely try that and update with results.

    #269853
    Artemis
    Participant

    Using positive dash offsets didn’t solve the bad framerate.
    Seems like the gaussian blur is recalculated at every frame.

    I need a trick to show that glow in a cheaper way

    #269854
    Artemis
    Participant

    Using positive dash offsets didn’t solve the bad framerate.
    Seems like the gaussian blur is recalculated at every frame.

    I need a trick to show that glow in a cheaper way

Viewing 6 posts - 1 through 6 (of 6 total)
  • The forum ‘Design’ is closed to new topics and replies.