±¾ÎÄÕë¶Ô SwissDev Jobs ÍøÕ¾µÄÓÅ»¯Êµ¼ù£¬½éÉÜÎÒÃÇÊÇÈçºÎ°ÑÍøÕ¾¼ÓÔØʱ¼ä¼õÉÙ24% µÄ¡£
ÉÏÖÜ£¬ÎÒÃÇÓлú»á¶Ô SwissDev Jobs ÍøÕ¾ÐÔÄܽøÐÐÁË΢µ÷¡£
Ö®ËùÒÔÒªÌáÉý SwissDevJobs.ch ÍøÕ¾ÐÔÄÜ£¬Ö÷ÒªÊÇÓÐÁ½·½ÃæÔÒò£º
Á¼ºÃµÄÓû§ÌåÑ顪¡ª¼´¼ÓÔØʱ¼ä¸ü¶Ì£¨ÇÒ»¥¶¯ÐÔ¸üºÃ£©ºÍʹÓÃʱµÄÓäÔøР;
SEO¡ª¡ª ÎÒÃǵÄÁ÷Á¿ÑÏÖØÒÀÀµ¹È¸èËÑË÷£¬¶øÇÒÄãÒ²ÐíÖªµÀ¹È¸è±È½ÏÇàíùÐÔÄÜÁ¼ºÃµÄÍøÕ¾£¨¹È¸èÉõÖÁÔÚËÑË÷¿ØÖÆ̨ÖÐÒýÈëÁËËٶȱ¨¸æ£©¡£
µ±ËÑË÷¡°website performance basics¡±Ê±£¬Äã»áµÃµ½Ðí¶à²Ù×÷½¨Ò飬ÀýÈ磺
Õë¶ÔÒÔÉÏÕâЩ½¨Ò飬ÎÒÃǽøÐÐÁ˲¿·Ö¸Ä½ø¡£ÁíÍ⣬ÓÉÓÚÎÒÃǵÄÖ÷Ò³Ãæ»ù±¾ÉÏÊÇÒ»¸ö¿É¹ýÂ˵ÄÁÐ±í£¨Óà React ±àдµÄ£©£¬ÎÒÃÇÒýÈëÁËreact-window À´Ã¿´ÎäÖȾ 10 ¸öÁбíÏ¶ø²»ÊÇ 250 ¸ö¡£
ËùÓÐÕâЩ¶¼°ïÖúÎÒÃǼ«´óµØÌáÉýÁËÍøÕ¾ÐÔÄÜ£¬µ«´ÓËٶȱ¨¸æÀ´¿´£¬ÎÒÃÇ»¹¿ÉÒÔ×öµÃ¸üºÃ¡£
Òò´ËÎÒÃÇ¿ªÊ¼ÉîÍÚ¸ü¶à²»Ñ°³£µÄ·½·¨À´ÈÃÍøÕ¾±äµÃ¸ü¿ì... ÏÖÔÚ¿´À´£¬ÎÒÃǷdz£³É¹¦£¡ÏÂÃæÊÇÕâÖܵı¨¸æ£º
Õâ¸ö±¨¸æÏÔʾ£¬ÍêÕûµÄ¼ÓÔØʱ¼ä¼õÉÙÁË 24%£¡
ÎÒÃÇÊÇÈçºÎ×öµ½ÕâÒ»µãµÄÄØ£¿
ÕâÌõÔÚ index.html ÎļþÖеļòµ¥´úÂëÏòä¯ÀÀÆ÷±íÃ÷£ºËüÓ¦¸ÃÔÚÕâ¸ö×ÊÔ´±»À´×Ô JavaScript µÄ AJAX »ò Fetch µ÷ÓÃʵ¼ÊÇëÇóÇ°»ñÈ¡¡£
µ±ÐèÒª»ñÈ¡Êý¾Ýʱ£¬Ëü»á´Óä¯ÀÀÆ÷»º´æÖжÁÈ¡¶ø²»ÊÇÖØлñÈ¡¡£Õâ°ïÖúÎÒÃǼõÉÙÁË´óÔ¼ 0.5s µÄ¼ÓÔØʱ¼ä¡£
ÎÒÃǺÜÔç¾ÍÏëʵÏÖÕâÒ»µãÁË£¬µ«ÊǹýÈ¥ÔÚ Chrome ä¯ÀÀÆ÷ÖÐÒ»Ö±ÓÐÎÊÌâ¶øµ¼ÖÂÖظ´ÏÂÔØÁ½´Î¡£¶øÏÖÔÚËü¿ÉÒÔÕý³£ÉúЧÁË¡£
ÔÚʵÏÖÁË JSON Ô¤¼ÓÔغó£¬ÎÒÃÇ·¢ÏÖְλÁбíµÄÏÂÔØÈÔÈ»ÊÇÆ¿¾±ËùÔÚ£¨µÈ´ý 0.8s ´Ó·þÎñÆ÷»ñµÃÏìÓ¦£©¡£Òò´Ë£¬ÎÒÃǾö¶¨´Ó·þÎñ¶Ë»º´æÈëÊÖ¡£
Ê×ÏÈ£¬ÎÒÃdz¢ÊÔÁË node-cache£¬µ«ÁîÈ˳ԾªµÄÊÇ£¬Ëü²¢Ã»ÓÐÓÅ»¯»ñȡʱ¼ä¡£
ÖµµÃÒ»ÌáµÄÊÇ£¬/api/jobs ½Ó¿ÚÊÇÒ»¸ö¼òµ¥µÄ GetAll ½Ó¿Ú£¬Òò´ËûÓÐÌ«¶àµÄÓÅ»¯¿Õ¼ä¡£
ÓÚÊÇ£¬ÎÒÃǾö¶¨Ê¹ÓÃÒ»¸ö JS ±äÁ¿À´¹¹½¨×Ô¼ºµÄ¼òÒ×»º´æ¡£Ëü¿´ÆðÀ´ÈçÏ£º
ÕâÀïΨһûÓÐÏÔʾµÄÊÇ post /jobs ½Ó¿Ú£¬Õâ¸ö½Ó¿Úɾ³ýÁËËùÓеĻº´æ£¨cachedJobs = undefined£©¡£
¾ÍÕâô¼òµ¥£¡ÓÖ¼õÉÙÁË 0.4s µÄ¼ÓÔØʱ¼ä£¡
×îºó¶¯ÊÖµÄÊÇÎÒÃǼÓÔØµÄ CSS ºÍ JS ´ò°üÎļþµÄ´óС¡£ÎÒÃÇ×¢Òâµ½£¬·Ç±ØÒªµÄ font-awesome Îļþ³¬¹ý 70KB¡£
ͬʱ£¬ÎÒÃÇ¿ÉÄÜֻʹÓÃÆäÖÐ 20% µÄͼ±ê¡£
ÈçºÎ½â¾öÕâ¸öÎÊÌâµÄÄØ£¿ÎÒÃÇʹÓà icomoon.io À´Ñ¡ÔñʹÓõÄͼ±ê£¬È»ºó´´½¨ÎÒÃÇÊÝÉí¹ýµÄͼ±ê°ü¡£
½á¹ûÄØ£¿½ÚÊ¡ÁË 50KB£¡
Õâ 3 ÏѰ³£µÄ¸Ä¶¯°ïÖúÎÒÃǽ«ÍøÕ¾µÄ¼ÓÔØʱ¼ä¼ÓËÙÁË24%¡£»òÕߣ¬ÈçÆäËüһЩ±¨¸æÏÔʾµÄ£¬¼ÓËÙÁË 43%£¨´ïµ½ÁË 1.2s£©¡£
ÎÒÃǶÔÕâЩ¸Ä¶¯ºÜÂúÒâ¡£µ«ÊÇ£¬ÎÒÃÇÏàÐÅÈÔÈ»ÓÐÓÅ»¯µÄ¿Õ¼ä¡£
Èç¹ûÄãÓв»Ñ°³£µÄ¼¼Êõ¿ÉÒÔ°ïÖúÎÒÃÇ¡ª¡ªÇë¸æÖªÎÒÃÇ£¡
ÔÚÓ¦ÓÃÉÏÊöÓÅ»¯Ö®ºó£¬ÎÒÃÇ×¢Ò⵽ƿ¾±ÈÔÈ»ÊÇ»ñÈ¡ /api/jobs ½Ó¿ÚÒÔ¼°ÏÂÔسõʼ HTML µÄʱ¼ä¡£ÆäÔÒòÊÇ£¬³õʼ HTML ÒÔ¼°Õâ¸ö API ÊÇÓÉλÓÚÅ·ÖÞµÄÒ»¸öµ¥µã·þÎñÆ÷ÌṩµÄ¡£
ÎÒÃÇÑ°ÕÒ¿ÉÐеĽâ¾ö·½°¸£¬È»ºó¾ö¶¨²ÉÓý«Ò»Çж¼»º´æÔÚ·þÎñÆ÷²ã¼¶µÄ·½°¸¡£
ʹÓà Cloudflare£¬Ä¬ÈÏÖ»Óо²Ì¬×ÊÔ´»á±»»º´æ¡£µ«ÊÇ£¬Í¨¹ýÔö¼ÓÒ»¸ö¼òµ¥µÄÒ³Ãæ¹æÔò£¬¾Í¿ÉÒÔÆôÓûº´æÈκÎÒ³Ãæ»ò×ÊÔ´µÄ¹¦ÄÜ£º
ÕâʹµÃÎÒÃǵÄÍøÕ¾¿ÉÒÔÖ±½ÓÓÉ Cloudflare µÄ CDN Ìṩ·þÎñ£¬ÉõÖÁ²»ÐèÒª·ÃÎÊ·þÎñÆ÷¡£
½á¹ûÄØ£¿
ÔÚÊÀ½ç¸÷µØµÄ¼ÓÔØʱ¼ä¼õÉÙÁË 50%£¡
ÏÖÔÚ£¬Äã¿ÉÄܶԻº´æ³õʼ HTML ºÍ¶¯Ì¬ API µÄÏë·¨½«ÐŽ«ÒÉ£¬µ«Ç뿼ÂÇ£ºÊ×ÏÈ£¬ÎÒÃǵĽӿڲ»»áƵ·±¸Ä¶¯¡ª¡ªÃ¿ÌìÅúÁ¿Ìí¼ÓÒ»´ÎеÄְλ£»Æä´Î£¬ÎÒÃÇÔڸĶ¯·¢Éúʱ£¬ÔÚ³ÌÐòÖÐÇå³ýÁË»º´æ¡£
ÕâʹµÃÎÒÃÇ¿ÉÒÔÔÚ²»µ½ 1 ÃëµÄʱ¼äÄÚ½« SwissDev Jobs ·þÎñµ½ÊÀ½ç¸÷µØ£¡
SwissGreg£¬°×ÌìÊdzÌÐòÔ±£¬ÍíÉÏÊǶÀÁ¢ºÚ¿Í¡ª¡ªSwissDevJobs.ch¡£
ÁìȡרÊô 10ÔªÎÞÃż÷ȯ
˽Ïí×îР¼¼Êõ¸É»õ