Есть ли способ исправить / переделать этот скрипт jQuery, чтобы он мог занимать меньше памяти и работать быстрее? (Я использую 1.6.2) - PullRequest
Новая
       10

Есть ли способ исправить / переделать этот скрипт jQuery, чтобы он мог занимать меньше памяти и работать быстрее? (Я использую 1.6.2)

2 голосов
/ 01 августа 2011

Я новичок в jQuery, я делал слайд-карусель, и я не знаю, пропустил ли я что-то здесь, поэтому, пожалуйста, посмотрите на мой сценарий: 

function gotoItem(main, hidden, con, speed, state) {
con.css('display', 'none');
switch(state) {
    case 'next' :
    main.children(':first').appendTo(hidden).css('left','0px');
    hidden.children(':first').appendTo(main).css('left', '730px');
    lmove = '-=120px';
    middle = 3;
    end = 6;
    break
    case 'prev' :
    main.children(':last').prependTo(hidden).css('left', '0px');
    hidden.children(':last').prependTo(main).css('left', '-230px');
    lmove = '+=120px';
    middle = 3;
    end = 6;
    break;
}

main.children().each(function(i) {
    if(i==end) {
        $(this).stop().animate({
        left: lmove
        }, speed, function() {
        con.css('display', 'block');
        });
    } else {
        if(i==middle) {
            $(this).stop().animate({
            left: lmove,
            opacity : 1
            }, speed);
        } else {
            $(this).stop().animate({
            left: lmove,
            opacity : 0.3
            }, speed);
        }
    }
    });
}

На самом деле ничего нетчто-то не так с кодом, но он действительно меня беспокоил, когда я узнал, что скрипт потребляет много памяти (около 100 КБ каждый раз, когда запускается функция), и не говоря уже о том, что процессор был запущен и выключен примерно на 20-30 процентов (яЯ использую одноядерный ноутбук и мой браузер - Chrome 12).Я тестировал его с Firefox, и результат в основном тот же.Итак, какие-либо предложения?Как мне переписать скрипт, чтобы он мог работать быстрее / меньше утечек памяти?Или, может быть, я больше ничего не могу сделать со сценарием?Заранее спасибо

1 Ответ

1 голос
/ 01 августа 2011

анимация свойства left всегда занимает много памяти.Вы могли бы скорее использовать перекрывающий div с указанным overflow:hidden;, а затем использовать .scrollLeft() для анимации слайдов.

См. jQuery для дизайнеров - Забава с переполнением

Это уже ведет нас к другому моменту, когда вы можете сэкономить ресурсы.Вместо добавления и добавления элементов, которые браузер должен отображать впоследствии, вы сначала загружаете контент и просто скрываете его.Это, безусловно, решение в зависимости от производительности и времени загрузки, и оно не может быть столь впечатляющим для вашей общей производительности, но в целом следует избегать тяжелой манипуляции с Dom, если вы нацелены на машины более низкого уровня.

...