最適化Javascriptコード

Question

私はコード

$("document").ready(function($) { 
     var num = $('#menu').offset().top; 
     var num2 = $('#HTML2').offset().top; 
     var nav = $('#menu'); 
     var nav2 = $('#HTML2'); 
     $(window).scroll(function() { 
      if ($(this).scrollTop() > num) { 
       nav.addClass("menu-scroll"); 
      } else { 
       nav.removeClass("menu-scroll"); 
      } 
      if ($(this).scrollTop() > num2) { 
       nav2.addClass("html2fixs"); 
      } else { 
       nav2.removeClass("html2fixs"); 
      } 
     }); 
    $('#BackToTop').click(function(){ 
     $('html, body').animate({scrollTop : 0},300); 
     return false; 
    }); 
}); 

をJS &圧縮を最適化し、自分のサイト内のすべてのJavaScriptコードを加速する方法上の任意のヒントを喜ばせるためにどのような方法を喜ば？

Answer 1

toggleScriptというJQuery関数を使用すると、コードが短くなります。また、コードを読みやすくするために、すべての変数をnum1とnum2と呼ぶだけでなく、要素を変数に保存したときに、もう一度${}を呼び出す必要はありません。代わりに変数を使用してください。あなたは、特定の問題を抱えている場合を除き

$("document").ready(function() { 
 
    var menu = $('#menu'); //nav 
 
    var html2 = $('#HTML2'); //nav2 
 

 
    var menuOffsetTop = menu.offset().top; //num 
 
    var html2OffsetTop = html2.offset().top; //num2 
 

 

 
    $(window).scroll(function() { 
 
     var w = $(this); 
 

 
     menu.toggleClass('menu-scroll' , (w.scrollTop() > menuOffsetTop)); 
 
     /* 
 
     The same as 
 
     if (w.scrollTop() > menuOffsetTop) { 
 
      menu.addClass('menu-scroll') ; 
 
     } else { 
 
      menu.removeClass('menu-scroll'); 
 
     } 
 
     */ 
 
     html2.toggleClass('html2fixs' , (w.scrollTop() > html2OffsetTop)); 
 
    }); 
 

 
    $('#BackToTop').click(function(){ 
 
     $('html, body').animate({scrollTop : 0},300); 
 
    }); 
 
});