{"id":5047,"date":"2020-03-20T05:58:00","date_gmt":"2020-03-19T22:58:00","guid":{"rendered":"http:\/\/www.ducanhplus.com\/?p=5047"},"modified":"2022-08-18T16:51:40","modified_gmt":"2022-08-18T09:51:40","slug":"tang-toc-web-pagespeed-insights","status":"publish","type":"post","link":"https:\/\/kiencang.net\/tang-toc-web-pagespeed-insights\/","title":{"rendered":"T\u1ed1i \u01b0u Google PageSpeed Insights \u0111\u1ec3 t\u0103ng t\u1ed1c \u0111\u1ed9 website"},"content":{"rendered":"\n<p class=\"has-background\" style=\"background-color:#fffccc\">Tr\u01b0\u1edbc khi \u0111i v\u00e0o chi ti\u1ebft, b\u1ea1n n\u00ean \u0111\u1ecdc b\u00e0i vi\u1ebft n\u00e0y: <a href=\"https:\/\/kiencang.net\/diem-so-toc-do-khong-quan-trong\/\" target=\"_blank\" rel=\"noreferrer noopener\">T\u1ea1i sao \u0111i\u1ec3m s\u1ed1 Google PageSpeed, Pingdom v\u00e0 GTmetrix l\u1ea1i kh\u00f4ng quan tr\u1ecdng<\/a>.<\/p>\n\n\n\n<p>Google c\u00f3 nhi\u1ec1u c\u00f4ng c\u1ee5 gi\u00fap ng\u01b0\u1eddi qu\u1ea3n tr\u1ecb web t\u1ed1i \u01b0u h\u00f3a t\u1ed1c \u0111\u1ed9 cho ng\u01b0\u1eddi d\u00f9ng, ngo\u00e0i <a href=\"https:\/\/kiencang.net\/google-amp-tang-toc-website\/\" target=\"_blank\" rel=\"noreferrer noopener\">Google AMP<\/a>, <a href=\"https:\/\/kiencang.net\/dinh-dang-anh-webp\/\" target=\"_blank\" rel=\"noreferrer noopener\">\u0111\u1ecbnh d\u1ea1ng \u1ea3nh WebP<\/a>, t\u00f4i c\u0169ng r\u1ea5t th\u00edch c\u00e1c l\u1eddi khuy\u00ean b\u1ea3o t\u1eeb c\u00f4ng c\u1ee5 ki\u1ec3m tra t\u1ed1c \u0111\u1ed9 trang web c\u00f3 t\u00ean l\u00e0 <a href=\"https:\/\/developers.google.com\/speed\/pagespeed\/insights\/\" target=\"_blank\" rel=\"noreferrer noopener\">PageSpeed Insights<\/a>.<\/p>\n\n\n\n<p>H\u00e3y nh\u00ecn \u0111i\u1ec3m c\u1ee7a t\u00f4i (ti\u1ec7n th\u1ec3 h\u00e3y th\u1eed ki\u1ec3m tra lu\u00f4n \u0111i\u1ec3m trang c\u1ee7a b\u1ea1n):<\/p>\n\n\n\n<figure class=\"wp-block-image\"><a href=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/ducanhplus-PageSpeed-Insight.png\"><img decoding=\"async\" src=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/ducanhplus-PageSpeed-Insight.png\" alt=\"\u0110i\u1ec3m s\u1ed1 Pagespeed Insights\" class=\"wp-image-5048\"\/><\/a><\/figure>\n\n\n\n<p>V\u1eady l\u00e0 n\u00f3 c\u00f3 <strong>\u0111i\u1ec3m r\u1ea5t th\u1ea5p tr\u00ean di \u0111\u1ed9ng,&nbsp;<\/strong>tr\u00ean m\u00e1y t\u00ednh \u0111\u1ec3 b\u00e0n th\u00ec kh\u00e1 h\u01a1n ch\u00fat, nh\u01b0ng th\u1ef1c t\u1ebf l\u00e0 h\u1ea7u nh\u01b0 \u0111i\u1ec3m tr\u00ean desktop bao gi\u1edd c\u0169ng cao h\u01a1n tr\u00ean di \u0111\u1ed9ng (v\u00ec c\u00f3 t\u1ed1c \u0111\u1ed9 k\u1ebft n\u1ed1i v\u00e0 ph\u1ea7n c\u1ee9ng t\u1ed1t h\u01a1n), n\u00ean c\u00e1i n\u00e0y kh\u00f4ng th\u1ec3 coi l\u00e0 ti\u1ebfn b\u1ed9 \u0111\u01b0\u1ee3c. H\u01a1n n\u1eefa k\u1ebft n\u1ed1i di \u0111\u1ed9ng, gi\u1edd ng\u00e0y c\u00e0ng chi\u1ebfm t\u1ef7 tr\u1ecdng l\u1edbn h\u01a1n v\u00e0 d\u1ea7n \u00e1p \u0111\u1ea3o m\u00e1y t\u00ednh b\u00e0n.<\/p>\n\n\n\n<p>Ngay b\u00ean d\u01b0\u1edbi Google s\u1ebd <strong>\u0111\u01b0a ra c\u00e1c v\u1ea5n \u0111\u1ec1<\/strong> m\u00e0 trang c\u1ee7a t\u00f4i g\u1eb7p ph\u1ea3i:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><a href=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/cac-van-de-gap-phai-speed-web.png\"><img decoding=\"async\" src=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/cac-van-de-gap-phai-speed-web.png\" alt=\"C\u00e1c v\u1ea5n \u0111\u1ec1 v\u1ec1 hi\u1ec7u su\u1ea5t v\u00e0 t\u1ed1c \u0111\u1ed9 m\u00e0 trang g\u1eb7p ph\u1ea3i\" class=\"wp-image-5051\"\/><\/a><\/figure><\/div>\n\n\n<p>\u0110\u1ed3ng th\u1eddi n\u00f3 c\u0169ng \u0111\u01b0a ra c\u00e1c \u0111i\u1ec3m t\u1ed1i \u01b0u \u0111\u00e3 \u0111\u1ea1t \u0111\u01b0\u1ee3c:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><a href=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/toi-uu-thanh-cong-speed.png\"><img decoding=\"async\" src=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/toi-uu-thanh-cong-speed.png\" alt=\"C\u00e1c t\u1ed1i \u01b0u c\u00f3 th\u1ec3 th\u1ef1c hi\u1ec7n \u0111\u01b0\u1ee3c\" class=\"wp-image-5052\"\/><\/a><\/figure><\/div>\n\n\n<p>V\u1edbi c\u00e1c v\u1ea5n \u0111\u1ec1 b\u00ean tr\u00ean, n\u1ebfu b\u1ea1n <a href=\"https:\/\/kiencang.net\/tang-toc-wordpress\/\">d\u00f9ng WordPress v\u00e0 mu\u1ed1n c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9<\/a> th\u00ec ch\u1ec9 2 \u0111\u1ebfn 3 plugin c\u1ed9ng v\u1edbi v\u00e0i \u0111\u1ed9ng t\u00e1c th\u1ee7 c\u00f4ng s\u1ebd gi\u1ea3i quy\u1ebft \u0111\u01b0\u1ee3c g\u1ea7n nh\u01b0 \u1ed5n th\u1ecfa.<\/p>\n\n\n\n<p>Khi t\u00f4i th\u1eed b\u1eadt 1 plugin t\u1ed1i \u01b0u h\u00f3a l\u00ean, k\u1ebft qu\u1ea3 ngay l\u1eadp t\u1ee9c \u0111\u01b0\u1ee3c c\u1ea3i thi\u1ec7n (l\u00ean 7 \u0111i\u1ec3m):<\/p>\n\n\n\n<figure class=\"wp-block-image\"><a href=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/cai-thien-diem-toc-do.png\"><img decoding=\"async\" src=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/cai-thien-diem-toc-do.png\" alt=\"K\u1ebft qu\u1ea3 sau khi b\u1eadt m\u1ed9t plugin t\u1ed1i \u01b0u h\u00f3a\" class=\"wp-image-5053\"\/><\/a><\/figure>\n\n\n\n<p>Tuy nhi\u00ean \u0111\u1ec3 b\u1ea1n hi\u1ec3u b\u1ea3n ch\u1ea5t v\u1ea5n \u0111\u1ec1 t\u00f4i s\u1ebd \u0111\u1ec1 c\u1eadp \u0111\u1ebfn c\u00e1c plugin c\u1ee5 th\u1ec3 v\u00e0o l\u00fac kh\u00e1c v\u00e0 s\u1ebd gi\u1ea3i th\u00edch c\u01a1 ch\u1ebf t\u1ed1i \u01b0u tr\u01b0\u1edbc.<\/p>\n\n\n\n<p>T\u1ea1i sao ph\u1ea3i kh\u1ed5 s\u1edf \u0111i t\u00ecm <a href=\"https:\/\/kiencang.net\/co-che-can-ban-tang-toc-wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\">c\u00e1c c\u01a1 ch\u1ebf b\u1ea3n ch\u1ea5t trong t\u1ed1i \u01b0u t\u1ed1c \u0111\u1ed9<\/a> l\u00e0m g\u00ec trong khi c\u00f3 th\u1ec3 \u0103n s\u1eb5n nh\u1edd plugin?<\/p>\n\n\n\n<p>B\u1edfi v\u00ec \u0103n s\u1eb5n c\u00f3 c\u00e1c nguy c\u01a1 sau:<\/p>\n\n\n\n<ul><li>B\u1ea1n \u0111\u01a1n gi\u1ea3n <strong>l\u00e0m theo c\u00e1c l\u1eddi khuy\u00ean<\/strong>, nh\u01b0ng c\u00e1c l\u1eddi khuy\u00ean lu\u00f4n c\u00f3 ngo\u1ea1i l\u1ec7, v\u00e0 n\u1ebfu trang c\u1ee7a b\u1ea1n r\u01a1i v\u00e0o ngo\u1ea1i l\u1ec7 th\u00ec c\u00e1ch b\u1ea1n t\u1ed1i \u01b0u th\u1eadm ch\u00ed l\u00e0 c\u00f3 h\u1ea1i.<\/li><li>B\u1ea1n ch\u1ec9 <strong>t\u1ed1i \u01b0u h\u1eddi h\u1ee3t b\u1ec1 ngo\u00e0i<\/strong>, t\u1ee9c l\u00e0 b\u1ea1n l\u00e0m \u0111\u01b0\u1ee3c r\u1ea5t \u00edt, kh\u00f4ng h\u1ebft kh\u1ea3 n\u0103ng.<\/li><li>N\u1ebfu kh\u00f4ng c\u00f3 c\u00e1c c\u00f4ng c\u1ee5 h\u1ed7 tr\u1ee3 ti\u1ec7n l\u1ee3i th\u00ec b\u1ea1n <strong>kh\u00f4ng bi\u1ebft l\u00e0m g\u00ec<\/strong> c\u1ea3!<\/li><\/ul>\n\n\n\n<p>Hi\u1ec3u s\u00e2u b\u1ea3n ch\u1ea5t gi\u00fap b\u1ea1n t\u1ed1i \u01b0u \u0111\u01b0\u1ee3c r\u1ea5t nhi\u1ec1u &amp; hi\u1ec3u r\u1eb1ng b\u1ea1n \u0111\u00e3 t\u1ed1i \u01b0u trang \u0111\u1ebfn \u0111\u00e2u, m\u1eb7c cho c\u00f3 th\u1ec3 t\u1ed3n t\u1ea1i nh\u1eefng \u0111i\u1ec3m m\u00e0 c\u00e1c b\u00e1o c\u00e1o n\u00f3i l\u00e0 c\u00f3 v\u1ea5n \u0111\u1ec1 v\u1ec1 t\u1ed1c \u0111\u1ed9.<\/p>\n\n\n\n<p>R\u1ed3i, gi\u1edd ch\u00fang ta s\u1ebd xem t\u1eebng h\u01b0\u1edbng d\u1eabn c\u1ee5 th\u1ec3 c\u1ee7a PageSpeed Insights. L\u01b0u \u00fd l\u00e0 trong b\u00e0i vi\u1ebft n\u00e0y t\u00f4i ch\u1ec9 \u0111\u1ec1 c\u1eadp \u0111\u1ebfn ph\u1ea7n t\u1ed1c \u0111\u1ed9 trong l\u1eddi khuy\u00ean c\u1ee7a h\u1ecd. C\u00f2n ph\u1ea7n t\u1ed1i \u01b0u <a href=\"https:\/\/kiencang.net\/tinh-kha-dung-la-gi\/\" target=\"_blank\" rel=\"noreferrer noopener\">t\u00ednh kh\u1ea3 d\u1ee5ng<\/a> s\u1ebd \u0111\u01b0\u1ee3c vi\u1ebft trong b\u00e0i kh\u00e1c.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_60 counter-hierarchy ez-toc-counter ez-toc-light-blue ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title \" >M\u1ee5c l\u1ee5c<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\" role=\"button\"><label for=\"item-6577d61850130\" ><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/label><input aria-label=\"Toggle\" aria-label=\"item-6577d61850130\"  type=\"checkbox\" id=\"item-6577d61850130\"><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/kiencang.net\/tang-toc-web-pagespeed-insights\/#1_Tranh_chuyen_huong_o_trang_dich\" title=\"1. Tr\u00e1nh chuy\u1ec3n h\u01b0\u1edbng \u1edf trang \u0111\u00edch\">1. Tr\u00e1nh chuy\u1ec3n h\u01b0\u1edbng \u1edf trang \u0111\u00edch<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/kiencang.net\/tang-toc-web-pagespeed-insights\/#2_Bat_nen\" title=\"2. B\u1eadt n\u00e9n\">2. B\u1eadt n\u00e9n<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/kiencang.net\/tang-toc-web-pagespeed-insights\/#3_Cai_thien_thoi_gian_phan_hoi_cua_may_chu\" title=\"3. C\u1ea3i thi\u1ec7n th\u1eddi gian ph\u1ea3n h\u1ed3i c\u1ee7a m\u00e1y ch\u1ee7\">3. C\u1ea3i thi\u1ec7n th\u1eddi gian ph\u1ea3n h\u1ed3i c\u1ee7a m\u00e1y ch\u1ee7<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/kiencang.net\/tang-toc-web-pagespeed-insights\/#4_Tan_dung_suc_manh_bo_nho_dem_cua_trinh_duyet\" title=\"4. T\u1eadn d\u1ee5ng s\u1ee9c m\u1ea1nh b\u1ed9 nh\u1edb \u0111\u1ec7m c\u1ee7a tr\u00ecnh duy\u1ec7t\">4. T\u1eadn d\u1ee5ng s\u1ee9c m\u1ea1nh b\u1ed9 nh\u1edb \u0111\u1ec7m c\u1ee7a tr\u00ecnh duy\u1ec7t<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/kiencang.net\/tang-toc-web-pagespeed-insights\/#5_Giam_thieu_tai_nguyen_HTML_CSS_va_JavaScript\" title=\"5. Gi\u1ea3m thi\u1ec3u t\u00e0i nguy\u00ean (HTML, CSS v\u00e0 JavaScript)\">5. Gi\u1ea3m thi\u1ec3u t\u00e0i nguy\u00ean (HTML, CSS v\u00e0 JavaScript)<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/kiencang.net\/tang-toc-web-pagespeed-insights\/#6_Toi_uu_hoa_anh\" title=\"6. T\u1ed1i \u01b0u h\u00f3a \u1ea3nh\">6. T\u1ed1i \u01b0u h\u00f3a \u1ea3nh<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/kiencang.net\/tang-toc-web-pagespeed-insights\/#7_Toi_uu_hoa_viec_phan_phoi_CSS\" title=\"7. T\u1ed1i \u01b0u h\u00f3a vi\u1ec7c ph\u00e2n ph\u1ed1i CSS\">7. T\u1ed1i \u01b0u h\u00f3a vi\u1ec7c ph\u00e2n ph\u1ed1i CSS<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/kiencang.net\/tang-toc-web-pagespeed-insights\/#8_Uu_tien_noi_dung_hien_thi\" title=\"8. \u01afu ti\u00ean n\u1ed9i dung hi\u1ec3n th\u1ecb\">8. \u01afu ti\u00ean n\u1ed9i dung hi\u1ec3n th\u1ecb<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/kiencang.net\/tang-toc-web-pagespeed-insights\/#9_Loai_bo_JavaScript_chan_hien_thi\" title=\"9. Lo\u1ea1i b\u1ecf JavaScript ch\u1eb7n hi\u1ec3n th\u1ecb\">9. Lo\u1ea1i b\u1ecf JavaScript ch\u1eb7n hi\u1ec3n th\u1ecb<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/kiencang.net\/tang-toc-web-pagespeed-insights\/#10_Su_dung_ma_Script_khong_dong_bo\" title=\"10. S\u1eed d\u1ee5ng m\u00e3 Script kh\u00f4ng \u0111\u1ed3ng b\u1ed9\">10. S\u1eed d\u1ee5ng m\u00e3 Script kh\u00f4ng \u0111\u1ed3ng b\u1ed9<\/a><\/li><\/ul><\/nav><\/div>\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"1_Tranh_chuyen_huong_o_trang_dich\"><\/span><span style=\"background-color: #ffff00;\">1. Tr\u00e1nh chuy\u1ec3n h\u01b0\u1edbng \u1edf trang \u0111\u00edch<\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Quy t\u1eafc n\u00e0y k\u00edch ho\u1ea1t (<em>this rule triggers<\/em>) khi PageSpeed Insights ph\u00e1t hi\u1ec7n (<em>detects<\/em>) b\u1ea1n c\u00f3 h\u01a1n m\u1ed9t chuy\u1ec3n h\u01b0\u1edbng t\u1eeb url hi\u1ec7n t\u1ea1i \u0111\u1ebfn trang landing page cu\u1ed1i c\u00f9ng.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">T\u1ed5ng quan<\/h3>\n\n\n\n<p>Chuy\u1ec3n h\u01b0\u1edbng t\u1ea1o th\u00eam m\u1ed9t chu tr\u00ecnh y\u00eau c\u1ea7u-ph\u1ea3n h\u1ed3i HTTP v\u00e0 l\u00e0m <a href=\"https:\/\/kiencang.net\/cach-trang-web-tai-va-hien-thi\/\" target=\"_blank\" rel=\"noreferrer noopener\">trang tr\u00ec ho\u00e3n qu\u00e1 tr\u00ecnh hi\u1ec3n th\u1ecb<\/a> (<em>rendering<\/em>). Trong tr\u01b0\u1eddng h\u1ee3p t\u1ed1t nh\u1ea5t, m\u1ed7i l\u1ea7n chuy\u1ec3n h\u01b0\u1edbng s\u1ebd th\u00eam m\u1ed9t v\u00f2ng kh\u1ee9 h\u1ed3i (y\u00eau c\u1ea7u-ph\u1ea3n h\u1ed3i HTTP), v\u00e0 trong tr\u01b0\u1eddng h\u1ee3p t\u1ec7 nh\u1ea5t n\u00f3 c\u00f3 th\u1ec3 t\u1ea1o ra nhi\u1ec1u v\u00f2ng l\u1eb7p kh\u1ee9 h\u1ed3i nh\u01b0 th\u1ef1c hi\u1ec7n tra c\u1ee9u DNS, &#8220;b\u1eaft tay&#8221; TCP, \u0111\u00e0m ph\u00e1n TLS ngo\u00e0i vi\u1ec7c c\u00f3 th\u00eam chu k\u1ef3 HTTP y\u00eau c\u1ea7u-h\u1ed3i \u0111\u00e1p. Do v\u1eady b\u1ea1n ph\u1ea3i t\u1ed1i thi\u1ec3u ho\u00e1 vi\u1ec7c s\u1eed d\u1ee5ng chuy\u1ec3n h\u01b0\u1edbng \u0111\u1ec3 n\u00e2ng cao hi\u1ec7u n\u0103ng c\u1ee7a trang.<\/p>\n\n\n\n<p>D\u01b0\u1edbi \u0111\u00e2y l\u00e0 m\u1ed9t s\u1ed1 v\u00ed d\u1ee5 v\u1ec1 c\u00e1c ki\u1ec3u chuy\u1ec3n h\u01b0\u1edbng \u0111i\u1ec3n h\u00ecnh (<em>redirect patterns<\/em>):<\/p>\n\n\n\n<ul><li>example.com s\u1eed d\u1ee5ng thi\u1ebft k\u1ebf web \u0111\u00e1p \u1ee9ng, kh\u00f4ng c\u1ea7n chuy\u1ec3n h\u01b0\u1edbng &#8211; nhanh v\u00e0 t\u1ed1i \u01b0u! (b\u1ea1n n\u00ean l\u00e0m nh\u01b0 th\u1ebf n\u00e0y)<\/li><li>example.com&nbsp;\u2192 m.example.com\/home &#8211; xu\u1ea5t hi\u1ec7n nhi\u1ec1u chuy\u1ec3n h\u01b0\u1edbng \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn ng\u01b0\u1eddi d\u00f9ng di \u0111\u1ed9ng (x\u1ea3y ra khi b\u1ea1n \u0111\u1ecbnh l\u00e0m m\u1ed9t url ri\u00eang cho phi\u00ean b\u1ea3n di \u0111\u1ed9ng)<\/li><li>example.com&nbsp;\u2192 www.example.com&nbsp;\u2192 m.example.com &#8211; tr\u1ea3i nghi\u1ec7m di \u0111\u1ed9ng r\u1ea5t ch\u1eadm (v\u1edbi \u0111\u1ee7 c\u00e1c ki\u1ec3u chuy\u1ec3n h\u01b0\u1edbng t\u1eeb kh\u00f4ng c\u00f3 www \u0111\u1ebfn c\u00f3 www r\u1ed3i \u0111\u1ebfn phi\u00ean b\u1ea3n di \u0111\u1ed9ng)<\/li><\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">L\u1eddi khuy\u00ean<\/h3>\n\n\n\n<p>H\u00e3y t\u00ecm hi\u1ec3u <a href=\"https:\/\/developers.google.com\/web\/fundamentals\/layouts\/\" target=\"_blank\" rel=\"noreferrer noopener\">c\u00e1c nguy\u00ean t\u1eafc c\u01a1 b\u1ea3n c\u1ee7a thi\u1ebft k\u1ebf \u0111\u00e1p \u1ee9ng<\/a> \u0111\u1ec3 ph\u00e2n ph\u1ed1i tr\u1ea3i nghi\u1ec7m t\u1ed1t tr\u00ean nhi\u1ec1u thi\u1ebft b\u1ecb v\u00e0 lo\u1ea1i b\u1ecf (<em>eliminate<\/em>) c\u00e1c chuy\u1ec3n h\u01b0\u1edbng kh\u00f4ng c\u1ea7n thi\u1ebft.<\/p>\n\n\n\n<p>N\u1ebfu trang c\u1ee7a b\u1ea1n y\u00eau c\u1ea7u chuy\u1ec3n h\u01b0\u1edbng, h\u00e3y \u0111\u1ecdc h\u01b0\u1edbng d\u1eabn <a href=\"https:\/\/developers.google.com\/webmasters\/smartphone-sites\/redirects\" target=\"_blank\" rel=\"noreferrer noopener\">chuy\u1ec3n h\u01b0\u1edbng v\u00e0 ph\u00e1t hi\u1ec7n User-Agent<\/a> c\u1ee7a ch\u00fang t\u00f4i (Google).<\/p>\n\n\n\n<p><strong>Kinh nghi\u1ec7m c\u00e1 nh\u00e2n v\u1edbi WordPress (kiencang.net)<\/strong>: N\u1ebfu b\u1ea1n d\u00f9ng WordPress, th\u00f4ng th\u01b0\u1eddng b\u1ea1n s\u1ebd kh\u00f4ng g\u1eb7p v\u1ea5n \u0111\u1ec1 chuy\u1ec3n h\u01b0\u1edbng ki\u1ec3u nh\u01b0 tr\u00ean. C\u00e1c giao di\u1ec7n d\u00e0nh cho WordPress (ngay c\u1ea3 mi\u1ec5n ph\u00ed) h\u1ea7u nh\u01b0 \u0111\u1ec1u l\u00e0 thi\u1ebft k\u1ebf \u0111\u00e1p \u1ee9ng.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"2_Bat_nen\"><\/span><span style=\"background-color: #ffff00;\">2. B\u1eadt n\u00e9n<\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Quy t\u1eafc n\u00e0y k\u00edch ho\u1ea1t khi PageSpeed Insights ph\u00e1t hi\u1ec7n c\u00e1c ngu\u1ed3n n\u00e9n \u0111ang th\u1ef1c thi (<em>compressible resources were served<\/em>) kh\u00f4ng c\u00f3 n\u00e9n gzip.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">T\u1ed5ng quan<\/h3>\n\n\n\n<p>T\u1ea5t c\u1ea3 c\u00e1c tr\u00ecnh duy\u1ec7t hi\u1ec7n \u0111\u1ea1i \u0111\u1ec1u h\u1ed7 tr\u1ee3 v\u00e0 t\u1ef1 \u0111\u1ed9ng \u0111\u00e0m ph\u00e1n n\u00e9n gzip cho t\u1ea5t c\u1ea3 c\u00e1c y\u00eau c\u1ea7u HTTP. B\u1eadt gzip c\u00f3 th\u1ec3 gi\u1ea3m dung l\u01b0\u1ee3ng truy\u1ec1n t\u1ea3i l\u00ean \u0111\u1ebfn 90%, \u0111i\u1ec1u n\u00e0y c\u00f3 th\u1ec3 gi\u1ea3m \u0111\u00e1ng k\u1ec3 th\u1eddi gian t\u1ea3i d\u1eef li\u1ec7u ngu\u1ed3n, gi\u1ea3m d\u1eef li\u1ec7u s\u1eed d\u1ee5ng cho ng\u01b0\u1eddi d\u00f9ng v\u00e0 n\u00e2ng cao th\u1eddi gian xu\u1ea5t trang l\u1ea7n \u0111\u1ea7u. Xem <a href=\"https:\/\/developers.google.com\/web\/fundamentals\/performance\/optimizing-content-efficiency\/optimize-encoding-and-transfer#text-compression-with-gzip\" target=\"_blank\" rel=\"noreferrer noopener\">n\u00e9n v\u0103n b\u1ea3n v\u1edbi GZIP<\/a> \u0111\u1ec3 hi\u1ec3u th\u00eam.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">L\u1eddi khuy\u00ean<\/h3>\n\n\n\n<p>B\u1eadt v\u00e0 ki\u1ec3m tra xem n\u00e9n gzip c\u00f3 \u0111\u01b0\u1ee3c h\u1ed7 tr\u1ee3 b\u1edfi web server c\u1ee7a b\u1ea1n hay l\u00e0 kh\u00f4ng. D\u1ef1 \u00e1n HTML5 Boilerplate bao g\u1ed3m c\u00e1c <a href=\"https:\/\/github.com\/h5bp\/server-configs\" target=\"_blank\" rel=\"noreferrer noopener\">t\u1ec7p tin c\u1ea5u h\u00ecnh m\u1eabu<\/a> cho t\u1ea5t c\u1ea3 m\u00e1y ch\u1ee7 ph\u1ed5 bi\u1ebfn nh\u1ea5t v\u1edbi c\u00e1c l\u1eddi khuy\u00ean chi ti\u1ebft cho vi\u1ec7c c\u1ea5u h\u00ecnh v\u00e0 thi\u1ebft l\u1eadp: t\u00ecm m\u00e1y ch\u1ee7 \u01b0a th\u00edch c\u1ee7a b\u1ea1n trong danh s\u00e1ch, t\u00ecm t\u1edbi ph\u1ea7n gzip, v\u00e0 xem xem m\u00e1y ch\u1ee7 c\u1ee7a b\u1ea1n c\u00f3 \u0111\u01b0\u1ee3c c\u1ea5u h\u00ecnh v\u1edbi c\u00e1c thi\u1ebft l\u1eadp \u0111\u01b0\u1ee3c khuy\u1ebfn c\u00e1o kh\u00f4ng. Ngo\u00e0i ra h\u00e3y tham kh\u1ea3o t\u00e0i li\u1ec7u cho m\u00e1y ch\u1ee7 web c\u1ee7a b\u1ea1n v\u1ec1 c\u00e1ch b\u1eadt n\u00e9n:<\/p>\n\n\n\n<ul><li>Apache: S\u1eed d\u1ee5ng&nbsp;<a href=\"http:\/\/httpd.apache.org\/docs\/current\/mod\/mod_deflate.html\" target=\"_blank\" rel=\"noopener noreferrer\">mod_deflate<\/a><\/li><li>Nginx: S\u1eed d\u1ee5ng&nbsp;<a href=\"http:\/\/nginx.org\/en\/docs\/http\/ngx_http_gzip_module.html\" target=\"_blank\" rel=\"noopener noreferrer\">ngx_http_gzip_module<\/a><\/li><li>IIS: <a href=\"http:\/\/technet.microsoft.com\/en-us\/library\/cc771003(v=WS.10).aspx\" target=\"_blank\" rel=\"noopener noreferrer\">Configure HTTP Compression<\/a><\/li><\/ul>\n\n\n\n<p><strong>Kinh nghi\u1ec7m c\u00e1 nh\u00e2n v\u1edbi WordPress<\/strong>: \u0110\u1ec3 ki\u1ec3m tra xem trang c\u1ee7a b\u1ea1n \u0111\u00e3 \u0111\u01b0\u1ee3c n\u00e9n hay ch\u01b0a, b\u1ea1n c\u00f3 th\u1ec3 v\u00e0o c\u00e1c trang web chuy\u00ean ki\u1ec3m tra vi\u1ec7c n\u00e0y r\u1ed3i \u0111\u01b0a t\u00ean mi\u1ec1n c\u1ee7a b\u1ea1n v\u00e0o. G\u00f5 t\u1eeb kh\u00f3a &#8220;Check GZIP compression&#8221; \u0111\u1ec3 c\u00f3 \u0111\u01b0\u1ee3c c\u00e1c trang nh\u01b0 v\u1eady. V\u00ed d\u1ee5 trang n\u00e0y:&nbsp;<a href=\"https:\/\/kiencang.net\/cach-trang-web-tai-va-hien-thi\/\">https:\/\/kiencang.net\/cach-trang-web-tai-va-hien-thi\/<\/a><\/p>\n\n\n\n<p>R\u1ea5t nhi\u1ec1u d\u1ecbch v\u1ee5 hosting m\u1eb7c \u0111\u1ecbnh b\u1eadt gzip n\u00ean c\u00f3 th\u1ec3 b\u1ea1n s\u1ebd b\u1ea5t ng\u1edd khi th\u1ea5y trang c\u1ee7a m\u00ecnh \u0111\u00e3 \u0111\u01b0\u1ee3c b\u1eadt r\u1ed3i d\u00f9 b\u1ea3n th\u00e2n ch\u01b0a l\u00e0m g\u00ec c\u1ea3. B\u1eadt gzip gi\u00fap c\u00e1c h\u00e3ng hosting gi\u1ea3m t\u1ea3i b\u0103ng th\u00f4ng.<\/p>\n\n\n\n<p>Hi\u1ec7n nay m\u1ed9t s\u1ed1 hosting h\u1ed7 tr\u1ee3 <a href=\"https:\/\/kiencang.net\/nen-brotli-la-gi\/\" target=\"_blank\" rel=\"noreferrer noopener\">ki\u1ec3u n\u00e9n c\u00f2n t\u1ed1t h\u01a1n t\u00ean l\u00e0\u00a0brotli<\/a>, m\u1ed9t ch\u01b0\u01a1ng tr\u00ecnh do Google ph\u00e1t tri\u1ec3n. \u0110\u1ec3 ki\u1ec3m tra xem hosting c\u1ee7a b\u1ea1n c\u00f3 h\u1ed7 tr\u1ee3 ki\u1ec3u n\u00e9n n\u00e0y kh\u00f4ng, b\u1ea1n v\u00e0o trang n\u00e0y:\u00a0<a href=\"https:\/\/tools.keycdn.com\/brotli-test\" target=\"_blank\" rel=\"noreferrer noopener\">https:\/\/tools.keycdn.com\/brotli-test<\/a><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">C\u00e1c c\u00e2u h\u1ecfi th\u01b0\u1eddng g\u1eb7p (FAQ)<\/h3>\n\n\n\n<p><em>PageSpeed Insight b\u00e1o l\u00e0 nhi\u1ec1u n\u1ed9i dung t\u0129nh c\u1ee7a t\u00f4i (my static content) c\u1ea7n n\u00e9n gzip, nh\u01b0ng t\u00f4i \u0111\u00e3 c\u1ea5u h\u00ecnh m\u00e1y ch\u1ee7 web \u0111\u1ec3 n\u00e9n gzip c\u00e1c file \u0111\u00f3. T\u1ea1i sao PageSpeed Insights kh\u00f4ng ph\u00e1t hi\u1ec7n \u0111\u01b0\u1ee3c l\u00e0 t\u00f4i \u0111\u00e3 b\u1eadt n\u00e9n r\u1ed3i?<\/em><\/p>\n\n\n\n<p>Proxy servers v\u00e0 ph\u1ea7n m\u1ec1m ch\u1ed1ng virus c\u00f3 th\u1ec3 v\u00f4 hi\u1ec7u ho\u00e1 n\u00e9n khi c\u00e1c file n\u00e0y \u0111\u01b0\u1ee3c t\u1ea3i v\u1ec1 m\u00e1y kh\u00e1ch. K\u1ebft qu\u1ea3 c\u1ee7a PageSpeed Insight d\u1ef1a tr\u00ean headers, khi ch\u00fang th\u1ef1c s\u1ef1 \u0111\u01b0\u1ee3c tr\u1ea3 l\u1ea1i cho m\u00e1y kh\u00e1ch, v\u00ec v\u1eady n\u1ebfu b\u1ea1n th\u1ef1c hi\u1ec7n ph\u00e2n t\u00edch tr\u00ean m\u00e1y kh\u00e1ch s\u1eed d\u1ee5ng c\u00e1c ph\u1ea7n m\u1ec1m ch\u1ed1ng virus nh\u01b0 v\u1eady ho\u1eb7c ng\u1ed3i ph\u00eda sau m\u00e1y ch\u1ee7 proxy trung gian (nhi\u1ec1u m\u00e1y ch\u1ee7 l\u00e0 v\u00f4 h\u00ecnh, v\u00e0 b\u1ea1n c\u00f3 th\u1ec3 th\u1eadm ch\u00ed kh\u00f4ng \u00fd th\u1ee9c \u0111\u01b0\u1ee3c s\u1ef1 can thi\u1ec7p c\u1ee7a proxy gi\u1eefa m\u00e1y kh\u00e1ch c\u1ee7a b\u1ea1n v\u00e0 m\u00e1y ch\u1ee7 web), ch\u00fang c\u00f3 th\u1ec3 l\u00e0 nguy\u00ean nh\u00e2n c\u1ee7a v\u1ea5n \u0111\u1ec1 n\u00e0y.<\/p>\n\n\n\n<p>\u0110\u1ec3 x\u00e1c \u0111\u1ecbnh n\u1ebfu proxy l\u00e0 nguy\u00ean nh\u00e2n, b\u1ea1n c\u00f3 th\u1ec3 s\u1eed d\u1ee5ng <a href=\"https:\/\/developers.google.com\/speed\/docs\/insights\/using_chrome\" target=\"_blank\" rel=\"noreferrer noopener\">PageSpeed Insights Chrome extension<\/a> \u0111\u1ec3 ki\u1ec3m tra headers:<\/p>\n\n\n\n<ol><li>Ch\u1ea1y PageSpeed tr\u00ean trang.<\/li><li>Click v\u00e0o tab <strong>Hi\u1ec3n th\u1ecb Ngu\u1ed3n <\/strong>(<em>Show Resource<\/em>).<\/li><li>M\u1edf r\u1ed9ng URL c\u1ee7a ngu\u1ed3n \u0111\u01b0\u1ee3c g\u1eafn c\u1edd l\u00e0 kh\u00f4ng b\u1eadt n\u00e9n. C\u00e1c header \u0111i k\u00e8m v\u1edbi ngu\u1ed3n \u0111\u01b0\u1ee3c hi\u1ec3n th\u1ecb. N\u1ebfu b\u1ea1n th\u1ea5y header g\u1ecdi \u0111\u1ebfn&nbsp;<code>Via<\/code>, <code>Forwarded<\/code>, or <code>Proxy-Connection<\/code>, \u0111i\u1ec1u \u0111\u1ea5y ch\u1ec9 ra r\u1eb1ng m\u1ed9t proxy \u0111ang ph\u1ee5c v\u1ee5 t\u00e0i nguy\u00ean.<\/li><\/ol>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"3_Cai_thien_thoi_gian_phan_hoi_cua_may_chu\"><\/span><span style=\"background-color: #ffff00;\">3. C\u1ea3i thi\u1ec7n th\u1eddi gian ph\u1ea3n h\u1ed3i c\u1ee7a m\u00e1y ch\u1ee7<\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Quy t\u1eafc n\u00e0y \u0111\u01b0\u1ee3c k\u00edch ho\u1ea1t khi PageSpeed Insights ph\u00e1t hi\u1ec7n th\u1eddi gian ph\u1ea3n h\u1ed3i m\u00e1y ch\u1ee7 c\u1ee7a b\u1ea1n tr\u00ean 200 ms.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">T\u1ed5ng quan<\/h3>\n\n\n\n<p>Th\u1eddi gian ph\u1ea3n h\u1ed3i m\u00e1y ch\u1ee7 (<em>server response time<\/em>) \u0111o kho\u1ea3ng th\u1eddi gian ph\u1ea3i b\u1ecf ra (<em>how long it takes<\/em>) cho vi\u1ec7c t\u1ea3i HTML c\u1ea7n thi\u1ebft \u0111\u1ec3 b\u1eaft \u0111\u1ea7u qu\u00e1 tr\u00ecnh hi\u1ec3n th\u1ecb trang t\u1eeb m\u00e1y ch\u1ee7 c\u1ee7a b\u1ea1n, tr\u1eeb \u0111i \u0111\u1ed9 tr\u1ec5 m\u1ea1ng (<em>network latency<\/em>) gi\u1eefa Google v\u00e0 m\u00e1y ch\u1ee7 c\u1ee7a b\u1ea1n. C\u00f3 th\u1ec3 c\u00f3 s\u1ef1 kh\u00e1c nhau ngay c\u1ea3 l\u1ea7n ch\u1ea1y ti\u1ebfp theo, nh\u01b0ng s\u1ef1 kh\u00e1c bi\u1ec7t kh\u00f4ng n\u00ean qu\u00e1 l\u1edbn. Trong th\u1ef1c t\u1ebf, s\u1ef1 kh\u00f4ng \u1ed5n \u0111\u1ecbnh c\u1ee7a th\u1eddi gian ph\u1ea3n h\u1ed3i m\u00e1y ch\u1ee7 c\u00f3 th\u1ec3 bi\u1ec3u th\u1ecb cho m\u1ed9t v\u1ea5n \u0111\u1ec1 nghi\u00eam tr\u1ecdng mang t\u00ednh n\u1ec1n t\u1ea3ng v\u1ec1 hi\u1ec7u su\u1ea5t (<em>underlying performance issue<\/em>).<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">L\u1eddi khuy\u00ean<\/h3>\n\n\n\n<p>B\u1ea1n ph\u1ea3i <a href=\"https:\/\/kiencang.net\/giam-thoi-gian-phan-hoi-cua-may-chu\/\" target=\"_blank\" rel=\"noreferrer noopener\">gi\u1ea3m th\u1eddi gian ph\u1ea3n h\u1ed3i c\u1ee7a m\u00e1y ch\u1ee7<\/a> xu\u1ed1ng d\u01b0\u1edbi 200 ms. C\u00f3 h\u00e0ng t\u00e1 y\u1ebfu t\u1ed1 ti\u1ec1m n\u0103ng c\u00f3 th\u1ec3 g\u00e2y ch\u1eadm th\u1eddi gian ph\u1ea3n h\u1ed3i c\u1ee7a m\u00e1y ch\u1ee7: \u1ee9ng d\u1ee5ng logic ch\u1eadm, truy v\u1ea5n c\u01a1 s\u1edf d\u1eef li\u1ec7u ch\u1eadm, b\u1ed9 \u0111\u1ecbnh tuy\u1ebfn ch\u1eadm, frameworks, c\u00e1c th\u01b0 vi\u1ec7n, thi\u1ebfu CPU, ho\u1eb7c thi\u1ebfu RAM.<\/p>\n\n\n\n<p>B\u1ea1n c\u1ea7n xem x\u00e9t t\u1ea5t c\u1ea3 c\u00e1c y\u1ebfu t\u1ed1 \u0111\u00f3 \u0111\u1ec3 c\u1ea3i thi\u1ec7n th\u1eddi gian ph\u1ea3n h\u1ed3i c\u1ee7a m\u00e1y ch\u1ee7. B\u01b0\u1edbc \u0111\u1ea7u ti\u00ean \u0111\u1ec3 bi\u1ebft \u0111\u01b0\u1ee3c l\u00fd do t\u1ea1i sao th\u1eddi gian ph\u1ea3n h\u1ed3i c\u1ee7a m\u00e1y ch\u1ee7 l\u1ea1i t\u0103ng l\u00e0 \u0111o \u0111\u1ea1c. Sau \u0111\u00f3, v\u1edbi d\u1eef li\u1ec7u trong tay, t\u00ecm hi\u1ec3u c\u00e1c h\u01b0\u1edbng d\u1eabn th\u00edch h\u1ee3p \u0111\u1ec3 bi\u1ebft r\u1eafc r\u1ed1i n\u1eb1m \u1edf \u0111\u00e2u. M\u1ed9t khi v\u1ea5n \u0111\u1ec1 \u0111\u01b0\u1ee3c gi\u1ea3i quy\u1ebft, b\u1ea1n ph\u1ea3i ti\u1ebfp t\u1ee5c \u0111o th\u1eddi gian ph\u1ea3n h\u1ed3i c\u1ee7a m\u00e1y ch\u1ee7 v\u00e0 x\u00e1c \u0111\u1ecbnh b\u1ea5t c\u1ee9 s\u1ef1 t\u1eafc ngh\u1ebdn c\u1ed5 chai v\u1ec1 hi\u1ec7u su\u1ea5t n\u00e0o trong tr\u01b0\u01a1ng lai.<\/p>\n\n\n\n<ol><li><strong>Thu th\u1eadp v\u00e0 ki\u1ec3m tra&nbsp;<\/strong>c\u00e1c d\u1eef li\u1ec7u v\u00e0 th\u00f4ng tin hi\u1ec7u su\u1ea5t c\u00f3 s\u1eb5n. N\u1ebfu kh\u00f4ng c\u00f3, \u0111\u00e1nh gi\u00e1 b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng m\u1ed9t \u1ee9ng d\u1ee5ng theo d\u00f5i web t\u1ef1 \u0111\u1ed9ng (\u0111\u01b0\u1ee3c hosted v\u00e0 c\u00f3 phi\u00ean b\u1ea3n ngu\u1ed3n m\u1edf cho h\u1ea7u h\u1ebft c\u00e1c n\u1ec1n t\u1ea3ng) ho\u1eb7c th\u00eam thi\u1ebft b\u1ecb t\u00f9y ch\u1ec9nh.<\/li><li><strong>X\u00e1c \u0111\u1ecbnh v\u00e0 kh\u1eafc ph\u1ee5c<\/strong> c\u00e1c nguy\u00ean nh\u00e2n h\u00e0ng \u0111\u1ea7u g\u00e2y t\u1eafc ngh\u1ebdn c\u1ed5 chai l\u00e0m \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn hi\u1ec7u su\u1ea5t. N\u1ebfu b\u1ea1n s\u1eed d\u1ee5ng framework web, ho\u1eb7c n\u1ec1n t\u1ea3ng qu\u1ea3n l\u00fd n\u1ed9i dung&nbsp;ph\u1ed5 bi\u1ebfn, tham kh\u1ea3o t\u00e0i li\u1ec7u v\u1ec1 c\u00e1c th\u1ef1c h\u00e0nh t\u1ed1t nh\u1ea5t c\u1ee7a n\u00f3 \u0111\u1ec3 t\u1ed1i \u01b0u h\u00f3a hi\u1ec7u su\u1ea5t.<\/li><li><strong>Theo d\u00f5i v\u00e0 c\u1ea3nh b\u00e1o<\/strong> cho b\u1ea5t c\u1ee9 v\u1ea5n \u0111\u1ec1 suy gi\u1ea3m (<em>regressions<\/em>) v\u1ec1 hi\u1ec7u su\u1ea5t n\u00e0o trong t\u01b0\u01a1ng lai!<\/li><\/ol>\n\n\n\n<p><strong>Kinh nghi\u1ec7m c\u00e1 nh\u00e2n v\u1edbi WordPress<\/strong>: Khi so s\u00e1nh 2 trang WordPress c\u1ee7a m\u00ecnh th\u00ec th\u1ea5y m\u1ed9t trang c\u00f3 v\u1ea5n \u0111\u1ec1 v\u1ec1 th\u1eddi gian ph\u1ea3n h\u1ed3i m\u00e1y ch\u1ee7, m\u1ed9t trang th\u00ec kh\u00f4ng. Trang c\u00f3 v\u1ea5n \u0111\u1ec1 l\u1ea1i l\u00e0 trang nh\u1eb9 h\u01a1n, b\u1eb1ng 1\/10 truy c\u1eadp trang kia, \u00edt c\u00e0i c\u1eafm plugin &amp; c\u0169ng kh\u00f4ng c\u00f3 plugin n\u1eb7ng. Th\u1eddi gian ph\u1ea3n h\u1ed3i c\u1ee7a trang ch\u1eadm \u0111\u1ec1u tr\u00ean 0,4 gi\u00e2y (400ms).<\/p>\n\n\n\n<p>V\u1ea5n \u0111\u1ec1 v\u1edbi trang c\u1ee7a m\u00ecnh l\u00e0 hosting, m\u1ed9t trang \u0111\u01b0\u1ee3c \u0111\u1eb7t tr\u00ean host t\u1ed1i \u01b0u cho WordPress, c\u00f2n trang kia \u0111\u1eb7t tr\u00ean VPS th\u00f4ng th\u01b0\u1eddng c\u00f9ng v\u00e0i trang kh\u00e1c n\u1eefa.<\/p>\n\n\n\n<p>V\u00ec kh\u00f4ng c\u00f3 v\u1ea5n \u0111\u1ec1 kh\u00e1c trong qu\u00e1 kh\u1ee9 n\u00ean m\u00ecnh ch\u1eb3ng c\u00f3 g\u00ec \u0111\u1ec3 n\u00f3i th\u00eam. Ngo\u00e0i chuy\u1ec7n n\u00e0y:<\/p>\n\n\n\n<p>\u0110\u00f4i khi c\u00e1c plugin c\u00f3 kh\u1ea3 n\u0103ng xung \u0111\u1ed9t v\u1edbi nhau v\u00e0 c\u00f3 th\u1ec3 \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn t\u1ed1c \u0111\u1ed9 t\u1ea3i trang, c\u00f3 kh\u1ea3 n\u0103ng l\u00e0 do \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn RAM ho\u1eb7c CPU.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"4_Tan_dung_suc_manh_bo_nho_dem_cua_trinh_duyet\"><\/span><span style=\"background-color: #ffff00;\">4. T\u1eadn d\u1ee5ng s\u1ee9c m\u1ea1nh b\u1ed9 nh\u1edb \u0111\u1ec7m c\u1ee7a tr\u00ecnh duy\u1ec7t<\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Quy t\u1eafc n\u00e0y k\u00edch ho\u1ea1t khi PageSpeed Insights ph\u00e1t hi\u1ec7n h\u1ed3i \u0111\u00e1p t\u1eeb m\u00e1y ch\u1ee7 c\u1ee7a b\u1ea1n kh\u00f4ng bao g\u1ed3m caching header ho\u1eb7c n\u1ebfu c\u00f3 th\u00ec ch\u1ec9 \u0111\u01b0\u1ee3c ch\u1ec9 \u0111\u1ecbnh th\u1eddi gian cache ng\u1eafn (<em>specified to be cached for only a short time<\/em>).<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">T\u1ed5ng quan<\/h3>\n\n\n\n<p>T\u00ecm n\u1ea1p ngu\u1ed3n qua m\u1ea1ng (<em>fetching resources over the network<\/em>) g\u1eb7p hai b\u1ea5t l\u1ee3i l\u00e0 ch\u1eadm v\u00e0 \u0111\u1eaft \u0111\u1ecf: dowload c\u00f3 th\u1ec3 c\u1ea7n nhi\u1ec1u v\u00f2ng l\u1eb7p gi\u1eefa m\u00e1y kh\u00e1ch v\u00e0 m\u00e1y ch\u1ee7 (<em>server<\/em>), \u0111i\u1ec1u n\u00e0y s\u1ebd l\u00e0m tr\u00ec ho\u00e3n x\u1eed l\u00fd v\u00e0 c\u00f3 th\u1ec3 ng\u0103n ch\u1eb7n qu\u00e1 tr\u00ecnh hi\u1ec3n th\u1ecb (<em>rendering<\/em>) n\u1ed9i dung c\u1ee7a trang, n\u00f3 c\u0169ng l\u00e0m t\u0103ng chi ph\u00ed d\u1eef li\u1ec7u (<em>incurs data costs<\/em>) cho ng\u01b0\u1eddi xem. T\u1ea5t c\u1ea3 h\u1ed3i \u0111\u00e1p t\u1eeb m\u00e1y ch\u1ee7 ph\u1ea3i ch\u1ec9 r\u00f5 (<em>specify<\/em>) ch\u00ednh s\u00e1ch (th\u00f4ng s\u1ed1) caching \u0111\u1ec3 gi\u00fap m\u00e1y kh\u00e1ch x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c khi n\u00e0o n\u00f3 c\u00f3 th\u1ec3 s\u1eed d\u1ee5ng l\u1ea1i (<em>reuse<\/em>) ph\u1ea3n h\u1ed3i t\u00ecm n\u1ea1p \u0111\u00e3 c\u00f3 tr\u01b0\u1edbc \u0111\u00f3.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">L\u1eddi khuy\u00ean<\/h3>\n\n\n\n<p>M\u1ed7i t\u00e0i nguy\u00ean n\u00ean ch\u1ec9 \u0111\u1ecbnh r\u00f5 r\u00e0ng ch\u00ednh s\u00e1ch (th\u00f4ng s\u1ed1) caching \u0111\u1ec3 tr\u1ea3 l\u1eddi c\u00e1c c\u00e2u h\u1ecfi sau: khi n\u00e0o d\u1eef li\u1ec7u ngu\u1ed3n c\u00f3 th\u1ec3 l\u01b0u tr\u1eef, ai l\u01b0u tr\u1eef, trong bao l\u00e2u, v\u00e0 n\u1ebfu \u0111\u01b0\u1ee3c \u00e1p d\u1ee5ng th\u00ec l\u00e0m th\u1ebf n\u00e0o \u0111\u1ec3 vi\u1ec7c ki\u1ec3m tra l\u1ea1i hi\u1ec7u qu\u1ea3 khi th\u1eddi gian caching h\u1ebft h\u1ea1n (<em>caching policy expires<\/em>).&nbsp;Khi m\u00e1y ch\u1ee7 tr\u1ea3 v\u1ec1 h\u1ed3i \u0111\u00e1p, n\u00f3 ph\u1ea3i cung c\u1ea5p Cache-Control v\u00e0 ETag headers:<\/p>\n\n\n\n<ul><li>Cache-Control \u0111\u1ecbnh ngh\u0129a c\u00e1ch th\u1ee9c v\u00e0 bao l\u00e2u m\u1ed9t h\u1ed3i \u0111\u00e1p c\u1ee5 th\u1ec3 \u0111\u01b0\u1ee3c cache b\u1edfi tr\u00ecnh duy\u1ec7t v\u00e0 c\u00e1c b\u1ed9 cache trung gian kh\u00e1c. \u0110\u1ec3 bi\u1ebft th\u00eam, xem <a href=\"https:\/\/developers.google.com\/web\/fundamentals\/performance\/optimizing-content-efficiency\/http-caching#cache-control\" target=\"_blank\" rel=\"noreferrer noopener\">caching v\u1edbi Cache-Control<\/a>.<\/li><li>ETag cung c\u1ea5p m\u00e3 th\u00f4ng b\u00e1o ki\u1ec3m tra l\u1ea1i (<em>revalidation token<\/em>), \u0111\u01b0\u1ee3c t\u1ef1 \u0111\u1ed9ng g\u1eedi \u0111i b\u1edfi tr\u00ecnh duy\u1ec7t \u0111\u1ec3 ki\u1ec3m tra n\u1ebfu ngu\u1ed3n thay \u0111\u1ed5i k\u1ec3 t\u1eeb l\u1ea7n y\u00eau c\u1ea7u cu\u1ed1i. \u0110\u1ec3 bi\u1ebft th\u00eam, xem <a href=\"https:\/\/developers.google.com\/web\/fundamentals\/performance\/optimizing-content-efficiency\/http-caching#validating-cached-responses-with-etags\" target=\"_blank\" rel=\"noreferrer noopener\">x\u00e1c nh\u1eadn h\u1ed3i \u0111\u00e1p cache v\u1edbi ETags<\/a>.<\/li><\/ul>\n\n\n\n<p>\u0110\u1ec3 x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c ch\u00ednh s\u00e1ch caching t\u1ed1i \u01b0u cho trang c\u1ee7a b\u1ea1n, h\u00e3y s\u1eed d\u1ee5ng c\u00e1c h\u01b0\u1edbng d\u1eabn sau:<\/p>\n\n\n\n<ul><li><a href=\"https:\/\/developers.google.com\/web\/fundamentals\/performance\/optimizing-content-efficiency\/http-caching#defining-optimal-cache-control-policy\" target=\"_blank\" rel=\"noreferrer noopener\">X\u00e1c \u0111\u1ecbnh ch\u00ednh s\u00e1ch Cache-Control t\u1ed1i \u01b0u<\/a><\/li><li><a href=\"https:\/\/developers.google.com\/web\/fundamentals\/performance\/optimizing-content-efficiency\/http-caching#invalidating-and-updating-cached-responses\" target=\"_blank\" rel=\"noreferrer noopener\">H\u1ee7y v\u00e0 c\u1eadp nh\u1eadt c\u00e1c h\u1ed3i \u0111\u00e1p c\u1ee7a b\u1ed9 nh\u1edb cache<\/a><\/li><li><a href=\"https:\/\/developers.google.com\/web\/fundamentals\/performance\/optimizing-content-efficiency\/http-caching#caching-checklist\" target=\"_blank\" rel=\"noreferrer noopener\">Danh s\u00e1ch ki\u1ec3m tra b\u1ed9 nh\u1edb \u0111\u1ec7m<\/a><\/li><\/ul>\n\n\n\n<p>Ch\u00fang t\u00f4i khuy\u00ean th\u1eddi gian cache t\u1ed1i thi\u1ec3u l\u00e0 m\u1ed9t tu\u1ea7n v\u00e0 t\u1ed1t nh\u1ea5t (<em>preferably<\/em>) l\u00e0 m\u1ed9t n\u0103m cho n\u1ed9i dung t\u0129nh, ho\u1eb7c c\u00e1c n\u1ed9i dung \u00edt khi thay \u0111\u1ed5i. N\u1ebfu b\u1ea1n c\u1ea7n ki\u1ec3m so\u00e1t ch\u00ednh x\u00e1c khi t\u00e0i nguy\u00ean kh\u00f4ng \u0111\u01b0\u1ee3c x\u00e1c nh\u1eadn, ch\u00fang t\u00f4i khuy\u00ean s\u1eed d\u1ee5ng d\u1ea5u v\u00e2n tay URL &#8211; xem h\u1ee7y v\u00e0 c\u1eadp nh\u1eadt h\u1ed3i \u0111\u00e1p cache \u1edf li\u00ean k\u1ebft tr\u00ean.<\/p>\n\n\n\n<p><strong>Kinh nghi\u1ec7m c\u00e1 nh\u00e2n v\u1edbi WordPress<\/strong>: B\u1ea1n c\u00f3 th\u1ec3 d\u1ec5 d\u00e0ng t\u1ea1o ho\u1eb7c <a href=\"https:\/\/kiencang.net\/bo-nho-dem-trinh-duyet\/\" target=\"_blank\" rel=\"noreferrer noopener\">t\u1ed1i \u01b0u b\u1ed9 nh\u1edb \u0111\u1ec7m c\u1ee7a tr\u00ecnh duy\u1ec7t<\/a> th\u00f4ng qua <a href=\"https:\/\/kiencang.net\/sua-htaccess-wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\">ch\u1ec9nh s\u1eeda file .htaccess<\/a>. Nhi\u1ec1u plugin t\u1ea1o b\u1ed9 nh\u1edb cache ph\u1ed5 bi\u1ebfn cho WordPress nh\u01b0 W3 Total Cache, WP Super Cache, <a href=\"https:\/\/kiencang.net\/wp-fastest-cache\/\" target=\"_blank\" rel=\"noreferrer noopener\">WP Fastest Cache<\/a> ho\u1eb7c WP Rocket cho ph\u00e9p b\u1ea1n l\u00e0m \u0111i\u1ec1u n\u00e0y qua giao di\u1ec7n tr\u1ef1c quan.<\/p>\n\n\n\n<p>N\u1ebfu b\u1ea1n kh\u00f4ng d\u00f9ng c\u00e1c plugin tr\u00ean m\u00e0 ch\u1ec9nh s\u1eeda th\u1ee7 c\u00f4ng, vi\u1ec7c \u0111\u00f3 c\u0169ng kh\u00f4ng h\u1ec1 kh\u00f3 kh\u0103n \u0111\u00e2u, b\u1ea1n d\u1ec5 d\u00e0ng t\u00ecm c\u00e1c m\u1eabu code chu\u1ea9n ch\u1ec9nh d\u00e0nh cho m\u00e1y ch\u1ee7 c\u1ee7a m\u00ecnh, n\u00f3 r\u1ea5t ph\u1ed5 bi\u1ebfn tr\u00ean m\u1ea1ng (trong \u0111\u01b0\u1eddng link t\u1ed1i \u01b0u b\u1ed9 nh\u1edb \u0111\u1ec7m c\u1ee7a tr\u00ecnh duy\u1ec7t \u1edf tr\u00ean c\u0169ng c\u00f3 \u0111o\u1ea1n m\u00e3 \u0111\u00f3).<\/p>\n\n\n\n<p>C\u00e1ch th\u1ee9c t\u0103ng t\u1ed1c n\u00e0y l\u00e0 \u0111i\u1ec1u r\u1ea5t \u0111\u00e1ng l\u00e0m v\u00ec n\u00f3 th\u1ef1c s\u1ef1 hi\u1ec7u qu\u1ea3, r\u1ea5t \u0111\u01a1n gi\u1ea3n v\u00e0 kh\u00f4ng t\u1ed1n k\u00e9m g\u00ec.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"5_Giam_thieu_tai_nguyen_HTML_CSS_va_JavaScript\"><\/span><span style=\"background-color: #ffff00;\">5. Gi\u1ea3m thi\u1ec3u t\u00e0i nguy\u00ean (HTML, CSS v\u00e0 JavaScript)<\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Quy t\u1eafc n\u00e0y \u0111\u01b0\u1ee3c k\u00edch ho\u1ea1t khi PageSpeed Insights ph\u00e1t hi\u1ec7n ra m\u1ed9t trong c\u00e1c ngu\u1ed3n c\u1ee7a b\u1ea1n c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c gi\u1ea3m thi\u1ec3u dung l\u01b0\u1ee3ng.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">T\u1ed5ng quan<\/h3>\n\n\n\n<p>Gi\u1ea3m thi\u1ec3u (<em>minification<\/em>) \u0111\u1ec1 c\u1eadp \u0111\u1ebfn qu\u00e1 tr\u00ecnh lo\u1ea1i b\u1ecf c\u00e1c d\u1eef li\u1ec7u kh\u00f4ng c\u1ea7n thi\u1ebft (<em>unnecessary<\/em>) ho\u1eb7c d\u01b0 th\u1eeba (<em>redundant<\/em>) m\u00e0 kh\u00f4ng l\u00e0m \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn vi\u1ec7c tr\u00ecnh duy\u1ec7t x\u1eed l\u00fd ngu\u1ed3n n\u1ed9i dung &#8211; th\u00ed d\u1ee5 nh\u01b0 m\u00e3 c\u1ee7a b\u00ecnh lu\u1eadn, lo\u1ea1i b\u1ecf code kh\u00f4ng s\u1eed d\u1ee5ng, s\u1eed d\u1ee5ng c\u00e1c t\u00ean bi\u1ebfn v\u00e0 t\u00ean h\u00e0m ng\u1eafn h\u01a1n v\u00e0 nhi\u1ec1u k\u1ef9 thu\u1eadt kh\u00e1c n\u1eefa.<\/p>\n\n\n\n<p>Xem <a href=\"https:\/\/developers.google.com\/web\/fundamentals\/performance\/optimizing-content-efficiency\/optimize-encoding-and-transfer#minification-preprocessing--context-specific-optimizations\" target=\"_blank\" rel=\"noreferrer noopener\">ti\u1ec1n x\u1eed l\u00fd v\u00e0 t\u1ed1i \u01b0u h\u00f3a theo ng\u1eef c\u1ea3nh c\u1ee5 th\u1ec3<\/a> \u0111\u1ec3 bi\u1ebft th\u00eam chi ti\u1ebft.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">L\u1eddi khuy\u00ean<\/h3>\n\n\n\n<p>B\u1ea1n n\u00ean gi\u1ea3m thi\u1ec3u ngu\u1ed3n HTML, CSS v\u00e0 JavaScript:<\/p>\n\n\n\n<ul><li><strong>\u0110\u1ec3 gi\u1ea3m thi\u1ec3u HTML<\/strong>, th\u1eed d\u00f9ng <a href=\"https:\/\/github.com\/kangax\/html-minifier\" target=\"_blank\" rel=\"noreferrer noopener\">HTMLMinifier<\/a><\/li><li><strong>\u0110\u1ec3 <a href=\"https:\/\/kiencang.net\/giam-thieu-css\/\" target=\"_blank\" rel=\"noreferrer noopener\">gi\u1ea3m thi\u1ec3u CSS<\/a><\/strong> th\u1eed d\u1ee5ng <a href=\"https:\/\/github.com\/ben-eb\/cssnano\" target=\"_blank\" rel=\"noreferrer noopener\">CSSNano<\/a> v\u00e0 <a href=\"https:\/\/github.com\/css\/csso\" target=\"_blank\" rel=\"noreferrer noopener\">csso<\/a><\/li><li><strong>\u0110\u1ec3 gi\u1ea3m thi\u1ec3u JavaScript<\/strong> th\u1eed d\u00f9ng <a href=\"https:\/\/github.com\/mishoo\/UglifyJS2\" target=\"_blank\" rel=\"noreferrer noopener\">UglifyJS<\/a>. Ngo\u00e0i ra <a href=\"https:\/\/developers.google.com\/closure\/compiler\" target=\"_blank\" rel=\"noreferrer noopener\">Closure Compiler<\/a> c\u0169ng <a href=\"https:\/\/github.com\/samccone\/The-cost-of-transpiling-es2015-in-2016#summary-of-findings\" target=\"_blank\" rel=\"noreferrer noopener\">r\u1ea5t hi\u1ec7u qu\u1ea3<\/a>. B\u1ea1n c\u00f3 th\u1ec3 t\u1ea1o m\u1ed9t qu\u00e1 tr\u00ecnh x\u00e2y d\u1ef1ng b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng c\u00e1c c\u00f4ng c\u1ee5 n\u00e0y \u0111\u1ec3 gi\u1ea3m thi\u1ec3u v\u00e0 thay \u0111\u1ed5i t\u00ean c\u1ee7a c\u00e1c file ph\u00e1t tri\u1ec3n v\u00e0 l\u01b0u ch\u00fang trong th\u01b0 m\u1ee5c s\u1ea3n ph\u1ea9m.<\/li><\/ul>\n\n\n\n<p>Ngo\u00e0i ra, <a href=\"https:\/\/developers.google.com\/speed\/pagespeed\/module\/\" target=\"_blank\" rel=\"noreferrer noopener\">PageSpeed Module<\/a>, t\u01b0\u01a1ng h\u1ee3p v\u1edbi c\u1ea3 m\u00e1y ch\u1ee7 Apache ho\u1eb7c Nginx s\u1ebd t\u1ef1 \u0111\u1ed9ng t\u1ed1i \u01b0u trang c\u1ee7a b\u1ea1n, bao g\u1ed3m c\u1ea3 vi\u1ec7c t\u1ed1i thi\u1ec3u h\u00f3a ngu\u1ed3n.<\/p>\n\n\n\n<p><strong>Kinh nghi\u1ec7m c\u00e1 nh\u00e2n v\u1edbi WordPress<\/strong>: B\u1ea1n c\u00f3 th\u1ec3 th\u1ea5y \u0111\u00e2y l\u00e0 c\u00e1ch th\u1ee9c r\u1ea5t d\u1ec5 hi\u1ec3u \u0111\u1ec3 c\u1ea3i thi\u1ec7n dung l\u01b0\u1ee3ng c\u1ee7a trang. B\u1ea1n \u0111\u01a1n gi\u1ea3n lo\u1ea1i b\u1ecf c\u00e1c d\u1eef li\u1ec7u kh\u00f4ng c\u1ea7n thi\u1ebft. Hi\u1ec7n m\u1ed9t trong c\u00e1c plugin r\u1ea5t m\u1ea1nh trong c\u00f4ng vi\u1ec7c n\u00e0y c\u1ee7a WordPress l\u00e0 <a href=\"https:\/\/wordpress.org\/plugins\/autoptimize\/\" target=\"_blank\" rel=\"noreferrer noopener\">Autoptimize<\/a>\u00a0(xem <a href=\"https:\/\/kiencang.net\/plugin-autoptimize\/\" target=\"_blank\" rel=\"noreferrer noopener\">h\u01b0\u1edbng d\u1eabn s\u1eed d\u1ee5ng Autopimize \u1edf \u0111\u00e2y<\/a>) k\u1ebft h\u1ee3p nhi\u1ec1u c\u00e1ch th\u1ee9c t\u1ed1i \u01b0u trong \u0111\u00f3 c\u00f3 c\u1ea3 gi\u1ea3m thi\u1ec3u dung l\u01b0\u1ee3ng, n\u1ed1i file &amp; <a href=\"https:\/\/kiencang.net\/plugin-async-javascript\/\" target=\"_blank\" rel=\"noreferrer noopener\">t\u1ea3i kh\u00f4ng \u0111\u1ed3ng b\u1ed9\/tr\u00ec ho\u00e3n JS<\/a>. Ngo\u00e0i ra th\u00ec nhi\u1ec1u plugin chuy\u00ean cho cache c\u0169ng c\u00f3 s\u1eb5n t\u00ednh n\u0103ng n\u00e0y, v\u00ed d\u1ee5 nh\u01b0 <a href=\"https:\/\/wp-rocket.me\/\" target=\"_blank\" rel=\"noreferrer noopener\">WP-Rocket<\/a>.<\/p>\n\n\n\n<p>N\u1ebfu gi\u1ea3m thi\u1ec3u dung l\u01b0\u1ee3ng kh\u00f4ng \u1ea3nh h\u01b0\u1edfng g\u00ec \u0111\u1ebfn vi\u1ec7c hi\u1ec3n th\u1ecb th\u00ec n\u1ed1i file v\u00e0 t\u1ea3i kh\u00f4ng \u0111\u1ed3ng b\u1ed9\/tr\u00ec ho\u00e3n CSS, JS c\u00f3 th\u1ec3 g\u00e2y l\u1ed7i giao di\u1ec7n. \u0110\u00e2y l\u00e0 nguy\u00ean nh\u00e2n m\u00e0 b\u1ea1n c\u1ea7n ki\u1ec3m tra k\u1ef9 l\u1ea1i trang sau khi d\u00f9ng Autoptimize, \u0111\u1eb7c bi\u1ec7t l\u00e0 nh\u1eefng trang c\u00f3 giao di\u1ec7n ph\u1ee9c t\u1ea1p, ho\u1eb7c c\u00f3 nhi\u1ec1u t\u00ednh n\u0103ng. Trong \u0111a s\u1ed1 tr\u01b0\u1eddng h\u1ee3p t\u1ed1i \u01b0u cho JS, CSS v\u00e0 HTML l\u00e0 c\u00e1ch th\u1ee9c r\u1ea5t an to\u00e0n.<\/p>\n\n\n\n<p>Vi\u1ec7c ch\u1ec9nh s\u1eeda th\u1ee7 c\u00f4ng b\u1eb1ng c\u00e1c c\u00f4ng c\u1ee5 m\u00e0 Google g\u1ee3i \u00fd \u1edf tr\u00ean c\u0169ng kh\u00e1 hay, nh\u01b0ng \u0111\u00f2i h\u1ecfi b\u1ea1n ph\u1ea3i t\u00ecm hi\u1ec3u s\u00e2u h\u01a1n v\u1ec1 WordPress ch\u1ee9 n\u00f3 kh\u00f4ng \u0111\u01a1n gi\u1ea3n nh\u01b0 c\u00e1ch d\u00f9ng plugin.<\/p>\n\n\n\n<p>Tuy nhi\u00ean nh\u01b0\u1ee3c \u0111i\u1ec3m c\u1ee7a ch\u1ec9nh s\u1eeda th\u1ee7 c\u00f4ng ngay c\u1ea3 khi b\u1ea1n l\u00e0 ng\u01b0\u1eddi kh\u00e1 th\u00e0nh th\u1ea1o \u0111i n\u1eefa \u0111\u00f3 l\u00e0 n\u1ebfu theme c\u1eadp nh\u1eadt th\u00ec b\u1ea1n c\u0169ng ph\u1ea3i c\u1eadp nh\u1eadt l\u1ea1i c\u00e1c thao t\u00e1c th\u1ee7 c\u00f4ng c\u1ee7a m\u00ecnh &amp; \u0111i\u1ec1u n\u00e0y ch\u1eb3ng ph\u1ea3i l\u00e0 c\u00f4ng vi\u1ec7c nh\u1eb9 nh\u00e0ng, d\u1ec5 nh\u1edb hay th\u00fa v\u1ecb g\u00ec. D\u00f9ng plugin th\u00ec kh\u00f4ng b\u1ecb nh\u01b0 th\u1ebf, n\u00f3 t\u1ef1 \u0111\u1ed9ng l\u00e0m cho b\u1ea1n (t\u00f4i ngh\u0129 c\u00f3 l\u1ebd \u0111\u00f3 l\u00e0 l\u00fd do t\u1ea1i sao ng\u01b0\u1eddi ph\u00e1t tri\u1ec3n plugin tr\u00ean \u0111\u1eb7t t\u00ean c\u1ee7a n\u00f3 b\u1eaft \u0111\u1ea7u b\u1eb1ng ti\u1ec1n t\u1ed1 auto \/ t\u1ef1 \u0111\u1ed9ng).<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"6_Toi_uu_hoa_anh\"><\/span><span style=\"background-color: #ffff00;\">6. T\u1ed1i \u01b0u h\u00f3a \u1ea3nh<\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Quy t\u1eafc n\u00e0y \u0111\u01b0\u1ee3c k\u00edch ho\u1ea1t khi PageSpeed Insights ph\u00e1t hi\u1ec7n c\u00e1c h\u00ecnh \u1ea3nh tr\u00ean trang c\u1ee7a b\u1ea1n c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c t\u1ed1i \u01b0u \u0111\u1ec3 gi\u1ea3m dung l\u01b0\u1ee3ng (<em>optimized to reduce their filesize<\/em>) m\u00e0 kh\u00f4ng \u1ea3nh h\u01b0\u1edfng \u0111\u00e1ng k\u1ec3 (<em>without significantly impacting<\/em>) \u0111\u1ebfn ch\u1ea5t l\u01b0\u1ee3ng \u0111\u1ed3 h\u1ecda (<em>visual quality<\/em>).<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">T\u1ed5ng quan<\/h3>\n\n\n\n<p>C\u00e1c h\u00ecnh \u1ea3nh th\u01b0\u1eddng chi\u1ebfm ph\u1ea7n l\u1edbn dung l\u01b0\u1ee3ng t\u1ea3i tr\u00ean trang. H\u1ec7 qu\u1ea3 l\u00e0: t\u1ed1i \u01b0u h\u00f3a h\u00ecnh \u1ea3nh c\u00f3 th\u1ec3 ti\u1ebft ki\u1ec7m \u0111\u01b0\u1ee3c r\u1ea5t nhi\u1ec1u dung l\u01b0\u1ee3ng (b\u0103ng th\u00f4ng) v\u00e0 n\u00e2ng cao hi\u1ec7u su\u1ea5t: c\u00e0ng \u00edt d\u1eef li\u1ec7u tr\u00ecnh duy\u1ec7t ph\u1ea3i t\u1ea3i xu\u1ed1ng, th\u00ec s\u1ef1 c\u1ea1nh tranh cho b\u0103ng th\u00f4ng c\u1ee7a kh\u00e1ch h\u00e0ng c\u0169ng \u00edt theo v\u00e0 tr\u00ecnh duy\u1ec7t c\u00f3 th\u1ec3 t\u1ea3i v\u00e0 hi\u1ec3n th\u1ecb n\u1ed9i dung tr\u00ean m\u00e0n h\u00ecnh nhanh h\u01a1n.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">L\u1eddi khuy\u00ean<\/h3>\n\n\n\n<p>T\u00ecm ra \u0111\u1ecbnh d\u1ea1ng t\u1ed1i \u01b0u (<em>optimal format<\/em>) v\u00e0 chi\u1ebfn l\u01b0\u1ee3c t\u1ed1i \u01b0u h\u00f3a h\u00ecnh \u1ea3nh c\u1ee7a b\u1ea1n c\u00f3 th\u1ec3 ph\u1ea3i y\u00eau c\u1ea7u ph\u00e2n t\u00edch c\u1ea9n th\u1eadn tr\u00ean nhi\u1ec1u kh\u00eda c\u1ea1nh: ki\u1ec3u d\u1eef li\u1ec7u \u0111\u01b0\u1ee3c m\u00e3 h\u00f3a, c\u00e1c \u0111\u1ecbnh d\u1ea1ng h\u00ecnh \u1ea3nh c\u00f3 th\u1ec3, c\u00e0i \u0111\u1eb7t ch\u1ea5t l\u01b0\u1ee3ng, \u0111\u1ed9 ph\u00e2n gi\u1ea3i v\u00e0 nhi\u1ec1u \u0111i\u1ec1u kh\u00e1c n\u1eefa. Th\u00eam v\u00e0o \u0111\u00f3, b\u1ea1n c\u1ea7n xem x\u00e9t li\u1ec7u m\u1ed9t s\u1ed1 h\u00ecnh \u1ea3nh s\u1ebd t\u1ed1t nh\u1ea5t khi \u1edf \u0111\u1ecbnh d\u1ea1ng vector (SVG), m\u1ed9t s\u1ed1 hi\u1ec7u \u1ee9ng mong mu\u1ed1n c\u00f3 th\u1ec3 \u0111\u1ea1t \u0111\u01b0\u1ee3c th\u00f4ng qua CSS, v\u00e0 l\u00e0m th\u1ebf n\u00e0o ph\u00e2n ph\u1ed1i c\u00e1c \u0111\u1ecbnh d\u1ea1ng t\u00e0i nguy\u00ean th\u00edch h\u1ee3p cho t\u1eebng thi\u1ebft b\u1ecb.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">T\u1ed1i \u01b0u h\u00f3a cho t\u1ea5t c\u1ea3 c\u00e1c \u0111\u1ecbnh d\u1ea1ng \u1ea3nh<\/h3>\n\n\n\n<ul><li>Theo c\u00e1c <a href=\"https:\/\/developers.google.com\/web\/fundamentals\/design-and-ui\/media\/images\" target=\"_blank\" rel=\"noreferrer noopener\">th\u1ef1c h\u00e0nh t\u1ed1t nh\u1ea5t cho c\u00e1c h\u00ecnh \u1ea3nh \u0111\u00e1p \u1ee9ng<\/a><\/li><li>Theo c\u00e1c <a href=\"https:\/\/developers.google.com\/web\/fundamentals\/performance\/optimizing-content-efficiency\/image-optimization#image_optimization_checklist\" target=\"_blank\" rel=\"noreferrer noopener\">checklist t\u1ed1i \u01b0u h\u00f3a \u1ea3nh cho t\u1eebng \u1ea3nh ri\u00eang l\u1ebb<\/a> (t\u00f4i \u0111\u00e3 d\u1ecbch b\u00e0i vi\u1ebft n\u00e0y sang ti\u1ebfng Vi\u1ec7t, b\u1ea1n \u0111\u1ecdc \u1edf \u0111\u00e2y: <a href=\"https:\/\/kiencang.net\/toi-uu-hoa-anh-tren-web\/\" target=\"_blank\" rel=\"noreferrer noopener\">C\u00e1ch t\u1ed1i \u01b0u h\u00f3a \u1ea3nh cho web<\/a>)<\/li><\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">T\u1ed1i \u01b0u h\u00f3a cho \u1ea3nh GIF, PNG v\u00e0 JPEG<\/h3>\n\n\n\n<p><a href=\"https:\/\/kiencang.net\/gif-png-jpg-hoac-svg\/\" target=\"_blank\" rel=\"noreferrer noopener\">GIF, PNG v\u00e0 JPEG<\/a> l\u00e0 c\u00e1c \u0111\u1ecbnh d\u1ea1ng chi\u1ebfm \u0111\u1ebfn 96% to\u00e0n b\u1ed9 l\u01b0u l\u01b0\u1ee3ng \u1ea3nh tr\u00ean Internet. Do s\u1ef1 ph\u1ed5 bi\u1ebfn c\u1ee7a ch\u00fang, PageSpeed Insights cung c\u1ea5p c\u00e1c l\u1eddi khuy\u00ean t\u1ed1i \u01b0a h\u00f3a c\u1ee5 th\u1ec3. \u0110\u1ec3 thu\u1eadn ti\u1ec7n cho b\u1ea1n, b\u1ea1n c\u00f3 th\u1ec3 t\u1ea3i c\u00e1c \u1ea3nh \u0111\u01b0\u1ee3c t\u1ed1i \u01b0u h\u00f3a tr\u1ef1c ti\u1ebfp t\u1eeb PageSpeed Insights (\u0111\u01b0\u1ee3c x\u1eed l\u00fd b\u1eb1ng th\u01b0 vi\u1ec7n t\u1ed1i \u01b0u h\u00ecnh \u1ea3nh c\u1ee7a <a href=\"http:\/\/www.modpagespeed.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">modpagespeed.com<\/a>).<\/p>\n\n\n\n<figure class=\"wp-block-image\"><a href=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/psi_optimized_contents_link.png\"><img decoding=\"async\" src=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/psi_optimized_contents_link.png\" alt=\"Pagespeed t\u1ed1i \u01b0u s\u1eb5n t\u00e0i nguy\u00ean \u0111\u1ec3 b\u1ea1n ch\u1ec9 vi\u1ec7c t\u1ea3i xu\u1ed1ng\" class=\"wp-image-5128\"\/><\/a><\/figure>\n\n\n\n<p>B\u1ea1n c\u0169ng c\u00f3 th\u1ec3 s\u1eed d\u1ee5ng c\u00e1c c\u00f4ng c\u1ee5 <a href=\"https:\/\/www.imagemagick.org\/script\/convert.php\" target=\"_blank\" rel=\"noreferrer noopener\">chuy\u1ec3n \u0111\u1ed5i nh\u1ecb ph\u00e2n<\/a> c\u1ee7a ImageMagick \u0111\u1ec3 th\u1ef1c hi\u1ec7n c\u00e1c t\u1ed1i \u01b0u h\u00f3a t\u01b0\u01a1ng t\u1ef1 &#8211; xem c\u00e1c v\u00ed d\u1ee5 h\u01b0\u1edbng d\u1eabn b\u00ean d\u01b0\u1edbi.<\/p>\n\n\n\n<p>N\u1ebfu b\u1ea1n <a href=\"https:\/\/kiencang.net\/cdn-toi-uu-anh\/\" target=\"_blank\" rel=\"noreferrer noopener\">s\u1eed d\u1ee5ng c\u00f4ng c\u1ee5 t\u1ed1i \u01b0u h\u00ecnh \u1ea3nh c\u1ee7a b\u00ean th\u1ee9 ba<\/a>, h\u00e3y \u00fd th\u1ee9c r\u1eb1ng qu\u00e1 tr\u00ecnh chuy\u1ec3n \u0111\u1ed5i c\u00f3 th\u1ec3 l\u00e0m h\u00ecnh \u1ea3nh l\u1edbn h\u01a1n n\u1ebfu c\u00e1c \u1ea3nh c\u1ee7a b\u1ea1n \u0111\u00e3 \u0111\u01b0\u1ee3c t\u1ed1i \u01b0u s\u1eb5n t\u1eeb tr\u01b0\u1edbc r\u1ea5t t\u1ed1t r\u1ed3i (t\u00f4i c\u0169ng t\u1eebng chia s\u1ebb kinh nghi\u1ec7m n\u00e0y trong b\u00e0i vi\u1ebft <a href=\"https:\/\/kiencang.net\/chuyen-anh-jpg-va-png-sang-webp\/\" target=\"_blank\" rel=\"noreferrer noopener\">th\u1eed chuy\u1ec3n JPG &amp; PNG sang WebP<\/a>). N\u1ebfu t\u00ecnh hu\u1ed1ng n\u00e0y x\u1ea3y ra, h\u00e3y s\u1eed d\u1ee5ng l\u1ea1i b\u1ea3n g\u1ed1c c\u1ee7a b\u1ea1n.<\/p>\n\n\n\n<p><strong>GIF<\/strong> v\u00e0 <strong>PNG<\/strong> l\u00e0 \u0111\u1ecbnh d\u1ea1ng kh\u00f4ng m\u1ea5t d\u1eef li\u1ec7u, v\u00ec v\u1eady qu\u00e1 tr\u00ecnh x\u1eed l\u00fd n\u00e9n s\u1ebd kh\u00f4ng g\u00e2y b\u1ea5t k\u1ef3 \u1ea3nh h\u01b0\u1edfng n\u00e0o \u0111\u1ebfn ch\u1ea5t l\u01b0\u1ee3ng h\u00ecnh \u1ea3nh. \u0110\u1ed1i v\u1edbi h\u00ecnh \u1ea3nh t\u0129nh, PNG \u0111\u1ea1t \u0111\u01b0\u1ee3c t\u1ef7 l\u1ec7 n\u00e9n t\u1ed1t h\u01a1n v\u1edbi ch\u1ea5t l\u01b0\u1ee3ng h\u00ecnh \u1ea3nh t\u1ed1t h\u01a1n. V\u1edbi h\u00ecnh \u1ea3nh \u0111\u1ed9ng, <a href=\"https:\/\/kiencang.net\/gioi-thieu-plugin-wp-youtube-lyte\/\" target=\"_blank\" rel=\"noreferrer noopener\">xem x\u00e9t s\u1eed d\u1ee5ng video<\/a> thay v\u00ec GIF \u0111\u1ec3 nh\u1eadn \u0111\u01b0\u1ee3c kh\u1ea3 n\u0103ng n\u00e9n t\u1ed1t h\u01a1n.<\/p>\n\n\n\n<ul><li>Lu\u00f4n lu\u00f4n chuy\u1ec3n \u0111\u1ed5i GIF sang PNG tr\u1eeb khi \u1ea3nh g\u1ed1c l\u00e0 \u1ea3nh \u0111\u1ed9ng ho\u1eb7c r\u1ea5t nh\u1ecf (\u00edt h\u01a1n v\u00e0i tr\u0103m bytes).<\/li><li>V\u1edbi c\u1ea3 \u1ea3nh GIF v\u00e0 PNG, lo\u1ea1i b\u1ecf k\u00eanh alpha n\u1ebfu t\u1ea5t c\u1ea3 c\u00e1c pixel kh\u00f4ng r\u00f5 r\u00e0ng.<\/li><\/ul>\n\n\n\n<p>L\u1ea5y th\u00ed d\u1ee5, b\u1ea1n c\u00f3 th\u1ec3 s\u1eed d\u1ee5ng chuy\u1ec3n \u0111\u1ed5i nh\u1ecb ph\u00e2n \u0111\u1ec3 t\u1ed1i \u01b0u \u1ea3nh GIF v\u00e0 PNG v\u1edbi c\u00e1c l\u1ec7nh sau (c\u00e1c th\u00f4ng s\u1ed1 b\u00ean trong d\u1ea5u ngo\u1eb7c l\u00e0 t\u00f9y ch\u1ecdn):<\/p>\n\n\n\n<p><em>convert INPUT.gif_or_png -strip [-resize WxH] [-alpha Remove] OUTPUT.png<\/em><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><a href=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/cuppa.png\"><img decoding=\"async\" src=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/cuppa.png\" alt=\"cuppa.png (1,763 Bytes)\" class=\"wp-image-5129\"\/><\/a><figcaption>cuppa.png (1,763 Bytes)<\/figcaption><\/figure><\/div>\n\n\n<p><em>convert cuppa.png -strip cuppa_converted.png<\/em><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><a href=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/cuppa_converted.png\"><img decoding=\"async\" src=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/cuppa_converted.png\" alt=\"cuppa_converted.png (856 Bytes)\" class=\"wp-image-5130\"\/><\/a><figcaption>cuppa_converted.png (856 Bytes) &#8211; gi\u1ea3m \u0111\u01b0\u1ee3c h\u01a1n 50% dung l\u01b0\u1ee3ng<\/figcaption><\/figure><\/div>\n\n\n<p><strong>JPEG<\/strong> l\u00e0 \u0111\u1ecbnh d\u1ea1ng m\u1ea5t d\u1eef li\u1ec7u. Qu\u00e1 tr\u00ecnh n\u00e9n s\u1ebd lo\u1ea1i b\u1ecf c\u00e1c chi ti\u1ebft c\u1ee7a b\u1ee9c h\u00ecnh, nh\u01b0ng t\u1ef7 l\u1ec7 n\u00e9n c\u00f3 th\u1ec3 <strong>cao h\u01a1n 10 l\u1ea7n<\/strong> so v\u1edbi GIF ho\u1eb7c PNG.<\/p>\n\n\n\n<ul><li>Gi\u1ea3m ch\u1ea5t l\u01b0\u1ee3ng xu\u1ed1ng 85 n\u1ebfu dung l\u01b0\u1ee3ng sau v\u1eabn cao h\u01a1n. V\u1edbi ch\u1ea5t l\u01b0\u1ee3ng cao h\u01a1n 85, dung l\u01b0\u1ee3ng h\u00ecnh \u1ea3nh t\u0103ng l\u00ean nhanh ch\u00f3ng, trong khi ch\u1ea5t l\u01b0\u1ee3ng kh\u00f4ng c\u1ea3i thi\u1ec7n bao nhi\u00eau.<\/li><li>Gi\u1ea3m l\u1ea5y m\u1eabu Chroma xu\u1ed1ng 4:2:0, b\u1edfi v\u00ec h\u1ec7 th\u1ed1ng th\u1ecb gi\u00e1c c\u1ee7a con ng\u01b0\u1eddi k\u00e9m nh\u1ea1y c\u1ea3m v\u1edbi m\u00e0u s\u1eafc khi so s\u00e1nh v\u1edbi \u0111\u1ed9 s\u00e1ng (<em>lumniance<\/em>).<\/li><li>S\u1eed d\u1ee5ng \u0111\u1ecbnh d\u1ea1ng progressive cho \u1ea3nh tr\u00ean 10KB. <a href=\"https:\/\/kiencang.net\/anh-jpeg-progressive-la-gi\/\" target=\"_blank\" rel=\"noreferrer noopener\">\u1ea2nh JPEG progressive<\/a> th\u01b0\u1eddng c\u00f3 t\u1ef7 l\u1ec7n n\u00e9n cao h\u01a1n so v\u1edbi JPEG baseline cho c\u00e1c \u1ea3nh l\u1edbn, v\u00e0 c\u00f3 l\u1ee3i \u00edch trong vi\u1ec7c hi\u1ec3n th\u1ecb d\u1ea7n d\u1ea7n (hi\u1ec3n th\u1ecb to\u00e0n b\u1ed9 \u1ea3nh m\u1edd sau \u0111\u00f3 r\u00f5 d\u1ea7n ra).[2]<\/li><li>S\u1eed d\u1ee5ng kh\u00f4ng gian m\u00e0u x\u00e1m (<em>grayscale color space<\/em>) n\u1ebfu \u1ea3nh l\u00e0 \u0111en tr\u1eafng.<\/li><\/ul>\n\n\n\n<p>[2]: D\u01b0\u1edbi \u0111\u00e2y l\u00e0 v\u00ed d\u1ee5 v\u1ec1 hai tr\u01b0\u1eddng h\u1ee3p so s\u00e1nh \u1ea3nh t\u1ea3i theo ki\u1ec3u baseline &amp; progressive:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><a href=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/baselineJPEG.jpg\"><img decoding=\"async\" src=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/baselineJPEG.jpg\" alt=\"\u1ea2nh t\u1ea3i theo ki\u1ec3u baseline\" class=\"wp-image-5154\"\/><\/a><figcaption>\u1ea2nh t\u1ea3i theo ki\u1ec3u baseline &#8211; minh h\u1ecda c\u1ee7a trang adavu.com<\/figcaption><\/figure><\/div>\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><a href=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/progressiveJPEG.jpg\"><img decoding=\"async\" src=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/progressiveJPEG.jpg\" alt=\"\u1ea2nh t\u1ea3i theo ki\u1ec3u progressive\" class=\"wp-image-5155\"\/><\/a><figcaption>\u1ea2nh t\u1ea3i theo ki\u1ec3u progressive &#8211; minh h\u1ecda c\u1ee7a trang adavu.com<\/figcaption><\/figure><\/div>\n\n\n<p>L\u1ea5y v\u00ed d\u1ee5, b\u1ea1n c\u00f3 th\u1ec3 s\u1eed d\u1ee5ng chuy\u1ec3n \u0111\u1ed5i nh\u1ecb ph\u00e2n \u0111\u1ec3 t\u1ed1i \u01b0u c\u00e1c \u1ea3nh JPEG v\u1edbi c\u00e1c l\u1ec7nh sau (c\u00e1c tham s\u1ed1 b\u00ean trong d\u1ea5u ngo\u1eb7c vu\u00f4ng l\u00e0 t\u00f9y ch\u1ecdn):<\/p>\n\n\n\n<p><em>convert INPUT.jpg -sampling-factor 4:2:0 -strip [-resize WxH] [-quality N] [-interlace JPEG] [-colorspace Gray\/RGB] OUTPUT.jpg<\/em><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><a href=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/puzzle.jpg\"><img decoding=\"async\" src=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/puzzle.jpg\" alt=\"puzzle.jpg (13,501 Bytes)\" class=\"wp-image-5132\"\/><\/a><figcaption>puzzle.jpg (13,501 Bytes)<\/figcaption><\/figure><\/div>\n\n\n<p><em>convert puzzle.jpg -sampling-factor 4:2:0 -strip -quality 85 -interlace JPEG -colorspace RGB puzzle_converted.jpg<\/em><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><a href=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/puzzle_converted.jpg\"><img decoding=\"async\" src=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/puzzle_converted.jpg\" alt=\"puzzle_converted.jpg (4,654 Bytes)\" class=\"wp-image-5133\"\/><\/a><figcaption>puzzle_converted.jpg (4,654 Bytes)<\/figcaption><\/figure><\/div>\n\n\n<p><strong>Kinh nghi\u1ec7m c\u00e1 nh\u00e2n v\u1edbi WordPress<\/strong>: C\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 t\u1ea3i trang b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng \u1ea3nh th\u00f4ng minh &amp; t\u1ed1i \u01b0u l\u00e0 c\u00e1ch th\u1ee9c r\u1ea5t hi\u1ec7u qu\u1ea3. Tuy nhi\u00ean \u0111\u00e2y l\u00e0 m\u1ed9t trong nh\u1eefng vi\u1ec7c c\u1ea7n chuy\u00ean m\u00f4n nhi\u1ec1u nh\u1ea5t so v\u1edbi c\u00e1c bi\u1ec7n ph\u00e1p kh\u00e1c.<\/p>\n\n\n\n<p>M\u1eb7c d\u00f9 c\u00f3 kh\u00e1 nhi\u1ec1u <a href=\"https:\/\/kiencang.net\/plugin-nen-anh-wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\">plugin h\u1ed7 tr\u1ee3 cho WordPress trong vi\u1ec7c t\u1ed1i \u01b0u h\u00f3a \u1ea3nh<\/a>, c\u00f3 v\u00e0i \u0111i\u1ec1u \u0111i\u1ec1u b\u1ea1n c\u1ea7n l\u01b0u \u00fd:<\/p>\n\n\n\n<ul><li>Vi\u1ec7c quan tr\u1ecdng nh\u1ea5t trong vi\u1ec7c t\u1ed1i \u01b0u h\u00f3a dung l\u01b0\u1ee3ng \u1ea3nh l\u00e0 b\u1ea1n <strong>bi\u1ebft b\u1ea3n th\u00e2n th\u1ef1c s\u1ef1 c\u1ea7n ch\u1ea5t l\u01b0\u1ee3ng \u1ea3nh \u0111\u1ebfn \u0111\u00e2u<\/strong>. \u0110\u00e1nh \u0111\u1ed5i ch\u1ea5t l\u01b0\u1ee3ng d\u01b0 th\u1eeba l\u00e0 c\u1ea7n thi\u1ebft nh\u01b0ng n\u1ebfu qu\u00e1 ham gi\u1ea3m dung l\u01b0\u1ee3ng th\u1ea5p b\u1ea1n c\u00f3 th\u1ec3 bi\u1ebfn trang web tr\u00f4ng r\u1ea5t thi\u1ebfu chuy\u00ean nghi\u1ec7p.<\/li><li>N\u1ebfu s\u1ed1 l\u01b0\u1ee3ng \u1ea3nh t\u1ed1i \u01b0u kh\u00f4ng l\u1edbn th\u00ec c\u00e1c plugin d\u00e0nh cho WordPress r\u1ea5t d\u1ec5 t\u00ecm h\u00e0ng mi\u1ec5n ph\u00ed nh\u01b0ng n\u1ebfu s\u1ed1 l\u01b0\u1ee3ng \u1ea3nh l\u1edbn \u0111a s\u1ed1 \u0111\u1ec1u thu ph\u00ed, m\u1eb7c d\u00f9 s\u1ed1 ti\u1ec1n kh\u00f4ng l\u1edbn (10 USD \/ 10 ng\u00e0n \u1ea3nh, ho\u1eb7c 1GB).<\/li><li>N\u1ebfu kh\u00f4ng c\u1ea9n th\u1eadn b\u1ea1n s\u1ebd l\u00e0m ch\u1ea5t l\u01b0\u1ee3ng \u1ea3nh c\u1ee7a trang gi\u1ea3m \u0111i \u0111\u00e1ng k\u1ec3 ho\u1eb7c l\u00e0m dung l\u01b0\u1ee3ng c\u1ee7a \u1ea3nh t\u0103ng l\u00ean!<\/li><li>N\u00ean th\u1eadn tr\u1ecdng v\u1edbi n\u00e9n \u1ea3nh m\u1ea5t ch\u1ea5t l\u01b0\u1ee3ng.<\/li><li><a href=\"https:\/\/kiencang.net\/dinh-dang-anh-webp\/\" target=\"_blank\" rel=\"noreferrer noopener\">\u1ea2nh \u0111\u1ecbnh d\u1ea1ng m\u1edbi nh\u01b0 WebP<\/a> (c\u0169ng do Google ph\u00e1t tri\u1ec3n) r\u1ea5t \u0111\u00e1ng tham kh\u1ea3o &amp; t\u00ecm hi\u1ec3u k\u1ef9.<\/li><\/ul>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"7_Toi_uu_hoa_viec_phan_phoi_CSS\"><\/span><span style=\"background-color: #ffff00;\">7. T\u1ed1i \u01b0u h\u00f3a vi\u1ec7c ph\u00e2n ph\u1ed1i CSS<\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Xem th\u00eam:\u00a0<a href=\"https:\/\/kiencang.net\/toi-uu-hoa-phan-phoi-css\/\" target=\"_blank\" rel=\"noreferrer noopener\">https:\/\/kiencang.net\/toi-uu-hoa-phan-phoi-css\/<\/a><\/p>\n\n\n\n<p>Quy t\u1eafc n\u00e0y k\u00edch ho\u1ea1t khi PageSpeed Insights ph\u00e1t hi\u1ec7n (<em>detects<\/em>) trang b\u1ecb ch\u1eb7n hi\u1ec3n th\u1ecb c\u00f3 nguy\u00ean nh\u00e2n t\u1eeb vi\u1ec7c ch\u1ee9a c\u00e1c stylesheet ngo\u00e0i, \u0111i\u1ec1u n\u00e0y l\u00e0m tr\u00ec ho\u00e3n th\u1eddi gian trang hi\u1ec3n th\u1ecb n\u1ed9i dung ph\u1ea7n \u0111\u1ea7u (c\u00f2n g\u1ecdi l\u00e0 <a href=\"https:\/\/kiencang.net\/loai-bo-css-chan-hien-thi\/\" target=\"_blank\" rel=\"noreferrer noopener\">CSS ch\u1eb7n hi\u1ec3n th\u1ecb<\/a>).<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">T\u1ed5ng quan<\/h3>\n\n\n\n<p>Tr\u01b0\u1edbc khi tr\u00ecnh duy\u1ec7t c\u00f3 th\u1ec3 hi\u1ec3n th\u1ecb n\u1ed9i dung n\u00f3 bu\u1ed9c ph\u1ea3i x\u1eed l\u00fd t\u1ea5t c\u1ea3 th\u00f4ng tin style v\u00e0 layout cho trang hi\u1ec7n t\u1ea1i. H\u1ec7 qu\u1ea3 l\u00e0: tr\u00ecnh duy\u1ec7t s\u1ebd ch\u1eb7n hi\u1ec3n th\u1ecb (<em>block rendering<\/em>) cho \u0111\u1ebfn khi c\u00e1c file stylesheet ngo\u00e0i \u0111\u01b0\u1ee3c t\u1ea3i v\u00e0 x\u1eed l\u00fd xong (<em>downloaded and processed<\/em>), \u0111i\u1ec1u n\u00e0y c\u00f3 th\u1ec3 y\u00eau c\u1ea7u nhi\u1ec1u v\u00f2ng l\u1eb7p (<em>roundtrips<\/em>) v\u00e0 tr\u00ec ho\u00e3n l\u1ea7n hi\u1ec3n th\u1ecb trang \u0111\u1ea7u ti\u00ean. X\u00eam th\u00eam <a href=\"https:\/\/developers.google.com\/web\/fundamentals\/performance\/critical-rendering-path\/render-tree-construction\" target=\"_blank\" rel=\"noreferrer noopener\">c\u1ea5u tr\u00fac c\u00e2y c\u1ee7a qu\u00e1 tr\u00ecnh hi\u1ec3n th\u1ecb, layout v\u00e0 t\u1ea1o trang<\/a>\u00a0(<em>render-tree construction, layout, and paint<\/em>) ho\u1eb7c <a href=\"https:\/\/kiencang.net\/cach-trang-web-tai-va-hien-thi\/\" target=\"_blank\" rel=\"noreferrer noopener\">c\u00e1ch tr\u00ecnh duy\u1ec7t t\u1ea3i trang web c\u1ee7a b\u1ea1n<\/a> (ti\u1ebfng Vi\u1ec7t) \u0111\u1ec3 bi\u1ebft th\u00eam v\u1ec1 qu\u00e1 tr\u00ecnh x\u1eed l\u00fd hi\u1ec3n th\u1ecb trang, v\u00e0 xem th\u00eam <a href=\"https:\/\/developers.google.com\/web\/fundamentals\/performance\/critical-rendering-path\/render-blocking-css\" target=\"_blank\" rel=\"noreferrer noopener\">render blocking CSS<\/a> \u0111\u1ec3 c\u00f3 c\u00e1c m\u1eb9o m\u1edf ch\u1eb7n (<em>unblock<\/em>) hi\u1ec3n th\u1ecb v\u00e0 n\u00e2ng cao kh\u1ea3 n\u0103ng ph\u00e2n ph\u1ed1i CSS.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">L\u1eddi khuy\u00ean<\/h3>\n\n\n\n<p><a href=\"https:\/\/kiencang.net\/noi-tuyen-cac-css-nho\/\" target=\"_blank\" rel=\"noreferrer noopener\">N\u1ebfu file CSS b\u00ean ngo\u00e0i nh\u1ecf, b\u1ea1n c\u00f3 th\u1ec3 ch\u00e8n n\u00f3 tr\u1ef1c ti\u1ebfp v\u00e0o t\u00e0i li\u1ec7u HTML (inline)<\/a>, \u0111i\u1ec1u n\u00e0y \u0111\u01b0\u1ee3c g\u1ecdi l\u00e0 n\u1ed9i tuy\u1ebfn (kh\u00e1c v\u1edbi n\u1ed9i d\u00f2ng &#8211; n\u1ed9i d\u00f2ng l\u00e0 ch\u00e8n th\u1eb3ng v\u00e0o th\u1ebb HTML c\u1ee5 th\u1ec3). CSS n\u1ed9i tuy\u1ebfn nh\u1ecf theo c\u00e1ch n\u00e0y cho ph\u00e9p tr\u00ecnh duy\u1ec7t x\u1eed l\u00fd v\u1edbi vi\u1ec7c xu\u1ea5t trang t\u1ed1t h\u01a1n. N\u00ean nh\u1edb r\u1eb1ng n\u1ebfu file CSS l\u1edbn, \u0111\u1ec3 CSS n\u1ed9i tuy\u1ebfn c\u00f3 th\u1ec3 l\u00e0 nguy\u00ean nh\u00e2n khi\u1ebfn PageSpeed Insights c\u1ea3nh b\u00e1o (<em>warn<\/em>) ph\u1ea7n n\u1ed9i dung \u0111\u1ea7u (<em>above-the-fold<\/em>) [1] c\u1ee7a trang qu\u00e1 l\u1edbn th\u00f4ng qua <a href=\"https:\/\/kiencang.net\/uu-tien-noi-dung-hien-thi\/\" target=\"_blank\" rel=\"noreferrer noopener\">\u01afu ti\u00ean n\u1ed9i dung hi\u1ec3n th\u1ecb<\/a> (<em>prioritize visible content<\/em> \/ \u0111\u01b0\u1ee3c n\u00f3i chi ti\u1ebft trong ph\u1ea7n 8 &#8211; ngay sau ph\u1ea7n n\u00e0y). Trong tr\u01b0\u1eddng h\u1ee3p file CSS l\u1edbn, b\u1ea1n s\u1ebd c\u1ea7n x\u00e1c \u0111\u1ecbnh v\u00e0 \u0111\u1eb7t n\u1ed9i tuy\u1ebfn CSS c\u1ea7n thi\u1ebft cho vi\u1ec7c x\u1eed l\u00fd hi\u1ec3n th\u1ecb trang \u1edf ph\u1ea7n \u0111\u1ea7u (<a href=\"https:\/\/kiencang.net\/critical-css-wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\">critical CSS<\/a>) v\u00e0 tr\u00ec ho\u00e3n t\u1ea3i cho c\u00e1c style c\u00f2n l\u1ea1i cho \u0111\u1ebfn khi n\u1ed9i dung ph\u1ea7n \u0111\u1ea7u \u0111\u01b0\u1ee3c t\u1ea3i xong.<\/p>\n\n\n\n<p>[1]: Above the fold: ch\u1ec9 \u0111\u1ebfn ph\u1ea7n n\u1ed9i dung hi\u1ec3n th\u1ecb ra b\u00ean ngo\u00e0i m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean khi ng\u01b0\u1eddi d\u00f9ng t\u1ea3i trang, h\u1ecd kh\u00f4ng ph\u1ea3i cu\u1ed9n chu\u1ed9t \u0111\u1ec3 xem n\u1ed9i dung thu\u1ed9c Above the fold. Xem th\u00eam b\u00e0i vi\u1ebft n\u1ed9i dung thu\u1ed9c m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean \u0111\u1ec3 th\u1ea5y \u01b0u th\u1ebf c\u1ee7a ph\u1ea7n n\u1ed9i dung n\u00e0y.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">V\u00ed d\u1ee5 v\u1ec1 vi\u1ec7c \u0111\u1eb7t n\u1ed9i tuy\u1ebfn file CSS nh\u1ecf<\/h3>\n\n\n\n<p>L\u1ea5y v\u00ed d\u1ee5, n\u1ebfu t\u00e0i li\u1ec7u HTML gi\u1ed1ng nh\u01b0 th\u1ebf n\u00e0y:<\/p>\n\n\n\n<pre class=\"wp-block-preformatted prettyprint\"><span class=\"tag\">&lt;html&gt;<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"tag\">&lt;head&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;link<\/span> <span class=\"atn\">rel<\/span><span class=\"pun\">=<\/span><span class=\"atv\">\"stylesheet\"<\/span> <span class=\"atn\">href<\/span><span class=\"pun\">=<\/span><span class=\"atv\">\"small.css\"<\/span><span class=\"tag\">&gt;<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"tag\">&lt;\/head&gt;<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"tag\">&lt;body&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;div<\/span> <span class=\"atn\">class<\/span><span class=\"pun\">=<\/span><span class=\"atv\">\"blue yellow big bold\"<\/span><span class=\"tag\">&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; Hello, world!\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;\/div&gt;<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"tag\">&lt;\/body&gt;<\/span>\n<span class=\"tag\">&lt;\/html&gt;<\/span><\/pre>\n\n\n\n<p>V\u00e0 file ngu\u1ed3n small.css l\u00e0 nh\u01b0 n\u00e0y:<\/p>\n\n\n\n<pre class=\"wp-block-preformatted prettyprint\"><span class=\"pun\">.<\/span><span class=\"pln\">yellow <\/span><span class=\"pun\">{<\/span><span class=\"pln\">background<\/span><span class=\"pun\">-<\/span><span class=\"pln\">color<\/span><span class=\"pun\">:<\/span><span class=\"pln\"> yellow<\/span><span class=\"pun\">;}<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"pun\">.<\/span><span class=\"pln\">blue <\/span><span class=\"pun\">{<\/span><span class=\"pln\">color<\/span><span class=\"pun\">:<\/span><span class=\"pln\"> blue<\/span><span class=\"pun\">;}<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"pun\">.<\/span><span class=\"pln\">big <\/span><span class=\"pun\">{<\/span><span class=\"pln\"> font<\/span><span class=\"pun\">-<\/span><span class=\"pln\">size<\/span><span class=\"pun\">:<\/span> <span class=\"lit\">8em<\/span><span class=\"pun\">;<\/span> <span class=\"pun\">}<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"pun\">.<\/span><span class=\"pln\">bold <\/span><span class=\"pun\">{<\/span><span class=\"pln\"> font<\/span><span class=\"pun\">-<\/span><span class=\"pln\">weight<\/span><span class=\"pun\">:<\/span><span class=\"pln\"> bold<\/span><span class=\"pun\">;<\/span> <span class=\"pun\">}<\/span><\/pre>\n\n\n\n<p>Th\u00ec b\u1ea1n c\u00f3 th\u1ec3 \u0111\u1eb7t n\u1ed9i tuy\u1ebfn CSS nh\u01b0 b\u00ean d\u01b0\u1edbi:<\/p>\n\n\n\n<pre class=\"wp-block-preformatted prettyprint\"><span class=\"tag\">&lt;html&gt;<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"tag\">&lt;head&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;style&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; <\/span><span class=\"pun\">.<\/span><span class=\"pln\">yellow <\/span><span class=\"pun\">{<\/span><span class=\"kwd\">background-color<\/span><span class=\"pun\">:<\/span><span class=\"pln\"> yellow<\/span><span class=\"pun\">;}<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; <\/span><span class=\"pun\">.<\/span><span class=\"pln\">blue <\/span><span class=\"pun\">{<\/span><span class=\"kwd\">color<\/span><span class=\"pun\">:<\/span><span class=\"pln\"> blue<\/span><span class=\"pun\">;}<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; <\/span><span class=\"pun\">.<\/span><span class=\"pln\">big <\/span><span class=\"pun\">{<\/span> <span class=\"kwd\">font-size<\/span><span class=\"pun\">:<\/span> <span class=\"lit\">8em<\/span><span class=\"pun\">;<\/span> <span class=\"pun\">}<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; <\/span><span class=\"pun\">.<\/span><span class=\"pln\">bold <\/span><span class=\"pun\">{<\/span> <span class=\"kwd\">font-weight<\/span><span class=\"pun\">:<\/span><span class=\"pln\"> bold<\/span><span class=\"pun\">;<\/span> <span class=\"pun\">}<\/span><span class=\"pln\">\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;\/style&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;\/head&gt;<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"tag\">&lt;body&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;div<\/span> <span class=\"atn\">class<\/span><span class=\"pun\">=<\/span><span class=\"atv\">\"blue yellow big bold\"<\/span><span class=\"tag\">&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; Hello, world!\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;\/div&gt;<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"tag\">&lt;\/body&gt;<\/span>\n<span class=\"tag\">&lt;\/html&gt;<\/span><\/pre>\n\n\n\n<p>\u0110i\u1ec1u n\u00e0y s\u1ebd lo\u1ea1i b\u1ecf y\u00eau c\u1ea7u c\u1ee7a tr\u00ecnh duy\u1ec7t t\u1edbi small.css b\u1eb1ng c\u00e1ch \u0111\u1eb7t CSS n\u1ed9i tuy\u1ebfn trong t\u00e0i li\u1ec7u HTML.<\/p>\n\n\n\n<p>Ho\u1eb7c c\u00e1ch n\u00e0y, ph\u1ee9c t\u1ea1p h\u01a1n:<\/p>\n\n\n\n<pre class=\"wp-block-preformatted devsite-code-button-clone\"><span class=\"tag\">&lt;html&gt;<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"tag\">&lt;head&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;style&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; <\/span><span class=\"pun\">.<\/span><span class=\"pln\">blue<\/span><span class=\"pun\">{<\/span><span class=\"kwd\">color<\/span><span class=\"pun\">:<\/span><span class=\"pln\">blue<\/span><span class=\"pun\">;}<\/span><span class=\"pln\">\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;\/style&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;\/head&gt;<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"tag\">&lt;body&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;div<\/span> <span class=\"atn\">class<\/span><span class=\"pun\">=<\/span><span class=\"atv\">\"blue\"<\/span><span class=\"tag\">&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; Hello, world!\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;\/div&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;noscript<\/span> <span class=\"atn\">id<\/span><span class=\"pun\">=<\/span><span class=\"atv\">\"deferred-styles\"<\/span><span class=\"tag\">&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; <\/span><span class=\"tag\">&lt;link<\/span> <span class=\"atn\">rel<\/span><span class=\"pun\">=<\/span><span class=\"atv\">\"stylesheet\"<\/span> <span class=\"atn\">type<\/span><span class=\"pun\">=<\/span><span class=\"atv\">\"text\/css\"<\/span> <span class=\"atn\">href<\/span><span class=\"pun\">=<\/span><span class=\"atv\">\"small.css\"<\/span><span class=\"tag\">\/&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;\/noscript&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;script&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; <\/span><span class=\"kwd\">var<\/span><span class=\"pln\"> loadDeferredStyles <\/span><span class=\"pun\">=<\/span> <span class=\"kwd\">function<\/span><span class=\"pun\">()<\/span> <span class=\"pun\">{<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; &nbsp; <\/span><span class=\"kwd\">var<\/span><span class=\"pln\"> addStylesNode <\/span><span class=\"pun\">=<\/span><span class=\"pln\"> document<\/span><span class=\"pun\">.<\/span><span class=\"pln\">getElementById<\/span><span class=\"pun\">(<\/span><span class=\"str\">\"deferred-styles\"<\/span><span class=\"pun\">);<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; &nbsp; <\/span><span class=\"kwd\">var<\/span><span class=\"pln\"> replacement <\/span><span class=\"pun\">=<\/span><span class=\"pln\"> document<\/span><span class=\"pun\">.<\/span><span class=\"pln\">createElement<\/span><span class=\"pun\">(<\/span><span class=\"str\">\"div\"<\/span><span class=\"pun\">);<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; &nbsp; replacement<\/span><span class=\"pun\">.<\/span><span class=\"pln\">innerHTML <\/span><span class=\"pun\">=<\/span><span class=\"pln\"> addStylesNode<\/span><span class=\"pun\">.<\/span><span class=\"pln\">textContent<\/span><span class=\"pun\">;<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; &nbsp; document<\/span><span class=\"pun\">.<\/span><span class=\"pln\">body<\/span><span class=\"pun\">.<\/span><span class=\"pln\">appendChild<\/span><span class=\"pun\">(<\/span><span class=\"pln\">replacement<\/span><span class=\"pun\">)<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; &nbsp; addStylesNode<\/span><span class=\"pun\">.<\/span><span class=\"pln\">parentElement<\/span><span class=\"pun\">.<\/span><span class=\"pln\">removeChild<\/span><span class=\"pun\">(<\/span><span class=\"pln\">addStylesNode<\/span><span class=\"pun\">);<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; <\/span><span class=\"pun\">};<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; <\/span><span class=\"kwd\">var<\/span><span class=\"pln\"> raf <\/span><span class=\"pun\">=<\/span><span class=\"pln\"> requestAnimationFrame <\/span><span class=\"pun\">||<\/span><span class=\"pln\"> mozRequestAnimationFrame <\/span><span class=\"pun\">||<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; webkitRequestAnimationFrame <\/span><span class=\"pun\">||<\/span><span class=\"pln\"> msRequestAnimationFrame<\/span><span class=\"pun\">;<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; <\/span><span class=\"kwd\">if<\/span> <span class=\"pun\">(<\/span><span class=\"pln\">raf<\/span><span class=\"pun\">)<\/span><span class=\"pln\"> raf<\/span><span class=\"pun\">(<\/span><span class=\"kwd\">function<\/span><span class=\"pun\">()<\/span> <span class=\"pun\">{<\/span><span class=\"pln\"> window<\/span><span class=\"pun\">.<\/span><span class=\"pln\">setTimeout<\/span><span class=\"pun\">(<\/span><span class=\"pln\">loadDeferredStyles<\/span><span class=\"pun\">,<\/span> <span class=\"lit\">0<\/span><span class=\"pun\">);<\/span> <span class=\"pun\">});<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; <\/span><span class=\"kwd\">else<\/span><span class=\"pln\"> window<\/span><span class=\"pun\">.<\/span><span class=\"pln\">addEventListener<\/span><span class=\"pun\">(<\/span><span class=\"str\">'load'<\/span><span class=\"pun\">,<\/span><span class=\"pln\"> loadDeferredStyles<\/span><span class=\"pun\">);<\/span><span class=\"pln\">\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;\/script&gt;<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"tag\">&lt;\/body&gt;<\/span>\n<span class=\"tag\">&lt;\/html&gt;<\/span><\/pre>\n\n\n\n<p>B\u1ea1n c\u00f3 th\u1ec3 th\u1ea5y vi\u1ec7c chuy\u1ec3n \u0111\u1ed5i n\u00e0y bao g\u1ed3m vi\u1ec7c x\u00e1c \u0111\u1ecbnh n\u1ed9i dung CSS n\u00e0o quan tr\u1ecdng (<em>critical<\/em>) \/ kh\u00f4ng quan tr\u1ecdng (<em>non-critical<\/em>). R\u1ed3i sau \u0111\u00f3 \u0111\u1eb7t n\u1ed9i tuy\u1ebfn CSS quan tr\u1ecdng v\u00e0 tr\u00ec ho\u00e3n t\u1ea3i c\u00e1c file CSS kh\u00f4ng quan tr\u1ecdng. Ph\u01b0\u01a1ng ph\u00e1p n\u00e0y c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c l\u00e0m t\u1ef1 \u0111\u1ed9ng b\u1eb1ng <a href=\"https:\/\/developers.google.com\/speed\/pagespeed\/module\/\" target=\"_blank\" rel=\"noreferrer noopener\">modules PageSpeed Optimization<\/a> cho nginx, apache, IIS, ATS, v\u00e0 Open Lightspeed, khi b\u1ea1n b\u1eadt b\u1ed9 l\u1ecdc (<em>filter<\/em>) prioritize_critical_css (\u01b0u ti\u00ean c\u00e1c CSS quan tr\u1ecdng &#8211; hay t\u1ed5ng quan h\u01a1n \u0111\u01b0\u1ee3c g\u1ecdi l\u00e0 <a href=\"https:\/\/kiencang.net\/duong-dan-hien-thi-trang-quan-trong\/\" target=\"_blank\" rel=\"noreferrer noopener\">tuy\u1ebfn hi\u1ec3n th\u1ecb quan tr\u1ecdng<\/a>).<\/p>\n\n\n\n<p>Xem th\u00eam h\u00e0m <a href=\"https:\/\/github.com\/filamentgroup\/loadCSS\/blob\/master\/README.md\" target=\"_blank\" rel=\"noreferrer noopener\">loadCSS<\/a> \u0111\u1ec3 gi\u00fap b\u1ea1n t\u1ea3i CSS kh\u00f4ng \u0111\u1ed3ng b\u1ed9, n\u00f3 c\u00f3 th\u1ec3 l\u00e0m vi\u1ec7c v\u1edbi <a href=\"https:\/\/github.com\/addyosmani\/critical\/blob\/master\/README.md\" target=\"_blank\" rel=\"noreferrer noopener\">Critical<\/a>, m\u1ed9t c\u00f4ng c\u1ee5 cho ph\u00e9p xu\u1ea5t ra file CSS quan tr\u1ecdng t\u1eeb trang web.<\/p>\n\n\n\n<p>C\u00e1c \u0111\u1ecbnh ki\u1ec3u quan tr\u1ecdng c\u1ea7n cho vi\u1ec7c \u0111\u1ecbnh ki\u1ec3u n\u1ed9i dung ph\u1ea7n \u0111\u1ea7u n\u00ean \u0111\u01b0\u1ee3c \u0111\u01b0a n\u1ed9i tuy\u1ebfn v\u00e0 \u00e1p d\u1ee5ng l\u00ean t\u00e0i li\u1ec7u ngay l\u1eadp t\u1ee9c (<em>immediately<\/em>). B\u1ea3n \u0111\u1ea7y \u0111\u1ee7 c\u1ee7a small.css s\u1ebd \u0111\u01b0\u1ee3c t\u1ea3i sau khi hi\u1ec3n th\u1ecb xong ph\u1ea7n \u0111\u1ea7u c\u1ee7a trang. Style c\u1ee7a n\u00f3 \u0111\u01b0\u1ee3c \u00e1p d\u1ee5ng l\u00ean trang m\u1ed9t khi n\u00f3 \u0111\u01b0\u1ee3c t\u1ea3i xong, v\u00e0 kh\u00f4ng ch\u1eb7n render c\u1ee7a ph\u1ea7n n\u1ed9i dung quan tr\u1ecdng (<em>critical content<\/em>).<\/p>\n\n\n\n<p>L\u01b0u \u00fd l\u00e0 c\u00e1c n\u1ec1n t\u1ea3ng web s\u1ebd s\u1edbm h\u1ed7 tr\u1ee3 t\u1ea3i stylesheets theo c\u00e1ch th\u1ee9c (<em>manner<\/em>) kh\u00f4ng-ch\u1eb7n-hi\u1ec3n-th\u1ecb, v\u00e0 kh\u00f4ng ph\u1ea3i nh\u1edd \u0111\u1ebfn (<em>resort<\/em>) vi\u1ec7c d\u00f9ng JavaScript n\u1eefa, s\u1eed d\u1ee5ng <a href=\"http:\/\/w3c.github.io\/webcomponents\/spec\/imports\/#link-type-import\" target=\"_blank\" rel=\"noreferrer noopener\">HTML Imports<\/a>.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u0110\u1eebng \u0111\u1eb7t n\u1ed9i d\u00f2ng l\u01b0\u1ee3ng l\u1edbn d\u1eef li\u1ec7u URIs<\/h3>\n\n\n\n<p>H\u00e3y c\u1ea9n th\u1eadn khi \u0111\u1eb7t n\u1ed9i d\u00f2ng d\u1eef li\u1ec7u URIs trong file CSS. Trong khi l\u1ef1a ch\u1ecdn s\u1eed d\u1ee5ng d\u1eef li\u1ec7u nh\u1ecf URIs trong CSS c\u1ee7a b\u1ea1n c\u00f3 th\u1ec3 c\u00f3 \u00fd ngh\u0129a, \u0111\u1eb7t n\u1ed9i d\u00f2ng l\u01b0\u1ee3ng l\u1edbn d\u1eef li\u1ec7u URIs c\u00f3 th\u1ec3 l\u00e0 nguy\u00ean nh\u00e2n l\u00e0m dung l\u01b0\u1ee3ng c\u1ee7a CSS ph\u1ea7n \u0111\u1ea7u trang l\u1edbn th\u00eam, c\u00e1i s\u1ebd l\u00e0m ch\u1eadm th\u1eddi gian render trang.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u0110\u1eebng \u0111\u1eb7t thu\u1ed9c t\u00ednh CSS trong d\u00f2ng<\/h3>\n\n\n\n<p>\u0110\u1eb7t thu\u1ed9c t\u00ednh CSS trong d\u00f2ng tr\u00ean c\u00e1c ph\u1ea7n t\u1eed HTML (th\u00ed d\u1ee5: &lt;p style=&#8221;&#8230;&#8221;>) ph\u1ea3i tr\u00e1nh khi c\u00f3 th\u1ec3 (<em>should be avoided where possible<\/em>), b\u1edfi n\u00f3 th\u01b0\u1eddng d\u1eabn \u0111\u1ebfn c\u00e1c \u0111o\u1ea1n m\u00e3 l\u1eb7p l\u1ea1i kh\u00f4ng c\u1ea7n thi\u1ebft. Th\u00eam n\u1eefa, CSS trong d\u00f2ng tr\u00ean ph\u1ea7n t\u1eed HTML \u0111\u00e3 b\u1ecb ch\u1eb7n theo m\u1eb7c \u0111\u1ecbnh v\u1edbi <a href=\"http:\/\/www.w3.org\/TR\/CSP\/\" target=\"_blank\" rel=\"noreferrer noopener\">Ch\u00ednh s\u00e1ch B\u1ea3o m\u1eadt N\u1ed9i dung<\/a> (CSP).<\/p>\n\n\n\n<p><strong>Kinh nghi\u1ec7m c\u00e1 nh\u00e2n v\u1edbi WordPress: <\/strong>Ph\u01b0\u01a1ng ph\u00e1p tr\u00ean r\u00f5 r\u00e0ng kh\u00f4ng d\u00e0nh cho d\u00e2n kh\u00f4ng chuy\u00ean v\u1edbi vi\u1ec7c ph\u1ea3i x\u00e1c \u0111\u1ecbnh style quan tr\u1ecdng, r\u1ed3i ph\u1ea3i t\u00e1ch m\u00e3 CSS ra l\u00e0m hai ph\u1ea7n \u0111\u1ec3 t\u1ed1i \u01b0u. Hy v\u1ecdng c\u00e1c tr\u00ecnh duy\u1ec7t s\u1edbm \u0111\u01b0a v\u00e0o t\u00ednh n\u0103ng m\u00e0 n\u00f3 v\u1eeba khoe: <em>non-render-blocking<\/em> \u0111\u1ec3 vi\u1ec7c t\u1ed1i \u01b0u n\u00e0y th\u00e0nh m\u1eb7c \u0111\u1ecbnh.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"8_Uu_tien_noi_dung_hien_thi\"><\/span><span style=\"background-color: #ffff00;\">8. \u01afu ti\u00ean n\u1ed9i dung hi\u1ec3n th\u1ecb<\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Quy t\u1eafc n\u00e0y \u0111\u01b0\u1ee3c k\u00edch ho\u1ea1t khi PageSpeed Insight ph\u00e1t hi\u1ec7n th\u1ea5y c\u00f3 th\u00eam c\u00e1c v\u00f2ng l\u1eb7p y\u00eau c\u1ea7u trong qu\u00e1 tr\u00ecnh hi\u1ec3n th\u1ecb ph\u1ea7n n\u1ed9i dung thu\u1ed9c m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean (<em>above the fold content<\/em>) c\u1ee7a trang.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">T\u1ed5ng quan<\/h3>\n\n\n\n<p>N\u1ebfu dung l\u01b0\u1ee3ng d\u1eef li\u1ec7u y\u00eau c\u1ea7u v\u01b0\u1ee3t qu\u00e1 (<em>exceeds<\/em>) ng\u01b0\u1ee1ng ngh\u1ebdn ban \u0111\u1ea7u (th\u00f4ng th\u01b0\u1eddng l\u00e0 14,6KB \u0111\u00e3 n\u00e9n), n\u00f3 s\u1ebd y\u00eau c\u1ea7u th\u00eam v\u00f2ng l\u1eb7p gi\u1eefa m\u00e1y ch\u1ee7 v\u00e0 tr\u00ecnh duy\u1ec7t c\u1ee7a ng\u01b0\u1eddi d\u00f9ng. V\u1edbi ng\u01b0\u1eddi d\u00f9ng tr\u00ean m\u1ea1ng c\u00f3 \u0111\u1ed9 tr\u1ec5 cao (<em>high latencies<\/em>) nh\u01b0 m\u1ea1ng \u0111i\u1ec7n tho\u1ea1i, \u0111i\u1ec1u n\u00e0y c\u00f3 th\u1ec3 l\u00e0 nguy\u00ean nh\u00e2n g\u00e2y \u1ea3nh h\u01b0\u1edfng \u0111\u00e1ng k\u1ec3 \u0111\u1ebfn \u0111\u1ed9 tr\u1ec5 c\u1ee7a vi\u1ec7c t\u1ea3i trang.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">L\u1eddi Khuy\u00ean<\/h3>\n\n\n\n<p>\u0110\u1ec3 trang t\u1ea3i nhanh h\u01a1n, c\u1ea7n gi\u1edbi h\u1ea1n dung l\u01b0\u1ee3ng d\u1eef li\u1ec7u (m\u00e3 \u0111\u00e1nh d\u1ea5u HTML, c\u00e1c h\u00ecnh \u1ea3nh, CSS, JavaScript) c\u1ea7n thi\u1ebft \u0111\u1ec3 render ph\u1ea7n n\u1ed9i dung \u0111\u1ea7u c\u1ee7a trang. C\u00f3 m\u1ed9t s\u1ed1 c\u00e1ch \u0111\u1ec3 l\u00e0m \u0111i\u1ec1u \u0111\u00f3:<\/p>\n\n\n\n<ul><li>C\u1ea5u tr\u00fac HTML \u0111\u1ec3 t\u1ea3i n\u1ed9i dung quan tr\u1ecdng, \u1edf ph\u1ea7n \u0111\u1ea7u tr\u01b0\u1edbc<\/li><li>Gi\u1ea3m dung l\u01b0\u1ee3ng d\u1eef li\u1ec7u s\u1eed d\u1ee5ng<\/li><\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">C\u1ea5u tr\u00fac HTML \u0111\u1ec3 t\u1ea3i n\u1ed9i dung quan tr\u1ecdng, \u1edf ph\u1ea7n \u0111\u1ea7u tr\u01b0\u1edbc<\/h3>\n\n\n\n<p>T\u1ea3i ph\u1ea7n n\u1ed9i dung ch\u00ednh (<em>main content<\/em>) trang c\u1ee7a b\u1ea1n tr\u01b0\u1edbc. C\u1ea5u tr\u00fac trang c\u1ee7a b\u1ea1n \u0111\u1ec3 c\u00e1c ph\u1ea3n h\u1ed3i \u0111\u1ea7u ti\u00ean (<em>initial response<\/em>) t\u1eeb m\u00e1y ch\u1ee7 g\u1eedi d\u1eef li\u1ec7u c\u1ea7n thi\u1ebft \u0111\u1ec3 render ph\u1ea7n quan tr\u1ecdng c\u1ee7a trang ngay l\u1eadp t\u1ee9c v\u00e0 tr\u00ec ho\u00e3n ph\u1ea7n c\u00f2n l\u1ea1i (<em>defer the rest<\/em>). \u0110i\u1ec1u n\u00e0y c\u00f3 ngh\u0129a l\u00e0 b\u1ea1n ph\u1ea3i chia CSS c\u1ee7a b\u1ea1n th\u00e0nh hai ph\u1ea7n: ph\u1ea7n inline \u0111\u1ec3 ph\u1ea3n h\u1ed3i l\u1ea1i \u0111\u1ecbnh d\u1ea1ng cho ph\u1ea7n ATF (vi\u1ebft t\u1eaft c\u1ee7a Above The Fold) c\u1ee7a n\u1ed9i dung (c\u00f2n \u0111\u01b0\u1ee3c g\u1ecdi l\u00e0 <a href=\"https:\/\/kiencang.net\/critical-css-wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\">critical CSS<\/a>), v\u00e0 ph\u1ea7n c\u00f2n l\u1ea1i c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c tr\u00ec ho\u00e3n.<\/p>\n\n\n\n<p>Xem x\u00e9t c\u00e1c v\u00ed d\u1ee5 sau v\u1ec1 c\u00e1ch trang c\u1ee7a b\u1ea1n c\u00f3 th\u1ec3 c\u1ea5u tr\u00fac l\u1ea1i (<em>restructured<\/em>) \u0111\u1ec3 t\u1ea3i nhanh h\u01a1n:<\/p>\n\n\n\n<ul><li>N\u1ebfu trang HTML t\u1ea3i widget c\u1ee7a b\u00ean th\u1ee9 ba tr\u01b0\u1edbc khi t\u1ea3i n\u1ed9i dung ch\u00ednh, h\u00e3y thay \u0111\u1ed5i th\u1ee9 t\u1ef1 \u0111\u1ec3 n\u00f3 t\u1ea3i n\u1ed9i dung ch\u00ednh tr\u01b0\u1edbc.<\/li><li>N\u1ebfu trang c\u1ee7a b\u1ea1n s\u1eed d\u1ee5ng thi\u1ebft k\u1ebf hai c\u1ed9t (<em>two-column design<\/em>) v\u1edbi sidebar \u0111i\u1ec1u h\u01b0\u1edbng (<em>sidebar navigation<\/em>) v\u00e0 b\u00e0i vi\u1ebft, nh\u01b0ng trang HTML c\u1ee7a b\u1ea1n t\u1ea3i sidebar tr\u01b0\u1edbc b\u00e0i vi\u1ebft, h\u00e3y xem x\u00e9t vi\u1ec7c t\u1ea3i n\u1ed9i dung b\u00e0i vi\u1ebft tr\u01b0\u1edbc.<\/li><\/ul>\n\n\n\n<h3 class=\"wp-block-heading\">Gi\u1ea3m dung l\u01b0\u1ee3ng d\u1eef li\u1ec7u s\u1eed d\u1ee5ng<\/h3>\n\n\n\n<p>M\u1ed9t khi trang c\u1ee7a b\u1ea1n \u0111\u01b0\u1ee3c thi\u1ebft k\u1ebf l\u1ea1i \u0111\u1ec3 ho\u1ea1t \u0111\u1ed9ng t\u1ed1t tr\u00ean nhi\u1ec1u thi\u1ebft b\u1ecb kh\u00e1c nhau v\u00e0 \u01b0u ti\u00ean t\u1ea3i n\u1ed9i dung quan tr\u1ecdng tr\u01b0\u1edbc, s\u1eed d\u1ee5ng c\u00e1c k\u1ef9 thu\u1eadt b\u00ean d\u01b0\u1edbi \u0111\u1ec3 gi\u1ea3m l\u01b0\u1ee3ng d\u1eef li\u1ec7u y\u00eau c\u1ea7u cho vi\u1ec7c render trang c\u1ee7a b\u1ea1n:<\/p>\n\n\n\n<ul><li>Gi\u1ea3m thi\u1ec3u ngu\u1ed3n: HTML, CSS, v\u00e0 JavaScript c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c gi\u1ea3m thi\u1ec3u b\u1eb1ng c\u00e1ch lo\u1ea1i b\u1ecf c\u00e1c kho\u1ea3ng tr\u1eafng (<em>whitespace<\/em>) v\u00e0 comments kh\u00f4ng c\u1ea7n thi\u1ebft (<em>unnecessary<\/em>). K\u1ef9 thu\u1eadt t\u1ed1i \u01b0u h\u00f3a gia t\u0103ng c\u00f2n c\u00f3 th\u1ec3 \u00e1p d\u1ee5ng th\u00f4ng qua vi\u1ec7c d\u00f9ng c\u00e1c c\u00f4ng c\u1ee5 \u0111\u1ec3 thay \u0111\u1ed5i t\u00ean bi\u1ebfn trong m\u00e3 ngu\u1ed3n c\u1ee7a b\u1ea1n. (<em>\u0111\u00e3 n\u00f3i \u1edf ph\u1ea7n 5<\/em>)<\/li><li>Xem x\u00e9t vi\u1ec7c <a href=\"https:\/\/www.google.com\/search?q=css+instead+of+images\" target=\"_blank\" rel=\"noreferrer noopener\">s\u1eed d\u1ee5ng CSS \u0111\u1ec3 thay th\u1ebf h\u00ecnh \u1ea3nh<\/a> khi c\u00f3 th\u1ec3.<\/li><li>B\u1eadt n\u00e9n. (<em>\u0111\u00e3 n\u00f3i \u1edf ph\u1ea7n 2<\/em>)<\/li><\/ul>\n\n\n\n<p><strong>Kinh nghi\u1ec7m c\u00e1 nh\u00e2n v\u1edbi WordPress:\u00a0<\/strong>C\u00f3 th\u1ec3 th\u1ea5y th\u00f4ng tin tr\u00ean r\u1ea5t quan tr\u1ecdng cho ng\u01b0\u1eddi thi\u1ebft k\u1ebf giao di\u1ec7n. Ngay t\u1eeb \u0111\u1ea7u h\u1ecd ph\u1ea3i ch\u00fa \u00fd sao cho n\u1ed9i dung ph\u1ea7n \u0111\u1ea7u t\u1ea3i tr\u01b0\u1edbc v\u00e0 kh\u00f4ng ph\u1ea3i s\u1eed d\u1ee5ng qu\u00e1 nhi\u1ec1u d\u1eef li\u1ec7u. N\u1ebfu \u1ee9ng sang WordPress, t\u00f4i ch\u1ec9 c\u00f3 l\u1eddi khuy\u00ean duy nh\u1ea5t l\u00e0 b\u1ea1n n\u00ean ch\u1ecdn theme \u0111\u01a1n gi\u1ea3n \u0111\u1ee7 d\u00f9ng, th\u1eed th\u1ea5y nhanh nh\u1eb9 l\u00e0 \u1ed5n (h\u00e3y th\u1eed theme Astra: <a href=\"https:\/\/wordpress.org\/themes\/astra\/\" target=\"_blank\" rel=\"noreferrer noopener\">https:\/\/wordpress.org\/themes\/astra\/<\/a>). V\u1edbi critical CSS t\u00f4i th\u01b0\u1eddng s\u1eed d\u1ee5ng plugin Autoptimize \u0111\u1ec3 th\u1ef1c hi\u1ec7n t\u1ed1i \u01b0u.<\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"9_Loai_bo_JavaScript_chan_hien_thi\"><\/span><span style=\"background-color: #ffff00;\">9. Lo\u1ea1i b\u1ecf JavaScript ch\u1eb7n hi\u1ec3n th\u1ecb<\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Quy t\u1eafc n\u00e0y k\u00edch ho\u1ea1t khi PageSpeed Insights ph\u00e1t hi\u1ec7n trang HTML c\u1ee7a b\u1ea1n tham chi\u1ebfu \u0111\u1ebfn file JavaScript b\u00ean ngo\u00e0i ch\u1eb7n hi\u1ec3n th\u1ecb n\u1ed9i dung \u0111\u1ea7u trang (<a href=\"https:\/\/kiencang.net\/uu-tien-noi-dung-hien-thi\/\" target=\"_blank\" rel=\"noreferrer noopener\">n\u1ed9i dung n\u1eb1m trong m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean<\/a>).<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">T\u1ed5ng quan<\/h3>\n\n\n\n<p>Tr\u01b0\u1edbc khi tr\u00ecnh duy\u1ec7t c\u00f3 th\u1ec3 hi\u1ec3n th\u1ecb trang n\u00f3 x\u00e2y d\u1ef1ng c\u00e2y DOM b\u1eb1ng c\u00e1ch ph\u00e2n t\u00edch (<em>parsing<\/em>) m\u00e3 \u0111\u00e1nh d\u1ea5u HTML. Trong su\u1ed1t qu\u00e1 tr\u00ecnh n\u00e0y, b\u1ea5t c\u1ee9 khi n\u00e0o tr\u00ecnh x\u1eed l\u00fd (<em>parser<\/em>) b\u1eaft g\u1eb7p script, n\u00f3 ph\u1ea3i d\u1eebng l\u1ea1i v\u00e0 th\u1ef1c thi n\u00f3 tr\u01b0\u1edbc khi c\u00f3 th\u1ec3 ti\u1ebfp t\u1ee5c x\u1eed l\u00fd v\u1edbi HTML. Trong tr\u01b0\u1eddng h\u1ee3p m\u00e3 script ngo\u00e0i, tr\u00ecnh x\u1eed l\u00fd bu\u1ed9c ph\u1ea3i ch\u1edd ngu\u1ed3n t\u1ea3i xong, \u0111i\u1ec1u n\u00e0y c\u00f3 th\u1ec3 t\u1ea1o th\u00eam m\u1ed9t ho\u1eb7c nhi\u1ec1u truy v\u1ea5n l\u1eb7p v\u00e0 tr\u00ec ho\u00e3n th\u1eddi gian hi\u1ec3n th\u1ecb ph\u1ea7n \u0111\u1ea7u trang. Xem <a href=\"https:\/\/developers.google.com\/web\/fundamentals\/performance\/critical-rendering-path\/adding-interactivity-with-javascript\" target=\"_blank\" rel=\"noreferrer noopener\">Th\u00eam t\u01b0\u01a1ng t\u00e1c v\u1edbi JavaScript<\/a> \u0111\u1ec3 hi\u1ec3u h\u01a1n c\u00e1ch JavaScript \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn hi\u1ec3n th\u1ecb nh\u01b0 th\u1ebf n\u00e0o.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">L\u1eddi khuy\u00ean<\/h3>\n\n\n\n<p>B\u1ea1n c\u1ea7n ph\u1ea3i tr\u00e1nh v\u00e0 t\u1ed1i thi\u1ec3u h\u00f3a vi\u1ec7c s\u1eed d\u1ee5ng <a href=\"https:\/\/kiencang.net\/javascript-chan-hien-thi\/\" target=\"_blank\" rel=\"noreferrer noopener\">JavaScript ch\u1eb7n hi\u1ec3n th\u1ecb<\/a>, \u0111\u1eb7c bi\u1ec7t l\u00e0 c\u00e1c script ngo\u1ea1i tuy\u1ebfn b\u1eaft bu\u1ed9c ph\u1ea3i t\u1ea3i (<em>fetched<\/em>) tr\u01b0\u1edbc khi \u0111\u01b0\u1ee3c th\u1ef1c thi (<em>executed<\/em>). Script c\u1ea7n thi\u1ebft \u0111\u1ec3 render n\u1ed9i dung trang c\u00f3 th\u1ec3 \u0111\u1eb7t n\u1ed9i tuy\u1ebfn \u0111\u1ec3 tr\u00e1nh gia t\u0103ng c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng, d\u1ea7u v\u1eady n\u1ed9i dung n\u1ed9i tuy\u1ebfn c\u1ea7n nh\u1ecf v\u00e0 ph\u1ea3i th\u1ef1c thi nhanh \u0111\u1ec3 c\u00f3 \u0111\u01b0\u1ee3c hi\u1ec7u n\u0103ng t\u1ed1t. Scripts kh\u00f4ng quan tr\u1ecdng \u0111\u1ec3 hi\u1ec3n th\u1ecb n\u1ed9i dung \u0111\u1ea7u trang n\u00ean t\u1ea3i kh\u00f4ng \u0111\u1ed3ng b\u1ed9 ho\u1eb7c tr\u00ec ho\u00e3n cho \u0111\u1ebfn khi n\u1ed9i dung \u0111\u1ea7u trang hi\u1ec3n th\u1ecb xong xu\u00f4i. N\u00ean nh\u1edb l\u00e0 \u0111\u1ec3 n\u00e2ng cao th\u1eddi gian t\u1ea3i, b\u1ea1n ph\u1ea3i th\u1ef1c hi\u1ec7n t\u1ed1i \u01b0u ph\u00e2n ph\u1ed1i CSS n\u1eefa.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">JavaScript n\u1ed9i tuy\u1ebfn<\/h3>\n\n\n\n<p>Script ngo\u00e0i ch\u1eb7n hi\u1ec3n th\u1ecb b\u1eaft bu\u1ed9c tr\u00ecnh duy\u1ec7t ph\u1ea3i \u0111\u1ee3i JavaScript t\u1ea3i xong, \u0111i\u1ec1u n\u00e0y s\u1ebd t\u1ea1o th\u00eam nhi\u1ec1u v\u00f2ng l\u1eb7p m\u1ea1ng tr\u01b0\u1edbc khi trang c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c hi\u1ec3n th\u1ecb. <a href=\"https:\/\/kiencang.net\/noi-tuyen-doan-ma-javascript-nho\/\" target=\"_blank\" rel=\"noreferrer noopener\">N\u1ebfu m\u00e3 script ngo\u00e0i l\u00e0 nh\u1ecf, b\u1ea1n c\u00f3 th\u1ec3 \u0111\u1eb7t n\u1ed9i tuy\u1ebfn<\/a> tr\u1ef1c ti\u1ebfp \u0111o\u1ea1n m\u00e3 trong t\u00e0i li\u1ec7u HTML v\u00e0 tr\u00e1nh \u0111\u01b0\u1ee3c \u0111\u1ed9 tr\u1ec5 c\u1ee7a vi\u1ec7c truy v\u1ea5n m\u1ea1ng (gi\u1ed1ng ki\u1ec3u v\u1edbi CSS). L\u1ea5y v\u00ed d\u1ee5, n\u1ebfu t\u00e0i li\u1ec7u HTML gi\u1ed1ng nh\u01b0 th\u1ebf n\u00e0y:<\/p>\n\n\n\n<pre class=\"wp-block-preformatted devsite-code-button-clone\"><span class=\"tag\">&lt;html&gt;<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"tag\">&lt;head&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;script<\/span> <span class=\"atn\">type<\/span><span class=\"pun\">=<\/span><span class=\"atv\">\"text\/javascript\"<\/span> <span class=\"atn\">src<\/span><span class=\"pun\">=<\/span><span class=\"atv\">\"small.js\"<\/span><span class=\"tag\">&gt;&lt;\/script&gt;<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"tag\">&lt;\/head&gt;<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"tag\">&lt;body&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;div&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; Hello, world!\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;\/div&gt;<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"tag\">&lt;\/body&gt;<\/span>\n<span class=\"tag\">&lt;\/html&gt;<\/span><\/pre>\n\n\n\n<p>V\u00e0 ngu\u1ed3n small.js gi\u1ed1ng nh\u01b0 n\u00e0y:<\/p>\n\n\n\n<pre class=\"wp-block-preformatted prettyprint\"><span class=\"pln\">&nbsp; <\/span><span class=\"com\">\/* m\u1ed9t \u0111o\u1ea1n m\u00e3 JavaScript nh\u1ecf *\/<\/span><\/pre>\n\n\n\n<p>Sau \u0111\u00f3 b\u1ea1n c\u00f3 th\u1ec3 \u0111\u1eb7t n\u1ed9i tuy\u1ebfn m\u00e3 nh\u01b0 sau:<\/p>\n\n\n\n<pre class=\"wp-block-preformatted devsite-code-button-clone\"><span class=\"tag\">&lt;html&gt;<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"tag\">&lt;head&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;script<\/span> <span class=\"atn\">type<\/span><span class=\"pun\">=<\/span><span class=\"atv\">\"text\/javascript\"<\/span><span class=\"tag\">&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; <\/span><span class=\"com\">\/* m\u1ed9t \u0111o\u1ea1n m\u00e3 JavaScript nh\u1ecf *\/<\/span><span class=\"pln\">\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;\/script&gt;<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"tag\">&lt;\/head&gt;<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"tag\">&lt;body&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;div&gt;<\/span><span class=\"pln\">\n&nbsp; &nbsp; &nbsp; Hello, world!\n&nbsp; &nbsp; <\/span><span class=\"tag\">&lt;\/div&gt;<\/span><span class=\"pln\">\n&nbsp; <\/span><span class=\"tag\">&lt;\/body&gt;<\/span>\n<span class=\"tag\">&lt;\/html&gt;<\/span><\/pre>\n\n\n\n<p>N\u1ed9i dung script n\u1ed9i tuy\u1ebfn gi\u00fap lo\u1ea1i b\u1ecf truy v\u1ea5n ngo\u00e0i \u0111\u1ebfn file small.js v\u00e0 cho ph\u00e9p tr\u00ecnh duy\u1ec7t ph\u00e2n ph\u1ed1i th\u1eddi gian nhanh h\u01a1n cho vi\u1ec7c hi\u1ec3n th\u1ecb n\u1ed9i dung \u0111\u1ea7u trang. D\u1ea7u v\u1eady, l\u01b0u \u00fd l\u00e0 n\u1ed9i tuy\u1ebfn c\u0169ng c\u00f3 th\u1ec3 l\u00e0m t\u0103ng k\u00edch c\u1ee1 t\u00e0i li\u1ec7u HTML v\u00e0 c\u00f9ng m\u1ed9t \u0111o\u1ea1n m\u00e3 c\u00f3 th\u1ec3 c\u1ea7n \u0111\u1eb7t n\u1ed9i tuy\u1ebfn qua nhi\u1ec1u trang. H\u1ec7 qu\u1ea3, b\u1ea1n ch\u1ec9 n\u00ean \u0111\u1eb7t n\u1ed9i tuy\u1ebfn script nh\u1ecf \u0111\u1ebf ph\u00e2n ph\u1ed1i hi\u1ec7u su\u1ea5t t\u1ed1i \u01b0u cho trang.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">L\u00e0m JavaScript t\u1ea3i kh\u00f4ng \u0111\u1ed3ng b\u1ed9<\/h3>\n\n\n\n<p>Theo m\u1eb7c \u0111\u1ecbnh JavaScript ng\u0103n ch\u1eb7n c\u1ea5u tr\u00fac DOM v\u00e0 v\u00ec v\u1eady tr\u00ec ho\u00e3n th\u1eddi gian hi\u1ec3n th\u1ecb l\u1ea7n \u0111\u1ea7u (<em>the time to first render<\/em>). \u0110\u1ec3 ng\u0103n JavaScript ch\u1eb7n tr\u00ecnh x\u1eed l\u00fd, ch\u00fang t\u00f4i khuy\u00ean b\u1ea1n s\u1eed d\u1ee5ng thu\u1ed9c t\u00ednh async (kh\u00f4ng \u0111\u1ed3ng b\u1ed9) trong HTML v\u1edbi c\u00e1c m\u00e3 script ngo\u00e0i (<em>external scripts<\/em>). L\u1ea5y th\u00ed d\u1ee5:<\/p>\n\n\n\n<p><em>&lt;script async src=&#8221;my.js&#8221;&gt;<\/em><\/p>\n\n\n\n<p>Xem th\u00eam <a href=\"https:\/\/developers.google.com\/web\/fundamentals\/performance\/critical-rendering-path\/adding-interactivity-with-javascript#parser-blocking-vs-asynchronous-javascript\" target=\"_blank\" rel=\"noreferrer noopener\">Ch\u1eb7n tr\u00ecnh x\u1eed l\u00fd v\u00e0 JavaScript kh\u00f4ng \u0111\u1ed3ng b\u1ed9<\/a> \u0111\u1ec3 hi\u1ec3u th\u00eam v\u1ec1 script kh\u00f4ng \u0111\u1ed3ng b\u1ed9. L\u01b0u \u00fd l\u00e0 m\u00e3 kh\u00f4ng \u0111\u1ed3ng b\u1ed9 kh\u00f4ng \u0111\u1ea3m b\u1ea3o (<em>guaranteed<\/em>) th\u1ef1c hi\u1ec7n theo th\u1ee9 t\u1ef1 ch\u1ec9 \u0111\u1ecbnh v\u00e0 kh\u00f4ng n\u00ean s\u1eed d\u1ee5ng document.write. M\u00e3 script ph\u1ee5 thu\u1ed9c v\u00e0o th\u1ee9 t\u1ef1 th\u1ef1c thi (<em>execution order<\/em>) ho\u1eb7c c\u1ea7n truy c\u1eadp ho\u1eb7c thay \u0111\u1ed5i (<em>access or modify<\/em>) DOM ho\u1eb7c CSSDOM c\u1ee7a trang c\u00f3 th\u1ec3 c\u1ea7n vi\u1ebft l\u1ea1i (<em>rewritten<\/em>) \u0111\u1ec3 kh\u1eafc ph\u1ee5c c\u00e1c kh\u00f3 kh\u0103n n\u00e0y.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Tr\u00ec ho\u00e3n vi\u1ec7c t\u1ea3i JavaScript<\/h3>\n\n\n\n<p>Vi\u1ec7c t\u1ea3i v\u00e0 th\u1ef1c thi m\u00e3 script kh\u00f4ng c\u1ea7n thi\u1ebft cho vi\u1ec7c hi\u1ec3n th\u1ecb n\u1ed9i dung \u0111\u1ea7u trang (<em>initial page render\/t\u1ee9c l\u00e0 trang n\u1eb1m trong m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean<\/em>) c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c ho\u00e3n l\u1ea1i cho \u0111\u1ebfn khi trang ban \u0111\u1ea7u \u0111\u01b0\u1ee3c hi\u1ec3n th\u1ecb ho\u1eb7c c\u00e1c ph\u1ea7n quan tr\u1ecdng kh\u00e1c (<em>other critical parts<\/em>) c\u1ee7a trang \u0111\u01b0\u1ee3c t\u1ea3i xong. L\u00e0m th\u1ebf gi\u00fap gi\u1ea3m tranh ch\u1ea5p t\u00e0i nguy\u00ean (<em>reduce resource contention<\/em>) v\u00e0 c\u1ea3i thi\u1ec7n hi\u1ec7u su\u1ea5t (<em>improve performance<\/em>).<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">C\u00e1c c\u00e2u h\u1ecfi th\u01b0\u1eddng g\u1eb7p (FAQ)<\/h3>\n\n\n\n<p><strong>N\u1ebfu t\u00f4i s\u1eed d\u1ee5ng th\u01b0 vi\u1ec7n JavaScript nh\u01b0 jQuery th\u00ec sao?<\/strong><\/p>\n\n\n\n<p>Nhi\u1ec1u th\u01b0 vi\u1ec7n JavaScript nh\u01b0 jQuery, \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng \u0111\u1ec3 c\u1ea3i ti\u1ebfn trang v\u1edbi vi\u1ec7c th\u00eam t\u01b0\u01a1ng t\u00e1c, h\u00ecnh \u0111\u1ed9ng, v\u00e0 c\u00e1c hi\u1ec7u \u1ee9ng kh\u00e1c. D\u1ea7u v\u1eady, nhi\u1ec1u h\u00e0nh vi c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c th\u00eam v\u00e0o an to\u00e0n sau khi n\u1ed9i dung \u0111\u1ea7u trang \u0111\u01b0\u1ee3c hi\u1ec3n th\u1ecb \u0111\u1ea7y \u0111\u1ee7. B\u1ea1n n\u00ean th\u1eed nghi\u1ec7m (<em>investigate<\/em>) v\u1edbi c\u1ea3 t\u1ea3i kh\u00f4ng \u0111\u1ed3ng b\u1ed9 ho\u1eb7c tr\u00ec ho\u00e3n t\u1ea3i \u0111\u1ec3 xem c\u00f3 v\u1ea5n \u0111\u1ec1 g\u00ec x\u1ea3y ra hay kh\u00f4ng.<\/p>\n\n\n\n<p><strong>N\u1ebfu t\u00f4i s\u1eed d\u1ee5ng JavaScript framework \u0111\u1ec3 x\u00e2y d\u1ef1ng trang?<\/strong><\/p>\n\n\n\n<p>N\u1ebfu n\u1ed9i dung c\u1ee7a trang \u0111\u01b0\u1ee3c x\u00e2y d\u1ef1ng b\u1edfi JavaScript ph\u00eda m\u00e1y kh\u00e1ch, b\u1ea1n ph\u1ea3i xem x\u00e9t \u0111\u1eb7t n\u1ed9i tuy\u1ebfn c\u00e1c module JavaScript th\u00edch h\u1ee3p \u0111\u1ec3 tr\u00e1nh gia t\u0103ng v\u00f2ng l\u1eb7p m\u1ea1ng (<em>extra network roundtrips<\/em>). T\u01b0\u01a1ng t\u1ef1 nh\u01b0 v\u1eady, t\u1eadn d\u1ee5ng s\u1eed d\u1ee5ng render ph\u00eda m\u00e1y ch\u1ee7 c\u00f3 th\u1ec3 t\u00e1c \u0111\u1ed9ng \u0111\u00e1ng k\u1ec3 \u0111\u1ebfn hi\u1ec7u su\u1ea5t t\u1ea3i trang l\u1ea7n \u0111\u1ea7u: render JavaScript templates tr\u00ean m\u00e1y ch\u1ee7 \u0111\u1ec3 ph\u00e2n ph\u1ed1i render l\u1ea7n \u0111\u1ea7u nhanh h\u01a1n, v\u00e0 sau \u0111\u00f3 s\u1eed d\u1ee5ng templating ph\u00eda m\u00e1y kh\u00e1ch m\u1ed9t khi trang \u0111\u01b0\u1ee3c t\u1ea3i xong. \u0110\u1ec3 c\u00f3 th\u00eam th\u00f4ng tin v\u1ec1 vi\u1ec7c rendering ph\u00eda m\u00e1y ch\u1ee7 (<em>server-side rendering<\/em>), xem video n\u00e0y:\u00a0<a href=\"http:\/\/youtu.be\/VKTWdaupft0?t=14m28s\" target=\"_blank\" rel=\"noreferrer noopener\">http:\/\/youtu.be\/VKTWdaupft0?t=14m28s<\/a><\/p>\n\n\n\n<p><strong>Kinh nghi\u1ec7m c\u00e1 nh\u00e2n v\u1edbi WordPress:&nbsp;<\/strong>\u0110\u1ebfn tr\u01b0\u1edbc khi t\u00f4i s\u1eed d\u1ee5ng PageSpeed Insights \u0111\u1ec3 nh\u1eadn c\u00e1c l\u1eddi khuy\u00ean v\u1ec1 c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 th\u00ec t\u00f4i ch\u01b0a bao gi\u1edd \u0111\u1ec3 \u00fd \u0111\u1ebfn vi\u1ec7c s\u1eed d\u1ee5ng JavaScript kh\u00f4ng \u0111\u1ed3ng b\u1ed9 c\u1ea3.<\/p>\n\n\n\n<p>X\u00e9t v\u1ec1 m\u1eb7t k\u1ef9 thu\u1eadt vi\u1ec7c \u0111i\u1ec1u ch\u1ec9nh th\u1ee7 c\u00f4ng \u0111\u1ec3 \u0111\u1ea1t chu\u1ea9n y\u00eau c\u1ea7u n\u00e0y kh\u00f4ng kh\u00f3 v\u00ec b\u1ea1n ch\u1ec9 c\u1ea7n th\u00eam thu\u1ed9c t\u00ednh v\u00e0o. C\u00e1c plugin \u0111\u1ec3 chuy\u1ec3n c\u00e1c \u0111o\u1ea1n m\u00e3 v\u1ec1 kh\u00f4ng \u0111\u1ed3ng b\u1ed9 c\u0169ng d\u1ec5 t\u00ecm \u0111\u01b0\u1ee3c, th\u00ed d\u1ee5 nh\u01b0\u00a0<a href=\"https:\/\/wordpress.org\/plugins\/async-javascript\/\" target=\"_blank\" rel=\"noreferrer noopener\">Async JavaScript<\/a>. V\u1ea5n \u0111\u1ec1 quan tr\u1ecdng l\u00e0 b\u1ea1n c\u1ea7n bi\u1ebft \u0111\u01b0\u1ee3c vi\u1ec7c chuy\u1ec3n nh\u01b0 v\u1eady \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn \u0111\u00e2u c\u00e1c ch\u1ee9c n\u0103ng c\u1ee7a trang? V\u00e0 \u0111i\u1ec1u ch\u1ec9nh l\u1ea1i v\u1ec1 tr\u1ea1ng th\u00e1i c\u0169 khi c\u1ea7n. Nhi\u1ec1u plugin cache c\u0169ng t\u00edch h\u1ee3p s\u1eb5n t\u00ednh n\u0103ng t\u1ea3i kh\u00f4ng \u0111\u1ed3ng b\u1ed9 n\u00e0y.<\/p>\n\n\n\n<p>Theo ch\u1ee7 trang Varvy th\u00ec t\u1ea3i kh\u00f4ng \u0111\u1ed3ng b\u1ed9 (Async) kh\u00f4ng t\u1ed1t b\u1eb1ng tr\u00ec ho\u00e3n t\u1ea3i: B\u1ea1n c\u00f3 th\u1ec3 tham kh\u1ea3o b\u00e0i vi\u1ebft v\u1ec1 v\u1ea5n \u0111\u1ec1 \u0111\u00f3 \u1edf \u0111\u00e2y:\u00a0<a href=\"https:\/\/kiencang.net\/tri-hoan-tai-javascript\/\" target=\"_blank\" rel=\"noreferrer noopener\">https:\/\/kiencang.net\/tri-hoan-tai-javascript\/<\/a><\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"10_Su_dung_ma_Script_khong_dong_bo\"><\/span><span style=\"background-color: #ffff00;\">10. S\u1eed d\u1ee5ng m\u00e3 Script kh\u00f4ng \u0111\u1ed3ng b\u1ed9<\/span><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p>Quy t\u1eafc n\u00e0y k\u00edch ho\u1ea1t khi PageSpeed Insights ph\u00e1t hi\u1ec7n b\u1ea1n s\u1eed d\u1ee5ng phi\u00ean b\u1ea3n \u0111\u1ed3ng b\u1ed9 cho c\u00e1c script (<em>k\u1ecbch b\u1ea3n<\/em>) thay v\u00ec s\u1eed d\u1ee5ng phi\u00ean b\u1ea3n kh\u00f4ng \u0111\u1ed3ng b\u1ed9.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">T\u1ed5ng quan<\/h3>\n\n\n\n<p>S\u1eed d\u1ee5ng m\u00e3 kh\u00f4ng \u0111\u1ed3ng b\u1ed9 \u0111\u1ed3ng ngh\u0129a v\u1edbi vi\u1ec7c trang c\u1ee7a b\u1ea1n c\u00f3 th\u1ec3 render nhanh h\u01a1n. Thay v\u00ec \u00e9p (<em>forcing<\/em>) ng\u01b0\u1eddi d\u00f9ng \u0111\u1ee3i script t\u1ea3i xong tr\u01b0\u1edbc khi trang \u0111\u01b0\u1ee3c render th\u00ec b\u1eb1ng c\u00e1ch tri\u1ec3n khai &#8220;m\u00e3 kh\u00f4ng \u0111\u1ed3ng b\u1ed9&#8221; script c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c t\u1ea3i d\u01b0\u1edbi n\u1ec1n.<\/p>\n\n\n\n<p>M\u1eb7c d\u00f9 h\u1ea7u h\u1ebft script m\u1eb7c \u0111\u1ecbnh ban \u0111\u1ea7u l\u00e0 \u0111\u1ed3ng b\u1ed9 (<em>synchronous<\/em>), c\u00e1c phi\u00ean b\u1ea3n m\u1edbi c\u1ee7a n\u00f3 \u0111\u01b0\u1ee3c thi\u1ebft k\u1ebf \u0111\u1ec3 t\u1ea3i kh\u00f4ng \u0111\u1ed3ng b\u1ed9 (<em>asynchronously<\/em>).<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">L\u1eddi khuy\u00ean<\/h3>\n\n\n\n<p>\u0110\u1ec3 ch\u1eafc ch\u1eafn b\u1ea1n s\u1eed d\u1ee5ng m\u00e3 k\u1ecbch b\u1ea3n (script) kh\u00f4ng \u0111\u1ed3ng b\u1ed9. C\u00e1c script ph\u1ed5 bi\u1ebfn d\u01b0\u1edbi \u0111\u00e2y h\u1ed7 tr\u1ee3 t\u1ea3i kh\u00f4ng \u0111\u1ed3ng b\u1ed9:<\/p>\n\n\n\n<ul><li>BuySellAds (<code>s3.buysellads.com\/ac\/bsa.js<\/code>) : <a href=\"http:\/\/blog.buysellads.com\/2010\/new-feature-non-blocking-asynchronous-ad-code\/\" target=\"_blank\" rel=\"noreferrer noopener\">blog post<\/a> &#8211; <em>m\u1eb7c \u0111\u1ecbnh l\u00e0 async<\/em><\/li><li>ChartBeat (<code>static.chartbeat.com\/js\/chartbeat.js<\/code>) : <a href=\"http:\/\/chartbeat.com\/docs\/adding_the_code\/\" target=\"_blank\" rel=\"noreferrer noopener\">doc<\/a>, <a href=\"http:\/\/blog.chartbeat.com\/2009\/10\/02\/chartbeat-just-got-faster\/\" target=\"_blank\" rel=\"noreferrer noopener\">blog post<\/a> &#8211; <em>m\u1eb7c \u0111\u1ecbnh l\u00e0 async<\/em><\/li><li>Clicky (<code>static.getclicky.com\/js<\/code>) : <a href=\"http:\/\/clicky.com\/blog\/204\/asynchronous-tracking-code\" target=\"_blank\" rel=\"noreferrer noopener\">blog post<\/a><\/li><li>Disqus (<code>disqus.com\/count.js, disqus.com\/embed.js<\/code>) : <a href=\"http:\/\/disqus.com\/admin\/universalcode\/\">doc<\/a>, <a href=\"http:\/\/blog.disqus.com\/post\/397517128\/making-disqus-faster\" target=\"_blank\" rel=\"noreferrer noopener\">blog post<\/a> &#8211; <em>m\u1eb7c \u0111\u1ecbnh l\u00e0 async<\/em><\/li><li>Facebook (<code>connect.facebook.net\/...\/all.js<\/code>) : <a href=\"https:\/\/developers.facebook.com\/docs\/reference\/javascript\/\" target=\"_blank\" rel=\"noreferrer noopener\">doc<\/a>, <a href=\"https:\/\/www.facebook.com\/note.php?note_id=10151176218703920\" target=\"_blank\" rel=\"noreferrer noopener\">blog post<\/a> &#8211; <em>m\u1eb7c \u0111\u1ecbnh l\u00e0 async<\/em><\/li><li>Google AdSense (<code>pagead2.googlesyndication.com\/pagead\/show_ads.js<\/code>) : <a href=\"https:\/\/support.google.com\/adsense\/answer\/3221666?hl=en\">doc<\/a>, <a href=\"http:\/\/googledevelopers.blogspot.com\/2013\/07\/an-async-script-for-adsense-tagging.html\">blog post<\/a><\/li><li>Google Analytics (<code>google-analytics.com\/ga.js<\/code>) : <a href=\"https:\/\/developers.google.com\/analytics\/devguides\/collection\/gajs\/asyncTracking\" target=\"_blank\" rel=\"noreferrer noopener\">doc<\/a>, <a href=\"http:\/\/analytics.blogspot.com\/2009\/12\/google-analytics-launches-asynchronous.html\" target=\"_blank\" rel=\"noreferrer noopener\">blog post<\/a> &#8211; <em>m\u1eb7c \u0111\u1ecbnh l\u00e0 async<\/em><\/li><li>Google DFP GPT (<code>www.googletagservices.com\/tag\/js\/gpt.js<\/code>) : <a href=\"https:\/\/support.google.com\/dfp_premium\/bin\/answer.py?hl=en&amp;answer=181073&amp;topic=28788&amp;ctx=topic\" target=\"_blank\" rel=\"noreferrer noopener\">doc<\/a><\/li><li>Google Plus (<code>apis.google.com\/js\/plusone.js<\/code>) : <a href=\"https:\/\/developers.google.com\/+\/web\/+1button\/#async-load\" target=\"_blank\" rel=\"noreferrer noopener\">doc<\/a>, <a href=\"http:\/\/googlewebmastercentral.blogspot.com\/2011\/07\/1-button-now-faster.html\" target=\"_blank\" rel=\"noreferrer noopener\">blog post<\/a><\/li><li>New Relic (<code>d7p9czrvs14ne.cloudfront.net\/11\/eum\/rum.js<\/code>) : <a href=\"https:\/\/newrelic.com\/docs\/features\/how-does-real-user-monitoring-work#rum-for-browsers-without-the-navigation-timing-api\" target=\"_blank\" rel=\"noreferrer noopener\">doc<\/a> &#8211; <em>m\u1eb7c \u0111\u1ecbnh l\u00e0 async<\/em><\/li><li>Pinterest (<code>assets.pinterest.com\/js\/pinit.js<\/code>) : <a href=\"https:\/\/help.pinterest.com\/entries\/21101982-adding-the-pin-it-button-to-your-website\" target=\"_blank\" rel=\"noreferrer noopener\">doc<\/a><\/li><li>Shareaholic : <a href=\"https:\/\/shareaholic.com\/publishers\/analytics\/\" target=\"_blank\" rel=\"noreferrer noopener\">doc<\/a> &#8211; <em>m\u1eb7c \u0111\u1ecbnh l\u00e0 async<\/em><\/li><li>ShareThis (<code>w.sharethis.com\/button\/buttons.js<\/code>) : <a href=\"http:\/\/support.sharethis.com\/customer\/portal\/articles\/475260\">d<\/a><a href=\"http:\/\/support.sharethis.com\/customer\/portal\/articles\/475260\" target=\"_blank\" rel=\"noreferrer noopener\">o<\/a><a href=\"http:\/\/support.sharethis.com\/customer\/portal\/articles\/475260\">c<\/a><\/li><li>ScorecardResearch\/Comscore (<code>b.scorecardresearch.com\/beacon.js<\/code>) : <a href=\"http:\/\/www.netmonitor.cz\/sites\/default\/files\/mobilewebcensus-allplatforms.pdf\" target=\"_blank\" rel=\"noreferrer noopener\">doc<\/a> &#8211; <em>m\u1eb7c \u0111\u1ecbnh l\u00e0 async<\/em><\/li><li>StumbleUpon (<code>platform.stumbleupon.com\/...\/widgets.js<\/code>)<\/li><li>Quantcast (<code>quantserve.com\/quant.js<\/code>) : <a href=\"https:\/\/www.quantcast.com\/learning-center\/guides\/using-the-quantcast-asynchronous-tag\/\" target=\"_blank\" rel=\"noreferrer noopener\">doc<\/a> &#8211; <em>m\u1eb7c \u0111\u1ecbnh l\u00e0 async<\/em><\/li><li>Twitter (<code>platform.twitter.com\/widgets.js<\/code>) : <a href=\"https:\/\/twitter.com\/about\/resources\/buttons\" target=\"_blank\" rel=\"noreferrer noopener\">doc<\/a> &#8211; <em>m\u1eb7c \u0111\u1ecbnh l\u00e0 async<\/em><\/li><li>Tynt (<code>cdn.tynt.com\/tc.js<\/code>)<\/li><li>Yandex (<code>mc.yandex.ru\/metrika\/watch.js<\/code>)<\/li><\/ul>\n\n\n\n<p>L\u01b0u \u00fd: Ch\u00fang t\u00f4i n\u1ed7 l\u1ef1c h\u1ebft s\u1ee9c \u0111\u1ec3 gi\u1eef (<em>best effort to keep<\/em>) danh s\u00e1ch tr\u00ean \u0111\u01b0\u1ee3c c\u1eadp nh\u1eadt (<em>up-to-date<\/em>). D\u1ea7u v\u1eady, n\u1ebfu b\u1ea1n c\u00f3 c\u00e2u h\u1ecfi \u0111\u1eb7c bi\u1ec7t n\u00e0o v\u1ec1 <a href=\"https:\/\/kiencang.net\/tai-javascript-ben-thu-ba\/\" target=\"_blank\" rel=\"noreferrer noopener\">JavaScript c\u1ee7a b\u00ean th\u1ee9 ba<\/a> ho\u1eb7c b\u1ea1n kh\u00f4ng t\u00ecm \u0111\u01b0\u1ee3c phi\u00ean b\u1ea3n kh\u00f4ng \u0111\u1ed3ng b\u1ed9 (<em>async<\/em>) c\u1ee7a h\u1ecd \u1edf \u0111\u00e2y, ch\u00fang t\u00f4i khuy\u1ebfn kh\u00edch (<em>encourage<\/em>) b\u1ea1n li\u00ean h\u1ec7 tr\u1ef1c ti\u1ebfp v\u1edbi nh\u00e0 cung c\u1ea5p.<\/p>\n\n\n\n<p>Ch\u00fang t\u00f4i c\u00f3 th\u00eam th\u00f4ng tin gi\u1ea3i th\u00edch t\u1ea1i sao lo\u1ea1i b\u1ecf JavaScript ch\u1eb7n hi\u1ec3n th\u1ecb c\u00f3 th\u1ec3 t\u0103ng t\u1ed1c \u0111\u1ed9 t\u1ea3i trang c\u1ee7a b\u1ea1n (<em>n\u00f3 \u1edf ngay ph\u1ea7n 9 n\u1ebfu b\u1ea1n \u0111\u1ec3 \u00fd!<\/em>)<\/p>\n\n\n\n<p><strong>Kinh nghi\u1ec7m c\u00e1 nh\u00e2n v\u1edbi WordPress:&nbsp;<\/strong>Khi m\u1edbi \u0111\u1ecdc \u0111\u1ebfn ph\u1ea7n 9, t\u00f4i \u0111\u00e3 ngh\u0129 ph\u1ea3i \u0111i\u1ec1u ch\u1ec9nh l\u1ea1i c\u00e1c \u0111o\u1ea1n m\u00e3 JavaScript c\u1ee7a Google Analystics v\u00e0 Facebook Fanpage th\u00f4i, nh\u01b0ng t\u00f4i lo th\u1eeba r\u1ed3i. C\u00e1c h\u00e3ng c\u00f4ng ngh\u1ec7 l\u1edbn \u0111\u1ec1u \u00fd th\u1ee9c \u0111\u01b0\u1ee3c \u00fd ngh\u0129a c\u1ee7a vi\u1ec7c t\u1ea3i kh\u00f4ng \u0111\u1ed3ng b\u1ed9 n\u00ean c\u00e1c \u0111o\u1ea1n m\u00e3 c\u1ee7a h\u1ecd \u0111\u00e3 m\u1eb7c \u0111\u1ecbnh nh\u01b0 th\u1ebf r\u1ed3i.<\/p>\n\n\n\n<p><em>(D\u1ecbch t\u1eeb c\u00e1c b\u00e0i vi\u1ebft thu\u1ed9c ph\u1ea7n Speed Rules &#8211; PageSpeed Insights Rules &#8211; Make the Web Faster &#8211; Google Developers)<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Tr\u01b0\u1edbc khi \u0111i v\u00e0o chi ti\u1ebft, b\u1ea1n n\u00ean \u0111\u1ecdc b\u00e0i vi\u1ebft n\u00e0y: T\u1ea1i sao \u0111i\u1ec3m s\u1ed1 Google PageSpeed, Pingdom v\u00e0 GTmetrix l\u1ea1i kh\u00f4ng quan tr\u1ecdng. Google c\u00f3 nhi\u1ec1u c\u00f4ng c\u1ee5 gi\u00fap ng\u01b0\u1eddi qu\u1ea3n tr\u1ecb web t\u1ed1i \u01b0u h\u00f3a t\u1ed1c \u0111\u1ed9 cho ng\u01b0\u1eddi d\u00f9ng, ngo\u00e0i Google AMP, \u0111\u1ecbnh d\u1ea1ng \u1ea3nh WebP, t\u00f4i c\u0169ng r\u1ea5t th\u00edch c\u00e1c &hellip;<\/p>\n","protected":false},"author":1,"featured_media":13107,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[260,297],"tags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v21.6 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>T\u1ed1i \u01b0u Google PageSpeed Insights \u0111\u1ec3 t\u0103ng t\u1ed1c \u0111\u1ed9 website &#8226; Ki\u1ebfn c\u00e0ng<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/kiencang.net\/tang-toc-web-pagespeed-insights\/\" \/>\n<meta property=\"og:locale\" content=\"vi_VN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"T\u1ed1i \u01b0u Google PageSpeed Insights \u0111\u1ec3 t\u0103ng t\u1ed1c \u0111\u1ed9 website &#8226; Ki\u1ebfn c\u00e0ng\" \/>\n<meta property=\"og:description\" content=\"Tr\u01b0\u1edbc khi \u0111i v\u00e0o chi ti\u1ebft, b\u1ea1n n\u00ean \u0111\u1ecdc b\u00e0i vi\u1ebft n\u00e0y: T\u1ea1i sao \u0111i\u1ec3m s\u1ed1 Google PageSpeed, Pingdom v\u00e0 GTmetrix l\u1ea1i kh\u00f4ng quan tr\u1ecdng. Google c\u00f3 nhi\u1ec1u c\u00f4ng c\u1ee5 gi\u00fap ng\u01b0\u1eddi qu\u1ea3n tr\u1ecb web t\u1ed1i \u01b0u h\u00f3a t\u1ed1c \u0111\u1ed9 cho ng\u01b0\u1eddi d\u00f9ng, ngo\u00e0i Google AMP, \u0111\u1ecbnh d\u1ea1ng \u1ea3nh WebP, t\u00f4i c\u0169ng r\u1ea5t th\u00edch c\u00e1c &hellip;\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kiencang.net\/tang-toc-web-pagespeed-insights\/\" \/>\n<meta property=\"og:site_name\" content=\"Ki\u1ebfn c\u00e0ng\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/anhducnguyen87\/\" \/>\n<meta property=\"article:published_time\" content=\"2020-03-19T22:58:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-08-18T09:51:40+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/chim-dai-bang-1.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"640\" \/>\n\t<meta property=\"og:image:height\" content=\"426\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Nguy\u1ec5n \u0110\u1ee9c Anh\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u0110\u01b0\u1ee3c vi\u1ebft b\u1edfi\" \/>\n\t<meta name=\"twitter:data1\" content=\"Nguy\u1ec5n \u0110\u1ee9c Anh\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u01af\u1edbc t\u00ednh th\u1eddi gian \u0111\u1ecdc\" \/>\n\t<meta name=\"twitter:data2\" content=\"56 ph\u00fat\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"T\u1ed1i \u01b0u Google PageSpeed Insights \u0111\u1ec3 t\u0103ng t\u1ed1c \u0111\u1ed9 website &#8226; Ki\u1ebfn c\u00e0ng","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/kiencang.net\/tang-toc-web-pagespeed-insights\/","og_locale":"vi_VN","og_type":"article","og_title":"T\u1ed1i \u01b0u Google PageSpeed Insights \u0111\u1ec3 t\u0103ng t\u1ed1c \u0111\u1ed9 website &#8226; Ki\u1ebfn c\u00e0ng","og_description":"Tr\u01b0\u1edbc khi \u0111i v\u00e0o chi ti\u1ebft, b\u1ea1n n\u00ean \u0111\u1ecdc b\u00e0i vi\u1ebft n\u00e0y: T\u1ea1i sao \u0111i\u1ec3m s\u1ed1 Google PageSpeed, Pingdom v\u00e0 GTmetrix l\u1ea1i kh\u00f4ng quan tr\u1ecdng. Google c\u00f3 nhi\u1ec1u c\u00f4ng c\u1ee5 gi\u00fap ng\u01b0\u1eddi qu\u1ea3n tr\u1ecb web t\u1ed1i \u01b0u h\u00f3a t\u1ed1c \u0111\u1ed9 cho ng\u01b0\u1eddi d\u00f9ng, ngo\u00e0i Google AMP, \u0111\u1ecbnh d\u1ea1ng \u1ea3nh WebP, t\u00f4i c\u0169ng r\u1ea5t th\u00edch c\u00e1c &hellip;","og_url":"https:\/\/kiencang.net\/tang-toc-web-pagespeed-insights\/","og_site_name":"Ki\u1ebfn c\u00e0ng","article_author":"https:\/\/www.facebook.com\/anhducnguyen87\/","article_published_time":"2020-03-19T22:58:00+00:00","article_modified_time":"2022-08-18T09:51:40+00:00","og_image":[{"width":640,"height":426,"url":"https:\/\/kiencang.net\/wp-content\/uploads\/2017\/06\/chim-dai-bang-1.jpg","type":"image\/jpeg"}],"author":"Nguy\u1ec5n \u0110\u1ee9c Anh","twitter_card":"summary_large_image","twitter_misc":{"\u0110\u01b0\u1ee3c vi\u1ebft b\u1edfi":"Nguy\u1ec5n \u0110\u1ee9c Anh","\u01af\u1edbc t\u00ednh th\u1eddi gian \u0111\u1ecdc":"56 ph\u00fat"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/kiencang.net\/tang-toc-web-pagespeed-insights\/","url":"https:\/\/kiencang.net\/tang-toc-web-pagespeed-insights\/","name":"T\u1ed1i \u01b0u Google PageSpeed Insights \u0111\u1ec3 t\u0103ng t\u1ed1c \u0111\u1ed9 website &#8226; Ki\u1ebfn c\u00e0ng","isPartOf":{"@id":"https:\/\/kiencang.net\/#website"},"datePublished":"2020-03-19T22:58:00+00:00","dateModified":"2022-08-18T09:51:40+00:00","author":{"@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16"},"breadcrumb":{"@id":"https:\/\/kiencang.net\/tang-toc-web-pagespeed-insights\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kiencang.net\/tang-toc-web-pagespeed-insights\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kiencang.net\/tang-toc-web-pagespeed-insights\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kiencang.net\/"},{"@type":"ListItem","position":2,"name":"T\u1ed1i \u01b0u Google PageSpeed Insights \u0111\u1ec3 t\u0103ng t\u1ed1c \u0111\u1ed9 website"}]},{"@type":"WebSite","@id":"https:\/\/kiencang.net\/#website","url":"https:\/\/kiencang.net\/","name":"Ki\u1ebfn c\u00e0ng","description":"\u00d4m l\u00fd thuy\u1ebft, h\u00f4n th\u1ef1c h\u00e0nh","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/kiencang.net\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"vi"},{"@type":"Person","@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16","name":"Nguy\u1ec5n \u0110\u1ee9c Anh","image":{"@type":"ImageObject","inLanguage":"vi","@id":"https:\/\/kiencang.net\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/6d71f9b89393952a8382e30dad26c1ec?s=96&d=monsterid&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/6d71f9b89393952a8382e30dad26c1ec?s=96&d=monsterid&r=g","caption":"Nguy\u1ec5n \u0110\u1ee9c Anh"},"description":"Sinh n\u0103m 1987, t\u1ed1t nghi\u1ec7p Cao \u0111\u1eb3ng th\u1ef1c h\u00e0nh FPT qu\u00e3ng 2014, chuy\u00ean ng\u00e0nh Thi\u1ebft k\u1ebf website. T\u00f4i th\u00edch Content, SEO, Ads, T\u0103ng t\u1ed1c website v\u00e0 Th\u01b0\u01a1ng m\u1ea1i \u0111i\u1ec7n t\u1eed. B\u00ean c\u1ea1nh b\u00e0i t\u1ef1 vi\u1ebft, t\u00f4i c\u0169ng d\u1ecbch nhi\u1ec1u n\u1ed9i dung th\u00fa v\u1ecb c\u1ee7a c\u00e1c t\u00e1c gi\u1ea3 kh\u00e1c nhau. FB c\u00e1 nh\u00e2n: facebook.com\/anhducnguyen87. Email li\u00ean h\u1ec7: guiemailchotoi@gmail.com","sameAs":["https:\/\/www.facebook.com\/anhducnguyen87\/"],"url":"https:\/\/kiencang.net\/author\/admin\/"}]}},"_links":{"self":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/5047"}],"collection":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/comments?post=5047"}],"version-history":[{"count":0,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/5047\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media\/13107"}],"wp:attachment":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media?parent=5047"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/categories?post=5047"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/tags?post=5047"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}