1

こんにちはすべて私はかなり簡単な機能を持っています

enableModule : function(moduleName){
        var module = $('div#'+moduleName);
        console.log('enabling '+moduleName);
        console.time('animate');
        module.animate({'opacity' : '1.0'}, 300, function(){console.timeEnd('animate');});
        module.find('.disabled_sheild').remove();
        module.removeClass('disabled');
        console.log('end of enable Module');
    }

アニメーション自体、不透明度の変化は非常に高速ですが、呼び出すのが遅れるようなものです。console.time（）は、2540MS以上の時間を報告しています。div＃moduleがその子と一緒にアニメーション化されているためかもしれないと思いますか？しかし、同じことを逆に実行し、妥当な速度で実行される別の関数「disableModule」があるため、このdosentは理にかなっています。

これがモジュールの無効化機能です。かなり多くのことが行われていますが、約242msの時間が返されます

disableModule : function(moduleName){
      $('div#'+moduleName+', div.'+moduleName).each(function(){
        var module = $(this);
        module.prepend('<div class="disabled_sheild"></div>');
        var sheild = module.find('.disabled_sheild');
        sheild.css({'position' : 'absolute', 'z-index' : '200'});
        sheild.width(module.width());
        sheild.height(module.height());
        jQuery.each(jQuery.browser, function(i) {
            if($.browser.msie){
               //module.css("display","none");
               //if using ie give sheild a transparent background layout
            }else{
              console.time('animate');
              module.animate({'opacity' : '0.5'}, function(){ console.timeEnd('animate');});
            }
          });
      });
    }
4

2 に答える 2

3

いくつかの骨の折れるトラブルシューティングの後、私はそれを、disableメソッドのブラウザー検出ループの問題であると追跡しました。

  jQuery.each(jQuery.browser, function(i) {
      if($.browser.msie){
         //module.css("display","none");
         //if using ie give sheild a transparent background layout
      }else{
        console.time('animate');
        module.animate({opacity : 0.5}, 200, function(){console.timeEnd('animate');});
      }
    });

このブロックをコメントアウトすると、すべてがスピードアップしました。他のすべてを最適化しようとした後、私はほとんど髪を抜いた。

于 2009-11-28T00:09:08.493 に答える
1

単純にそれらを再調整してみましたか？

module.find('.disabled_sheild').remove();
module.removeClass('disabled');
module.animate({'opacity' : '1.0'}, 300, function(){console.timeEnd('animate');});

アニメーションは非同期で発生し、findandremoveメソッドはリソースを消費する可能性があります（特にfindDOMツリーをウォークするため）。そうでなければアニメーションに使用される可能性があります。

また、disableメソッドで「無効なシールド」を動的に作成しているので、それを保存することができます

module.data("disabledShield", module.prepend('<div class="disabled_sheild"></div>'));

メソッドでその参照を使用してenable、DOMウォークを回避します

module.data("disabledShield").remove();
module.removeClass('disabled');
module.animate({'opacity' : '1.0'}, 300, function(){console.timeEnd('animate');});

（ドキュメントについては、 http：//docs.jquery.com/Internals/jQuery.data$.dataを参照してください）

于 2009-11-26T03:00:01.240 に答える