[·Òë]High Performance JavaScript(019)
µÚÁùÕ Responsive Interfaces ÏìÓ¦½Ó¿Ú
There's nothing more frustrating than clicking something on a web page and having nothing happen. This problem goes back to the origin of transactional web applications and resulted in the now-ubiquitous "please click only once" message that accompanies most form submissions. A user's natural inclination is to repeat any action that doesn't result in an obvious change, and so ensuring responsiveness in web applications is an important performance concern.
ûÓÐʲô±Èµã»÷Ò³ÃæÉϵĶ«Î÷ȴʲôҲû·¢Éú¸üÁîÈ˸е½´ìÕÛÁË¡£Õâ¸öÎÊÌâÓֻص½ÁËÔÊ¼ÍøÒ³½»»¥³ÌÐòºÍÏÖÔÚÒÑÎÞ´¦²»ÔÚµÄÌá½»±íµ¥Ê±µ¯³öµÄ“ÇëÎðÖØ¸´Ìá½»”ÏûÏ¢ÉÏÃæ¡£Óû§×ÔÈ»ÇãÏòÓÚÖØ¸´³¢ÊÔÕâЩ²»·¢ÉúÃ÷ÏԱ仯µÄ¶¯×÷£¬ËùÒÔÈ·±£ÍøÒ³Ó¦ÓóÌÐòµÄÏìÓ¦ËÙ¶ÈÒ²ÊÇÒ»¸öÖØÒªµÄÐÔÄܹØ×¢µã¡£
Chapter 1 introduced the browser UI thread concept. As a recap, most browsers have a single process that is shared between JavaScript execution and user interface updates. Only one of these operations can be performed at a time, meaning that the user interface cannot respond to input while JavaScript code is executed and vice versa. The user interface effectively becomes "locked" when JavaScript is executing; managing how long your JavaScript takes to execute is important to the perceived performance of a web application.
µÚÒ»½Ú½éÉÜÁËä¯ÀÀÆ÷UIÏ̸߳ÅÄî¡£×ܵÄÀ´Ëµ£¬´ó¶àÊýä¯ÀÀÆ÷ÓÐÒ»¸öµ¥¶ÀµÄ´¦Àí½ø³Ì£¬ËüÓÉÁ½¸öÈÎÎñËù¹²Ïí£ºJavaScriptÈÎÎñºÍÓû§½çÃæ¸üÐÂÈÎÎñ¡£Ã¿¸öʱ¿ÌÖ»ÓÐÆäÖеÄÒ»¸ö²Ù×÷µÃÒÔÖ´ÐУ¬Ò²¾ÍÊÇ˵µ±JavaScript´úÂëÔËÐÐʱÓû§½çÃæ²»ÄܶÔÊäÈë²úÉú·´Ó¦£¬·´Ö®ÒàÈ»¡£»òÕß˵£¬µ±JavaScriptÔËÐÐʱ£¬Óû§½çÃæ¾Í±»“Ëø¶¨”ÁË¡£¹ÜÀíºÃJavaScriptÔËÐÐʱ¼ä¶ÔÍøÒ³Ó¦ÓõÄÐÔÄܺÜÖØÒª¡£
The Browser UI Thread ä¯ÀÀÆ÷UIÏß³Ì
The process shared by JavaScript and user interface updates is frequently referred to as the browser UI thread (though the term "thread" is not necessarily accurate for all browsers). The UI thread works on a sim
Ïà¹ØÎĵµ£º
±¾ÎÄÖ÷ÒªÊdzöÓÚÓÐÅóÓÑʹÓÃÎÒÔÀ´Ð´µÄautocompleteµÄJS¿Ø¼þ¡£µ±Êý¾ÝÁ¿´óµÄʱºò£¬»á³öÏÖЧÂʼ«ÆäÂýµÄÇé¿ö£¬ÎÒÔÚÕâ¶Îʱ¼ä×ö³öµÄһЩ²âÊÔÒ²¼°Ò»Ð©¾Ñ飬Óë´ó¼Ò·ÖÏí£¬Èç¹ûÓдíµÄµØ·½£¬»¹ÇëÖ¸³ö¡£
¾¹ý²âÊÔ£¬ÎÒÃǻᷢÏÖÈçϵÄÇé¿ö»òÕß˵µÄ½áÂÛ£¬Èç¹ûÄúµÄ²âÊÔ½á¹ûÓëÎҵIJ»·û£¬Çë˵Ã÷ÔÒò£¬ÒÔ±ãÏ໥ѧϰ¡£
1£©µ±Ò»¸ö½Ï´óµÄHTML×Ö· ......
Òþ²Ø³ÉÔ±±äÁ¿
ÔÚº¯ÊýÌåÄÚ¶¨ÒåµÄ±äÁ¿Îª¾Ö²¿±äÁ¿£¬À뿪º¯Êý¾Í¹ÒµôÁË
ÔÚº¯ÊýÌåÄÚʹÓÃthis.³ÉÔ±±äÁ¿Ãû£¬ÔòΪwindow¶ÔÏó¼¶±äÁ¿£¬¼´È«¾Ö±äÁ¿
¹ÊÐèÒªÕâÑùÒþ²Ø³ÉÔ±±äÁ¿£¬ÏòÍâÖ»±©Â¶get¡¢setº¯Êý
function testClass(name){
var _firstname=name;
return {
getname : function() {
return _fir ......
AJAX (Òì²½ JavaScript ºÍ XML) ÊǸöвúÉúµÄÊõÓï,רΪÃèÊöJavaScriptµÄÁ½ÏîÇ¿´óÐÔÄÜ.ÕâÁ½ÏîÐÔ
ÄÜÔÚ¶àÄêÀ´Ò»Ö±±»ÍøÂ翪·¢ÕßËùºöÂÔ,Ö±µ½×î½üGmail, Google suggestºÍgoogle MapsµÄºá¿Õ³öÊÀ²ÅʹÈË
ÃÇ¿ªÊ¼Òâʶµ½ÆäÖØÒªÐÔ.
ÕâÁ½Ïî±»ºöÊÓµÄÐÔÄÜÊÇ:
* ÎÞÐèÖØÐÂ×°ÔØÕû¸öÒ³Ãæ±ãÄÜÏò·þÎñÆ÷·¢ËÍÇëÇó.
* ¶ÔXMLÎĵµµÄ½âÎöºÍ´¦Àí£®
......
Conditionals Ìõ¼þ±í´ïʽ
Similar in nature to loops, conditionals determine how execution flows through JavaScript. The traditional argument of whether to use if-else statements or a switch statement applies to JavaScript just as it does to other languages. Since different b ......
Recursion Patterns µÝ¹éģʽ
When you run into a call stack size limit, your first step should be to identify any instances of recursion in the code. To that end, there are two recursive patterns to be aware of. The first is the straightforward recursive pattern represented ......