CODEWITHSUNDEEP
javascriptjqueryjquery-animatecpu-usage
user289554
user289554

Reputation:

Jquery CPU usage

I am using Jquery to make an image scroll across my page horizontally. The only problem is that it uses a serious amount of cpu usage. Up to 100% on a single core laptop in firefox. What could cause this???

Jquery 

<script>
    jQuery(document).ready(function() {

    $(".speech").animate({backgroundPosition: "-6000px 0px"}, 400000, null);
    });

    </script>

CSS

.speech {
    /*position:fixed;*/
    top:0;
    left:0px;
    height:400px;
    width:100%;
    z-index:-1;
    background:url(/images/speech.png) -300px -500px repeat-x;
    margin-right: auto;
    margin-left: auto;
    position: fixed;
}

HTML

<div class="speech"></div>

Upvotes: 7

Views: 6021

Answers (4)

NickGPS
NickGPS

Reputation: 1519

In-case anyone is looking for a solution to high CPU usage when using jQuery animations (as I was) then it's worth noting that jQuery.fx.interval was added to jQuery 1.4.3 so you can control the animation interval rate.

Example of use (setting this to around 50-70 kept my animations smooth and I noticed CPU usage dropped down to about 10-20%):

jQuery.fx.interval = 50;

Upvotes: 11

user289554
user289554

Reputation:

The best way to achieve this is by using a plugin such as http://www.spritely.net/download/

Upvotes: 0

Pointy
Pointy

Reputation: 413856

It's using up CPU resources because you're asking the browser to repaint an image many times per second over a long period of time. That's not free.

Upvotes: 12

Andreas
Andreas

Reputation: 5335

If this is a memory-cpu related issue then you can nullify the result of the jQuery function call. If your call returns a jQuery Object then after the call you can set it to null:

var tmp = $(".speech").animate({backgroundPosition: "-6000px 0px"}, 400000, null);
});
tmp = null;

Note: If this IS in ANY WAY related with the memory leak then it has to do with circular references and by setting to null you can break it.

Give it a try, i would like to know the results if you have the time to post.

Upvotes: 0

Related Questions