[·Òë]High Performance JavaScript(027)
µÚ¾ÅÕÂ
Building and Deploying High-Performance JavaScript Applications
´´½¨²¢²¿Êð¸ßÐÔÄÜJavaScriptÓ¦ÓóÌÐò
According to a 2007 study by Yahoo!'s Exceptional Performance team, 40%–60% of Yahoo!'s users have an empty cache experience, and about 20% of all page views are done with an empty cache (http://yuiblog.com/blog/2007/01/04/performance-research-part-2/). In addition, another more recent study by the Yahoo! Search team, which was independently confirmed by Steve Souders of Google, indicates that roughly 15% of the content delivered by large websites in the United States is served uncompressed.
¸ù¾ÝYahoo!׿ԽÐÔÄÜÍŶÓÔÚ2007Äê½øÐеÄÑо¿£¬40%-60%µÄYahoo!Óû§Ã»ÓÐʹÓûº´æµÄ¾Ñ飬´óÔ¼20%Ò³ÃæÊÓͼ²»Ê¹Óûº´æ£¨http://yuiblog.com/blog/2007/01/04/performance-research-part-2/£©¡£ÁíÍ⣬ÓÉYahoo!Ñо¿Ð¡×é·¢ÏÖ£¬²¢ÓÉGoogleµÄSteve SoudersËù֤ʵµÄÒ»Ïî×îÐÂÑо¿±íÃ÷£¬´óÔ¼15%µÄÃÀ¹ú´óÐÍÍøÕ¾ËùÌṩµÄÄÚÈÝûÓÐѹËõ¡£
These facts emphasize the need to make sure that JavaScript-based web applications are delivered as efficiently as possible. While part of that work is done during the design and development cycles, the build and deployment phase is also essential and often overlooked. If care is not taken during this crucial phase, the performance of your application will suffer, no matter how much effort you've put into making it faster.
ÕâЩÊÂʵǿµ÷ÓбØÒªÈ·±£ÄÇЩ»ùÓÚJavaScriptµÄÍøÒ³Ó¦Óþ¡Á¿¸ßЧµØ·¢²¼¡£ËäÈ»²¿·Ö¹¤×÷ÔÚÉè¼Æ¿ª·¢¹ý³ÌÖÐÒѾÍê³É£¬µ«¹¹½¨ºÍ²¿Êð¹ý³ÌÒ²ºÜÖØÒªÇÒÍùÍù±»ºöÊÓ¡£Èç¹ûÔÚÕâ¸ö¹Ø¼ü¹ý³ÌÖв»¹»Ð¡ÐÄ£¬ÄãÓ¦ÓóÌÐòµÄÐÔÄܽ«Êܵ½Ó°Ï죬ÎÞÂÛÄãÔõÑùŬÁ¦Ê¹Ëü¸ü¿ì¡£
The purpose of this chapter is to give you the necessary knowledge to efficiently assemble and deploy a JavaScript-based web application. A number of concepts are illustrated using Apache Ant, a Java-based build tool that has quickly become an industry standard for building applications for the Web. Toward the end of the chapter, a custo
Ïà¹ØÎĵµ£º
±¾ÎÄÖ÷ÒªÊdzöÓÚÓÐÅóÓÑʹÓÃÎÒÔÀ´Ð´µÄautocompleteµÄJS¿Ø¼þ¡£µ±Êý¾ÝÁ¿´óµÄʱºò£¬»á³öÏÖЧÂʼ«ÆäÂýµÄÇé¿ö£¬ÎÒÔÚÕâ¶Îʱ¼ä×ö³öµÄһЩ²âÊÔÒ²¼°Ò»Ð©¾Ñ飬Óë´ó¼Ò·ÖÏí£¬Èç¹ûÓдíµÄµØ·½£¬»¹ÇëÖ¸³ö¡£
¾¹ý²âÊÔ£¬ÎÒÃǻᷢÏÖÈçϵÄÇé¿ö»òÕß˵µÄ½áÂÛ£¬Èç¹ûÄúµÄ²âÊÔ½á¹ûÓëÎҵIJ»·û£¬Çë˵Ã÷ÔÒò£¬ÒÔ±ãÏ໥ѧϰ¡£
1£©µ±Ò»¸ö½Ï´óµÄHTML×Ö· ......
³£¹æµÄ·½·¨Êǽ«ÄêÔÂÈÕÈ¡³ö£¬È»ºó·Ö±ðÅжϷ¶Î§£¬È»ºó¾ÍÅжÏÈòÄê2ÔµÄÌìÊý
¿ÉÒÔͨ¹ýnew Date(string)µÄ¹¹Ô죬±È½ÏÄêÔÂÈÕ×Ö·ûÊÇ·ñ·¢Éú±ä»¯Åжϡ£
function CheckDate(text) {
if (!text) return false;
text = text.replace(/[\/-]0?/g, "/");
if (!text.match(/^\d{4}\/\d{1,2}\/\d{1,2}$/)) return true;
......
Repaints and Reflows ÖØ»æºÍÖØÅŰæ
Once the browser has downloaded all the components of a page—HTML markup, JavaScript, CSS, images—it parses through the files and creates two internal data structures:
µ±ä¯ÀÀÆ÷ÏÂÔØÍêËùÓÐÒ³ÃæHTML±ê¼Ç£¬JavaScri ......
Data Formats Êý¾Ý¸ñʽ
When considering data transmission techniques, you must take into account several factors: feature set, compatibility, performance, and direction (to or from the server). When considering data formats, the only scale you need for comparison is speed.
......