[·Òë]High Performance JavaScript(031)
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 developers worldwide by providing insights into code that were never before possible.
¶Ô¿ª·¢ÈËÔ±À´Ëµ£¬FirefoxÊÇÒ»¸öʱ÷ÖµÄä¯ÀÀÆ÷£¬²¿·ÖÔÒòÊÇFirebug²å¼þ£¨http://www.getfirebug.com/£©ÓÉJoe HewittÊ×´´ÏÖÔÚÓÉMozilla»ù½ð»áά»¤¡£´Ë¹¤¾ß¾ßÓÐǰËùδÓеĴúÂë¶´²ìÁ¦£¬Ìá¸ßÁËÈ«ÊÀ½çÍøÒ³¿ª·¢ÕßµÄÉú²úÁ¦¡£
Firebug provides a console for logging output, a traversable DOM tree of the current page, style information, the ability to introspect DOM and JavaScript objects, and more. It also includes a profiler and network analyzer, which will be the focus of this section. Firebug is also highly extensible, enabling custom panels to be easily added.
FirebugÌṩÁËÒ»¸ö¿ØÖÆÌ¨ÈÕÖ¾Êä³ö£¬µ±Ç°Ò³ÃæµÄDOMÊ÷ÏÔʾ£¬ÑùʽÐÅÏ¢£¬Äܹ»·´¹ÛDOMºÍJavaScript¶ÔÏó£¬ÒÔ¼°¸ü¶à¹¦ÄÜ¡£Ëü»¹°üÀ¨Ò»¸öÐÔÄܺÍÍøÂç·ÖÎöÆ÷£¬ÕâÊDZ¾½ÚµÄÖØµã¡£FirebugÒ×ÓÚÀ©Õ¹£¬¿ÉÌí¼Ó×Ô¶¨ÒåÃæ°å¡£
Console Panel Profiler ¿ØÖÆÌ¨Ãæ°å·ÖÎöÆ÷
The Firebug Profiler is available as part of the Console panel (see Figure 10-1). It measures and reports on the execution of JavaScript on the page. The report details each function that is called while the profiler is running, providing highly accurate performance data and valuable insights into what may be causing scripts to run slowly.
Firebug·ÖÎöÆ÷ÊÇ¿ØÖÆÌ¨Ãæ°åµÄÒ»²¿·Ö£¨Èçͼ10-1£©¡£Ëü²âÁ¿²¢±¨¸æÒ³ÃæÖÐÔËÐеÄJavaScript¡£µ±·ÖÎöÆ÷ÔËÐÐʱ£¬±¨¸æÉîÈ뵽ÿ¸ö±»µ÷Óú¯ÊýµÄϸ½Ú£¬Ìṩ¸ß¾«È·µÄÐÔÄÜÊý¾ÝºÍ±äÁ¿²ì¿´¹¦ÄÜ£¬£¨ÓÐÖúÓÚ£©ÕÒ³ö¿ÉÄܵ¼Ö½ű¾ÔËÐбäÂýµÄÔÒò¡£
Figure 10-1. FireBug Console panel
ͼ 10-1 FireBug¿ØÖÆÌ¨Ãæ°å
One way to run a profile is by clicking the Profile button, triggering the script, and clicking the P
Ïà¹ØÎĵµ£º
AJAX (Òì²½ JavaScript ºÍ XML) ÊǸöвúÉúµÄÊõÓï,רΪÃèÊöJavaScriptµÄÁ½ÏîÇ¿´óÐÔÄÜ.ÕâÁ½ÏîÐÔ
ÄÜÔÚ¶àÄêÀ´Ò»Ö±±»ÍøÂ翪·¢ÕßËùºöÂÔ,Ö±µ½×î½üGmail, Google suggestºÍgoogle MapsµÄºá¿Õ³öÊÀ²ÅʹÈË
ÃÇ¿ªÊ¼Òâʶµ½ÆäÖØÒªÐÔ.
ÕâÁ½Ïî±»ºöÊÓµÄÐÔÄÜÊÇ:
* ÎÞÐèÖØÐÂ×°ÔØÕû¸öÒ³Ãæ±ãÄÜÏò·þÎñÆ÷·¢ËÍÇëÇó.
* ¶ÔXMLÎĵµµÄ½âÎöºÍ´¦Àí£®
......
µÚËÄÕ Algorithms and Flow Control Ëã·¨ºÍÁ÷³Ì¿ØÖÆ
The overall structure of your code is one of the main determinants as to how fast it will execute. Having a very small amount of code doesn't necessarily mean that it will run quickly, and having a large amount of code ......
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 ......
µÚÎåÕ Strings and Regular Expressions ×Ö·û´®ºÍÕýÔò±í´ïʽ
Practically all JavaScript programs are intimately tied to strings. For example, many applications use Ajax to fetch strings from a server, convert those strings into more easily usable JavaScript objects, and ......
Data Format Conclusions Êý¾Ý¸ñʽ×ܽá
Favor lightweight formats in general; the best are JSON and a character-delimited custom format. If the data set is large and parse time becomes an issue, use one of these two techniques:
×ܵÄÀ´ËµÔ½ÇáÁ¿¼¶µÄ¸ñʽԽºÃ£¬× ......