[·Òë]High Performance JavaScript(033)
Summary ×ܽá
When web pages or applications begin to feel slow, analyzing assets as they come over the wire and profiling scripts while they are running allows you to focus your optimization efforts where they are needed most.
µ±ÍøÒ³»òÓ¦ÓóÌÐò±äÂýʱ£¬·ÖÎöÍøÉÏ´«À´µÄ×ÊÔ´£¬·ÖÎö½Å±¾µÄÔËÐÐÐÔÄÜ£¬Ê¹ÄãÄܹ»¼¯Öо«Á¦ÔÚÄÇЩÐèҪŬÁ¦ÓÅ»¯µÄµØ·½¡£
• Use a network analyzer to identify bottlenecks in the loading of scripts and other page assets; this helps determine where script deferral or profiling may be needed.
ʹÓÃÍøÂç·ÖÎöÆ÷ÕÒ³ö¼ÓÔØ½Å±¾ºÍÆäËüÒ³Ãæ×ÊÔ´µÄÆ¿¾±ËùÔÚ£¬ÕâÓÐÖúÓÚ¾ö¶¨ÄÄЩ½Å±¾ÐèÒªÑÓ³Ù¼ÓÔØ£¬»òÕß½øÐнøÒ»²½·ÖÎö¡£
• Although conventional wisdom says to minimize the number of HTTP requests, deferring scripts whenever possible allows the page to render more quickly, providing users with a better overall experience.
´«Í³µÄÖǻ۸æËßÎÒÃÇÓ¦¾¡Á¿¼õÉÙHTTPÇëÇóµÄÊýÁ¿£¬¾¡Á¿ÑÓ³Ù¼ÓÔØ½Å±¾ÒÔÊ¹Ò³ÃæäÖȾËٶȸü¿ì£¬ÏòÓû§Ìṩ¸üºÃµÄÕûÌåÌåÑé¡£
• Use a profiler to identify slow areas in script execution, examining the time spent in each function, the number of times a function is called, and the callstack itself provides a number of clues as to where optimization efforts should be focused.
ʹÓÃÐÔÄÜ·ÖÎöÆ÷ÕÒ³ö½Å±¾ÔËÐÐʱËÙ¶ÈÂýµÄ²¿·Ö£¬¼ì²éÿ¸öº¯ÊýËù»¨·ÑµÄʱ¼ä£¬ÒÔ¼°º¯Êý±»µ÷ÓõĴÎÊý£¬Í¨¹ýµ÷ÓÃÕ»×ÔÉíÌṩµÄһЩÏßË÷À´ÕÒ³öÄÄЩµØ·½Ó¦µ±Å¬Á¦ÓÅ»¯¡£
• Although time spent and number of calls are usually the most valuable bits of data, looking more closely at how functions are being called might yield other optimization candidates.
ËäÈ»»¨·Ñʱ¼äºÍµ÷ÓôÎÊýͨ³£ÊÇÊý¾ÝÖÐ×îÓмÛÖµµÄµã£¬»¹ÊÇÓ¦µ±×Ðϸ²ì¿´º¯ÊýµÄµ÷Óùý³Ì£¬¿ÉÄÜ·¢ÏÖÆäËüÓÅ»¯·½·¨¡£
These tools help to demystify the generally hostile programming environments that modern code must run in. Using them prior to beginning optimization will ensure that development time is spent focusing on the right problems.
ÕâЩ¹¤¾ßÔÚÄÇЩÏÖ´ú´úÂë
Ïà¹ØÎĵµ£º
±¾ÎÄÖ÷ÒªÊdzöÓÚÓÐÅóÓÑʹÓÃÎÒÔÀ´Ð´µÄautocompleteµÄJS¿Ø¼þ¡£µ±Êý¾ÝÁ¿´óµÄʱºò£¬»á³öÏÖЧÂʼ«ÆäÂýµÄÇé¿ö£¬ÎÒÔÚÕâ¶Îʱ¼ä×ö³öµÄһЩ²âÊÔÒ²¼°Ò»Ð©¾Ñ飬Óë´ó¼Ò·ÖÏí£¬Èç¹ûÓдíµÄµØ·½£¬»¹ÇëÖ¸³ö¡£
¾¹ý²âÊÔ£¬ÎÒÃǻᷢÏÖÈçϵÄÇé¿ö»òÕß˵µÄ½áÂÛ£¬Èç¹ûÄúµÄ²âÊÔ½á¹ûÓëÎҵIJ»·û£¬Çë˵Ã÷ÔÒò£¬ÒÔ±ãÏ໥ѧϰ¡£
1£©µ±Ò»¸ö½Ï´óµÄHTML×Ö· ......
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 ......
Use the Fast Parts ʹÓÃËÙ¶È¿ìµÄ²¿·Ö
Even though JavaScript is often blamed for being slow, there are parts of the language that are incredibly fast. This should come as no surprise, since JavaScript engines are built in lower-level languages and are therefore compiled. Thou ......
Firebug
Firefox is a popular browser with developers, partially due to the Firebug addon (available at http://www.getfirebug.com/), which was developed initially by Joe Hewitt and is now maintained by the Mozilla Foundation. This tool has increased the productivity of web develop ......
Fiddler
Fiddler is an HTTP debugging proxy that examines the assets coming over the wire and helps identify any loading bottlenecks. Created by Eric Lawrence, this is a general purpose network analysis tool for Windows that provides detailed reports on any browser or web request. ......