2010-04-27 64 views
5

我在查看Twitter的靜態腳本,並注意到所有變量和函數只有1個字符長,爲什麼以及它們如何執行此操作?它與性能有關嗎?如果是這樣,爲什麼他們不給他們網站上的所有元素這些短名稱,可能是2個字符而不是1個,以避免任何衝突。jQuery,JavaScript中變量和函數的單字母名稱

實施例:

(function (A) { 
A.fn.isScreenNameField = function() { 
    return this.each(function() { 
     var M = A(this); 
     var F = A("#signup_username_url"); 
     var E = A("#screen_name_info"); 
     var D = A("#avail_screenname_check_indicator"); 
     var O; 
     var C; 
     var I; 
     var N = M.val(); 
     var G = N; 
     var H = N != ""; 
     var Q = /[a-zA-Z0-9_]/; 

     function K() { 
      if (H) { 
       F.html(M.val()) 
      } 
     } 
     function L() { 
      M.trigger("show-info"); 
      E.hide(); 
      D.show() 
     } 
     function B() { 
      E.show(); 
      D.hide() 
     } 
     function P() { 
      G = O; 
      jQuery.ajax({ 
       type: "GET", 
       url: "https://stackoverflow.com/users/username_available", 
       data: { 
        username: O 
       }, 
       dataType: "json", 
       success: function (R) { 
        if (C) { 
         var S = R.msg; 
         if (R.valid) { 
          M.trigger("is-valid"); 
          F.removeClass("invalid").addClass("valid") 
         } else { 
          M.trigger("is-invalid", R.msg); 
          F.addClass("invalid").removeClass("valid") 
         } 
        } 
       }, 
       beforeSend: null, 
       complete: function() { 
        clearTimeout(twttr.timeouts.availabilityTimeout); 
        B() 
       } 
      }) 
     } 
     function J(R) { 
      O = M.val(); 
      clearTimeout(twttr.timeouts.availabilityTimeout); 
      C = O.match(Q); 
      if (!C) { 
       G = O; 
       B(); 
       return 
      } 
      if (O == G) { 
       return 
      } 
      L(); 
      twttr.timeouts.availabilityTimeout = setTimeout(P, 2000) 
     } 
     M.isSignupFormField({ 
      validateWith: function (R) { 
       if (isBlank(R)) { 
        return _("Please enter a user name") 
       } else { 
        P() 
       } 
      }, 
      allowInput: Q 
     }); 
     M.keyup(function (R) { 
      if (jQuery.inArray(R.keyCode, [16, 17, 18, 20, 27, 33, 34, 35, 37, 38, 39, 40, 144]) == -1) { 
       if (M.val() != "") { 
        H = true 
       } else { 
        M.trigger("show-info") 
       } 
       K(); 
       J() 
      } 
     }); 
     M.bind("value-changed", P); 
     M.bind("custom-validate", P) 
    })P 
} 
}) 

回答

19

此腳本已「精縮」,用較短的名稱代替變量,在不改變功能的自動化技術。例如,參見JSMin。目標是在將腳本發送到客戶端時減少下載時間和帶寬。

+6

我認爲克羅克福德稱這種特殊技術爲「混淆」。 JSMin不會更改變量名稱,因爲Crockford不喜歡混淆,因爲他認爲它可能會導致錯誤 – Bob 2010-04-27 16:40:23

+0

好點。 [YUI Compressor](http://developer.yahoo.com/yui/compressor/)既縮小又「混淆」。 – kevingessner 2010-04-27 17:07:59

1

Javascript是客戶端,所以你必須加載腳本。我認爲,下載較少的文字意味着更好的表現。

0

可能有很多原因,爲什麼他們這樣做,列舉了常見的:

調低作爲很多人使用Twitter的腳本的文件大小。

2

他們通過諸如http://developer.yahoo.com/yui/compressor/之類的東西來運行他們的腳本,以減小它們的大小,從而減少需要加載的時間。

這一切都是爲了減少網站加載時間而完成的。
近年來,這個話題變得像一個新領域,特別是由於像史蒂夫斯陶德斯的談話那樣的事情:http://stevesouders.com/