javascript - これらのjquery関数を最適化するには?

Question

私は、javascript を多用するユーザー インターフェイス アプリケーションに取り組んでいます。（少なくとも私にとっては集中的です。これは私の最初の本格的な JavaScript プロジェクトです）。

adivがロールオーバーまたはmouseout. たとえばdivs、ドラッグ可能なオブジェクトがいくつかあるため、それらがmouseover編集されると、カーソルは移動する準備ができているように見える必要があります。しかし、私のインターフェースは非常に遅いので、上司は私のコードが機能していないと思っています。div期待通りに見えるように。ほんの一例です。私のコードは以下のようなものです。私の会社が著作権を持っているため、完全にまたは適切に再現することはできませんが、私がやっている方法を明確に示すために:

$.fn.extend({
    mouseoverBox: function() {
    return this.each(function() {
        var $this = $(this);   
                if(!$this.hasClass('ready')) 
                {   if($this.hasClass('activated'))
                    {
                        $this.removeClass('activated');
                    }
                    $this.addClass('ready');
                }
                var img_id = $this.children('.theimg').attr('id');
                //someitem.children('somechildren').remove();
                //someitem.append(somemenu div)
                //$this.draggable();
                //$this.resizable();
                if($this.hasClass('unlocked'))
                {
                    $this.draggable( "option", "disabled", false );
                    $this.resizable( "option", "disabled", false );
                }
                $this.bindUnlock();
            });
     }
// end mouseoverBox
});

これは単なる mouseoverBox 関数であり、 のようにトリガーされmyBox.mouseoverBox()ます。マウスオーバーイベントで。もちろん、このプラグインはbindUnlock()、クラスの変更やメニューへのクラスの追加などの簡単な操作を行う呼び出しです。また、通常、マウスオーバーの前に、mouseout別のマウスオーバーが発生してdivいます...そのため、多くのことが起こっていることがわかります。ただし、通常、一度に 10 を超えるインタラクティブはありませんdivs。この種のコードを最適化するにはどうすればよいですか? 私はすべての詳細を示したわけではありませんが、関連するほとんどのものはほとんどこのようなものだと信じてください.

JavaScript、CSS、画像、およびフォントを既に gzip しました。Yahoo Compressor を使用して縮小も試みましたが、実際にはファイルの 1 つが圧縮されずに肥大化してしまいました。