1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Lack of Interest Reduce JS animations, use CSS instead (performance issue)

Discussion in 'Closed Suggestions' started by CyberAP, Mar 14, 2013.

  1. CyberAP

    CyberAP Well-Known Member

    A simple thing like opening a membercard activates a very slow js proccess which badly affects the overall performance. It may not be very noticeable on the default style (however it still is) but on custom styles with lots of graphics it decreases site FPS to 3-5 frames.

    err.PNG

    The solution: use CSS animations for this and do not recalculate styles. (only manipulate classes in DOM)
     
    Adam Howard and Null like this.
  2. Arty

    Arty Well-Known Member

    Its done by jQuery Tools, not XenForo core.
     
  3. digitalpoint

    digitalpoint Well-Known Member

    CSS3 animations aren't even finalized yet and only supported by the latest versions of browsers. You would be better off making the suggestion to jQuery Tools or jQuery developers... since either way you are going to need JS to trigger the CSS animations most likely, why not have it at the level that does the animation? Then if your browser supports it, it could do it that way, and if it doesn't, it's done the other way.

    My computer is more than 5 years old, and I've never seen any slowdown in JS animations... what browser/version are you using?
     
  4. CyberAP

    CyberAP Well-Known Member

    You're wrong about CSS3 animations support. For the animations that XenForo uses we could just use CSS3 transitions. Support table: http://caniuse.com/#feat=css-transitions
    All modern browsers support CSS3 transitions. So to animate things we just need to have end values (start values should be set by the class).

    As far as I know authors of jQuery plan to remove all of the animating functionality from their library since CSS3 handles it better (at least it can be accelerated with hardware).

    About backwards compatibility: in this case we can (or should I say "must") ignore IE<10 users since JS animations will only slow down the site performance and they do not affect the user experience significantly (for IE users of course).
     
    Adam Howard and DeviateDefiant like this.
  5. Brogan

    Brogan XenForo Moderator Staff Member

    Moved to suggestions as this is not a bug.
     
  6. digitalpoint

    digitalpoint Well-Known Member

    Yep... I know it can be done with prefixes in the latest versions of browsers... but if you look at that same page, it shows 68.16% of users would be able to use it. Cutting off about a third of the users doesn't seem like a wise choice.

    Who told you jQuery authors are going to drop support for their animate() function? I'd actually love a link or something where they even mention that.

    They are far too smart to do that... Rather they would utilize CSS3 animations transparently when they could (that's really the whole premise of jQuery... to make stuff work everywhere) when it was technically appropriate. At which point apps that utilize jQuery.animate() would automatically use CSS3 animations when the browser can do it.
     
    wmtech likes this.
  7. CyberAP

    CyberAP Well-Known Member

Share This Page