{"id":12874,"date":"2019-02-13T04:45:39","date_gmt":"2019-02-13T04:45:39","guid":{"rendered":"https:\/\/www.ducanhplus.com\/?p=11711"},"modified":"2019-02-13T04:45:39","modified_gmt":"2019-02-13T04:45:39","slug":"tri-hoan-tai-javascript","status":"publish","type":"post","link":"https:\/\/kiencang.net\/tri-hoan-tai-javascript\/","title":{"rendered":"L\u00e0m th\u1ebf n\u00e0o \u0111\u1ec3 tr\u00ec ho\u00e3n t\u1ea3i JavaScript"},"content":{"rendered":"\n<p>Tr\u00ec ho\u00e3n t\u1ea3i JavaScript \u0111\u00fang c\u00e1ch l\u00e0 khi b\u1ea1n ch\u1ec9 t\u1ea3i ho\u1eb7c ph\u00e2n t\u00edch c\u00fa ph\u00e1p (parsing) JavaScript sau khi n\u1ed9i dung c\u1ee7a trang \u0111\u01b0\u1ee3c t\u1ea3i xong (hay n\u00f3i c\u00e1ch kh\u00e1c JavaScript s\u1ebd kh\u00f4ng l\u00e0m \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn t\u1ed1c \u0111\u1ed9 trang ho\u1eb7c <a href=\"https:\/\/kiencang.net\/duong-dan-hien-thi-trang-quan-trong\/\">tuy\u1ebfn hi\u1ec3n th\u1ecb quan tr\u1ecdng<\/a>).<\/p>\n\n\n<ol><li>S\u1eed d\u1ee5ng s\u1ef1 ki\u1ec7n &#8220;onload&#8221; ch\u00fang ta g\u1ecdi m\u1ed9t file JavaScript b\u00ean ngo\u00e0i (external)<\/li><li>JavaScript b\u00ean ngo\u00e0i s\u1ebd kh\u00f4ng t\u1ea3i cho \u0111\u1ebfn khi n\u1ed9i dung c\u1ee7a trang \u0111\u01b0\u1ee3c t\u1ea3i xong<\/li><li>JavaScript b\u00ean ngo\u00e0i sau \u0111\u00f3 s\u1ebd \u0111\u01b0\u1ee3c th\u1ef1c thi v\u00e0 c\u00f3 hi\u1ec7u \u1ee9ng l\u00ean trang<\/li><\/ol>\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/kiencang.net\/wp-content\/uploads\/2019\/02\/tri-hoan-tai-javascript.png\" alt=\"tr\u00ec ho\u00e3n t\u1ea3i javascript\" class=\"wp-image-11712\"\/><\/figure><\/div>\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-6577d6c406582\" ><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-6577d6c406582\"  type=\"checkbox\" id=\"item-6577d6c406582\"><\/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\/tri-hoan-tai-javascript\/#Giai_thich\" title=\"Gi\u1ea3i th\u00edch\">Gi\u1ea3i th\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\/tri-hoan-tai-javascript\/#Doan_ma_dung_de_goi_file_JavaScript_ngoai\" title=\"\u0110o\u1ea1n m\u00e3 d\u00f9ng \u0111\u1ec3 g\u1ecdi file JavaScript ngo\u00e0i\">\u0110o\u1ea1n m\u00e3 d\u00f9ng \u0111\u1ec3 g\u1ecdi file JavaScript ngo\u00e0i<\/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\/tri-hoan-tai-javascript\/#Doan_ma_tren_lam_dieu_gi\" title=\"\u0110o\u1ea1n m\u00e3 tr\u00ean l\u00e0m \u0111i\u1ec1u g\u00ec?\">\u0110o\u1ea1n m\u00e3 tr\u00ean l\u00e0m \u0111i\u1ec1u g\u00ec?<\/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\/tri-hoan-tai-javascript\/#Cac_huong_dan_cu_the\" title=\"C\u00e1c h\u01b0\u1edbng d\u1eabn c\u1ee5 th\u1ec3\">C\u00e1c h\u01b0\u1edbng d\u1eabn c\u1ee5 th\u1ec3<\/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\/tri-hoan-tai-javascript\/#Doan_ma_tren_co_the_duoc_ap_dung_trong_truong_hop_nao_va_luc_nao_thi_no_khong_the_ap_dung_duoc\" title=\"\u0110o\u1ea1n m\u00e3 tr\u00ean c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c \u00e1p d\u1ee5ng trong tr\u01b0\u1eddng h\u1ee3p n\u00e0o (v\u00e0 l\u00fac n\u00e0o th\u00ec n\u00f3 kh\u00f4ng th\u1ec3 \u00e1p d\u1ee5ng \u0111\u01b0\u1ee3c)?\">\u0110o\u1ea1n m\u00e3 tr\u00ean c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c \u00e1p d\u1ee5ng trong tr\u01b0\u1eddng h\u1ee3p n\u00e0o (v\u00e0 l\u00fac n\u00e0o th\u00ec n\u00f3 kh\u00f4ng th\u1ec3 \u00e1p d\u1ee5ng \u0111\u01b0\u1ee3c)?<\/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\/tri-hoan-tai-javascript\/#Tai_sao_cac_phuong_phap_khac_khong_hieu_qua\" title=\"T\u1ea1i sao c\u00e1c ph\u01b0\u01a1ng ph\u00e1p kh\u00e1c kh\u00f4ng hi\u1ec7u qu\u1ea3?\">T\u1ea1i sao c\u00e1c ph\u01b0\u01a1ng ph\u00e1p kh\u00e1c kh\u00f4ng hi\u1ec7u qu\u1ea3?<\/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\/tri-hoan-tai-javascript\/#Tai_sao_no_lai_la_van_de\" title=\"T\u1ea1i sao n\u00f3 l\u1ea1i l\u00e0 v\u1ea5n \u0111\u1ec1?\">T\u1ea1i sao n\u00f3 l\u1ea1i l\u00e0 v\u1ea5n \u0111\u1ec1?<\/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\/tri-hoan-tai-javascript\/#Vi_du_thuc_te\" title=\"V\u00ed d\u1ee5 th\u1ef1c t\u1ebf\">V\u00ed d\u1ee5 th\u1ef1c t\u1ebf<\/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\/tri-hoan-tai-javascript\/#Cac_file_vi_du_cho_ban_thu_nghiem\" title=\"C\u00e1c file v\u00ed d\u1ee5 cho b\u1ea1n th\u1eed nghi\u1ec7m\">C\u00e1c file v\u00ed d\u1ee5 cho b\u1ea1n th\u1eed nghi\u1ec7m<\/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\/tri-hoan-tai-javascript\/#Diem_quan_trong\" title=\"\u0110i\u1ec3m quan tr\u1ecdng\">\u0110i\u1ec3m quan tr\u1ecdng<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/kiencang.net\/tri-hoan-tai-javascript\/#Cong_cu\" title=\"C\u00f4ng c\u1ee5\">C\u00f4ng c\u1ee5<\/a><\/li><\/ul><\/nav><\/div>\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Giai_thich\"><\/span>Gi\u1ea3i th\u00edch<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<p>Tr\u00ec ho\u00e3n t\u1ea3i JavaScript l\u00e0 m\u1ed9t trong c\u00e1c v\u1ea5n \u0111\u1ec1 v\u1edbi website m\u00e0 c\u00f3 th\u1ec3 khi\u1ebfn b\u1ea1n ph\u1ea3i v\u00f2 \u0111\u1ea7u b\u1ee9t t\u00f3c \u0111\u1ec3 t\u00ecm ra gi\u1ea3i ph\u00e1p.<\/p>\n\n\n<p>Nhi\u1ec1u ng\u01b0\u1eddi n\u00f3i r\u1eb1ng &#8220;<a href=\"https:\/\/kiencang.net\/tai-javascript-defer-async\/\">ch\u1ec9 c\u1ea7n s\u1eed d\u1ee5ng tr\u00ec ho\u00e3n t\u1ea3i (&#8216;defer&#8217;) l\u00e0 \u0111\u01b0\u1ee3c&#8221; ho\u1eb7c &#8220;ch\u1ec9 c\u1ea7n s\u1eed d\u1ee5ng t\u1ea3i kh\u00f4ng \u0111\u1ed3ng b\u1ed9 (&#8216;async&#8217;)<\/a>&#8220;, m\u1ed9t s\u1ed1 kh\u00e1c th\u00ec b\u1ea3o r\u1eb1ng &#8220;c\u1ee9 \u0111\u01b0a JavaScript xu\u1ed1ng ph\u1ea7n cu\u1ed1i c\u1ee7a trang l\u00e0 xong th\u00f4i m\u00e0&#8221; nh\u01b0ng kh\u00f4ng c\u00f3 gi\u1ea3i ph\u00e1p n\u00e0o trong s\u1ed1 \u0111\u00f3 th\u1ef1c s\u1ef1 gi\u1ea3i quy\u1ebft \u0111\u01b0\u1ee3c v\u1ea5n \u0111\u1ec1 cho ph\u00e9p trang t\u1ea3i \u0111\u1ea7y \u0111\u1ee7 r\u1ed3i sau \u0111\u00f3 (v\u00e0 ch\u1ec9 sau \u0111\u00f3) m\u1edbi \u0111\u01b0\u1ee3c t\u1ea3i JavaScript b\u00ean ngo\u00e0i. Ch\u00fang c\u0169ng kh\u00f4ng gi\u00fap b\u1ea1n v\u01b0\u1ee3t qua \u0111\u01b0\u1ee3c c\u1ea3nh b\u1ea3o &#8220;tr\u00ec ho\u00e3n t\u1ea3i JavaScript&#8221; m\u00e0 b\u1ea1n s\u1ebd nh\u1eadn \u0111\u01b0\u1ee3c khi d\u00f9ng <a href=\"https:\/\/developers.google.com\/speed\/pagespeed\/insights\/?hl=vi\">c\u00f4ng c\u1ee5 ki\u1ec3m tra t\u1ed1c \u0111\u1ed9 c\u1ee7a Google<\/a>.<\/p>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Doan_ma_dung_de_goi_file_JavaScript_ngoai\"><\/span>\u0110o\u1ea1n m\u00e3 d\u00f9ng \u0111\u1ec3 g\u1ecdi file JavaScript ngo\u00e0i<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<p>\u0110o\u1ea1n m\u00e3 n\u00e0y ph\u1ea3i \u0111\u01b0\u1ee3c \u0111\u01b0a v\u00e0o file HTML c\u1ee7a b\u1ea1n tr\u01b0\u1edbc th\u1ebb \u0111\u00f3ng &lt;\/body&gt; (\u1edf g\u1ea7n cu\u1ed1i file HTML). T\u00f4i \u0111\u00e1nh d\u1ea5u n\u1ed5i b\u1eadt t\u00ean c\u1ee7a file JS b\u00ean ngo\u00e0i.<\/p>\n\n\n<pre class=\"wp-block-preformatted\">&lt;script type=\"text\/javascript\"&gt;\nfunction downloadJSAtOnload() {\nvar element = document.createElement(\"script\");\nelement.src = \"<span style=\"color: #ff0000;\">defer.js<\/span>\";\ndocument.body.appendChild(element);\n}\nif (window.addEventListener)\nwindow.addEventListener(\"load\", downloadJSAtOnload, false);\nelse if (window.attachEvent)\nwindow.attachEvent(\"onload\", downloadJSAtOnload);\nelse window.onload = downloadJSAtOnload;\n&lt;\/script&gt;<\/pre>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Doan_ma_tren_lam_dieu_gi\"><\/span>\u0110o\u1ea1n m\u00e3 tr\u00ean l\u00e0m \u0111i\u1ec1u g\u00ec?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<p>\u0110o\u1ea1n m\u00e3 tr\u00ean n\u00f3i r\u1eb1ng h\u00e3y \u0111\u1ee3i to\u00e0n b\u1ed9 t\u00e0i li\u1ec7u t\u1ea3i xong, sau \u0111\u00f3 m\u1edbi t\u1ea3i file b\u00ean ngo\u00e0i c\u00f3 t\u00ean &#8220;<span style=\"color: #ff0000;\">defer.js<\/span>&#8220;<\/p>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Cac_huong_dan_cu_the\"><\/span>C\u00e1c h\u01b0\u1edbng d\u1eabn c\u1ee5 th\u1ec3<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<ol><li>Copy \u0111o\u1ea1n m\u00e3 tr\u00ean<\/li><li>Paste \u0111o\u1ea1n m\u00e3 v\u00e0o trong HTML ngay tr\u01b0\u1edbc th\u1ebb \u0111\u00f3ng &lt;\/body&gt; (\u1edf g\u1ea7n cu\u1ed1i file HTML)<\/li><li>Thay t\u00ean &#8220;defer.js&#8221; b\u1eb1ng t\u00ean file JS b\u00ean ngo\u00e0i c\u1ee7a b\u1ea1n<\/li><li>\u0110\u1ea3m b\u1ea3o \u0111\u01b0\u1eddng d\u1eabn t\u1edbi file JS c\u1ee7a b\u1ea1n l\u00e0 ch\u00ednh x\u00e1c. V\u00ed d\u1ee5: n\u1ebfu b\u1ea1n ch\u1ec9 \u0111\u1eb7t &#8220;defer.js&#8221; th\u00ec \u0111i\u1ec1u \u0111\u00f3 c\u00f3 ngh\u0129a l\u00e0 &#8220;defer.js&#8221; ph\u1ea3i \u1edf c\u00f9ng th\u01b0 m\u1ee5c v\u1edbi file HTML.<\/li><\/ol>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Doan_ma_tren_co_the_duoc_ap_dung_trong_truong_hop_nao_va_luc_nao_thi_no_khong_the_ap_dung_duoc\"><\/span>\u0110o\u1ea1n m\u00e3 tr\u00ean c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c \u00e1p d\u1ee5ng trong tr\u01b0\u1eddng h\u1ee3p n\u00e0o (v\u00e0 l\u00fac n\u00e0o th\u00ec n\u00f3 kh\u00f4ng th\u1ec3 \u00e1p d\u1ee5ng \u0111\u01b0\u1ee3c)?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<p>\u0110o\u1ea1n m\u00e3 tr\u00ean s\u1ebd kh\u00f4ng t\u1ea3i file JS ngo\u00e0i m\u00e0 b\u1ea1n ch\u1ec9 \u0111\u1ecbnh cho \u0111\u1ebfn khi t\u00e0i li\u1ec7u \u0111\u01b0\u1ee3c t\u1ea3i ho\u00e0n t\u1ea5t. V\u00ec th\u1ebf b\u1ea1n kh\u00f4ng \u0111\u01b0\u1ee3c th\u00eam b\u1ea5t k\u1ef3 JavaScript n\u00e0o v\u00e0o trong \u0111\u00f3 m\u00e0 m\u00e3 \u1ea5y c\u1ea7n thi\u1ebft cho vi\u1ec7c t\u1ea3i trang \u0111\u00fang. B\u1ea1n ph\u1ea3i ph\u00e2n chia JavaScript c\u1ee7a b\u1ea1n th\u00e0nh hai nh\u00f3m. <em>M\u1ed9t nh\u00f3m l\u00e0 JavaScript trang c\u1ea7n t\u1ea3i c\u00f9ng, v\u00e0 nh\u00f3m th\u1ee9 hai l\u00e0 c\u00e1c JavaScript \u0111\u01b0\u1ee3c ph\u00e9p t\u1ea3i sau<\/em>, sau khi trang t\u1ea3i xong (th\u00ed d\u1ee5 nh\u01b0 click v\u00e0o m\u1ed9t s\u1ef1 ki\u1ec7n ho\u1eb7c c\u00e1i g\u00ec \u0111\u00f3 t\u01b0\u01a1ng t\u1ef1). T\u1ea5t c\u1ea3 JavaScript c\u00f3 th\u1ec3 \u0111\u1ee3i sau khi trang t\u1ea3i xong ph\u1ea3i \u0111\u01b0\u1ee3c \u0111\u01b0a c\u1ea3 v\u00e0o file b\u00ean ngo\u00e0i m\u00e0 b\u1ea1n \u0111\u01b0a l\u1ec7nh g\u1ecdi \u1edf tr\u00ean.<\/p>\n\n\n<p>L\u1ea5y v\u00ed d\u1ee5, tr\u00ean trang n\u00e0y t\u00f4i s\u1eed d\u1ee5ng file tr\u00ean \u0111\u1ec3 tr\u00ec ho\u00e3n c\u00e1c \u0111o\u1ea1n m\u00e3 nh\u01b0 Google Analystics, Google plus badge (hi\u1ec3n th\u1ecb \u1edf ch\u00e2n trang), v\u00e0 Viglink (c\u00f4ng c\u1ee5 \u0111\u1ec3 t\u00f4i ki\u1ebfm ti\u1ec1n). Ch\u1eb3ng c\u00f3 l\u00fd do n\u00e0o t\u00f4i ph\u1ea3i t\u1ea3i nh\u1eefng file n\u00e0y <a href=\"https:\/\/kiencang.net\/uu-tien-noi-dung-hien-thi\/\">cho n\u1ed9i dung thu\u1ed9c m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean<\/a> b\u1edfi v\u00ec ch\u00fang kh\u00f4ng c\u1ea7n thi\u1ebft \u0111\u1ec3 hi\u1ec3n th\u1ecb n\u1ed9i dung \u0111\u00f3. B\u1ea1n c\u00f3 th\u1ec3 c\u00f3 c\u00f9ng lo\u1ea1i n\u1ed9i dung tr\u00ean trang c\u1ee7a b\u1ea1n. B\u1ea1n c\u00f3 l\u00e0m ng\u01b0\u1eddi d\u00f9ng c\u1ee7a m\u00ecnh ph\u1ea3i ch\u1edd \u0111\u1ee3i \u0111\u1ec3 t\u1ea3i ch\u00fang r\u1ed3i m\u1edbi cho h\u1ecd xem n\u1ed9i dung?<\/p>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Tai_sao_cac_phuong_phap_khac_khong_hieu_qua\"><\/span>T\u1ea1i sao c\u00e1c ph\u01b0\u01a1ng ph\u00e1p kh\u00e1c kh\u00f4ng hi\u1ec7u qu\u1ea3?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<p>C\u00e1c ph\u01b0\u01a1ng ph\u00e1p nh\u01b0 l\u00e0 inline (n\u1ed9i tuy\u1ebfn), \u0111\u01b0a \u0111o\u1ea1n m\u00e3 xu\u1ed1ng ch\u00e2n trang, s\u1eed d\u1ee5ng &#8220;defer&#8221; ho\u1eb7c s\u1eed d\u1ee5ng &#8220;async&#8221; \u0111\u1ec1u kh\u00f4ng ho\u00e0n th\u00e0nh \u0111\u01b0\u1ee3c m\u1ee5c ti\u00eau c\u1ee7a vi\u1ec7c \u0111\u1ec3 trang t\u1ea3i tr\u01b0\u1edbc sau \u0111\u00f3 m\u1edbi t\u1ea3i JS sau v\u00e0 ch\u00fang (c\u00e1c ph\u01b0\u01a1ng ph\u00e1p k\u1ec3 tr\u00ean) ch\u1eafc ch\u1eafn kh\u00f4ng ho\u1ea1t \u0111\u1ed9ng \u0111\u01b0\u1ee3c tr\u00ean to\u00e0n b\u1ed9 c\u00e1c tr\u00ecnh duy\u1ec7t hi\u1ec7n c\u00f3 (cross browser\/kh\u00e1i ni\u1ec7m d\u00f9ng \u0111\u1ec3 ch\u1ec9 c\u00e1c trang web \u0111\u01b0\u1ee3c ph\u00e1t tri\u1ec3n tr\u00ean nhi\u1ec1u n\u1ec1n t\u1ea3ng tr\u00ecnh duy\u1ec7t kh\u00e1c nhau v\u00e0 c\u1ea7n cho k\u1ebft qu\u1ea3 t\u01b0\u01a1ng t\u1ef1).<\/p>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Tai_sao_no_lai_la_van_de\"><\/span>T\u1ea1i sao n\u00f3 l\u1ea1i l\u00e0 v\u1ea5n \u0111\u1ec1?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<p>N\u00f3 l\u00e0 v\u1ea5n \u0111\u1ec1 b\u1edfi v\u00ec Google xem t\u1ed1c \u0111\u1ed9 trang nh\u01b0 m\u1ed9t <a href=\"https:\/\/kiencang.net\/yeu-to-xep-hang-cua-google\/\">y\u1ebfu t\u1ed1 x\u1ebfp h\u1ea1ng<\/a> v\u00e0 c\u0169ng b\u1edfi ng\u01b0\u1eddi d\u00f9ng mu\u1ed1n t\u1ed1c \u0111\u1ed9 t\u1ea3i trang nhanh h\u01a1n. N\u00f3 c\u0169ng l\u00e0 v\u1ea5n \u0111\u1ec1 l\u1edbn cho SEO tr\u00ean thi\u1ebft b\u1ecb di \u0111\u1ed9ng (c\u00e1i v\u1ed1n c\u00f3 t\u1ed1c \u0111\u1ed9 k\u1ebft n\u1ed1i th\u1ea5p v\u00e0 kh\u00f4ng \u1ed5n \u0111\u1ecbnh). Google \u0111o t\u1ed1c \u0111\u1ed9 t\u1ea3i trang th\u00f4ng qua c\u00e1i \u0111\u01b0\u1ee3c g\u1ecdi l\u00e0 &#8220;t\u1ed1c \u0111\u1ed9 hi\u1ec3n th\u1ecb n\u1ed9i dung m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean&#8221;. \u0110i\u1ec1u \u0111\u00f3 ngh\u0129a l\u00e0 b\u1ea1n s\u1ebd mu\u1ed1n trang t\u1ea3i c\u00e0ng nhanh c\u00e0ng t\u1ed1t. Th\u1eddi gian t\u1ea3i n\u1ed9i dung tr\u00ean m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean \u0111\u01b0\u1ee3c Google s\u1eed d\u1ee5ng \u0111\u1ec3 \u0111\u00e1nh gi\u00e1 trang web (v\u00e0 \u0111\u1eebng qu\u00ean ng\u01b0\u1eddi d\u00f9ng c\u1ee7a b\u1ea1n c\u0169ng ph\u1ea3i \u0111\u1ee3i n\u00f3 t\u1ea3i). Google t\u00edch c\u1ef1c qu\u1ea3ng b\u00e1 v\u00e0 khuy\u1ebfn ngh\u1ecb vi\u1ec7c \u01b0u ti\u00ean cho n\u1ed9i dung tr\u00ean m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean v\u00ec th\u1ebf vi\u1ec7c \u0111\u01b0a b\u1ea5t c\u1ee9 t\u00e0i nguy\u00ean n\u00e0o (JS, CSS, \u1ea3nh, v\u00e2n v\u00e2n) ra kh\u1ecfi tuy\u1ebfn hi\u1ec3n th\u1ecb quan tr\u1ecdng l\u00e0 n\u1ed7 l\u1ef1c x\u1ee9ng \u0111\u00e1ng \u0111\u1ec3 b\u1ecf c\u00f4ng th\u1ef1c hi\u1ec7n. N\u1ebfu \u0111i\u1ec1u g\u00ec l\u00e0m ng\u01b0\u1eddi d\u00f9ng c\u1ee7a b\u1ea1n h\u1ea1nh ph\u00fac v\u00e0 l\u00e0m Google h\u1ea1nh ph\u00fac, c\u00f3 l\u1ebd b\u1ea1n c\u1ea7n ph\u1ea3i tri\u1ec3n khai n\u00f3.<\/p>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Vi_du_thuc_te\"><\/span>V\u00ed d\u1ee5 th\u1ef1c t\u1ebf<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<p>T\u00f4i c\u00f3 t\u1ea1o m\u1ed9t trang \u1edf \u0111\u00e2y \u0111\u1ec3 b\u1ea1n c\u00f3 th\u1ec3 nh\u00ecn th\u1ea5y c\u00e1ch s\u1eed d\u1ee5ng \u0111o\u1ea1n m\u00e3:&nbsp;<a href=\"https:\/\/varvy.com\/pagespeed\/defer\/defer-example-solved.html\">https:\/\/varvy.com\/pagespeed\/defer\/defer-example-solved.html<\/a><\/p>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Cac_file_vi_du_cho_ban_thu_nghiem\"><\/span>C\u00e1c file v\u00ed d\u1ee5 cho b\u1ea1n th\u1eed nghi\u1ec7m<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<p>Okay, ch\u1ec9 \u0111\u1ec3 minh h\u1ecda, t\u00f4i c\u00f3 t\u1ea1o m\u1ed9t s\u1ed1 trang v\u00ed d\u1ee5 \u0111\u1ec3 b\u1ea1n th\u1eed nghi\u1ec7m. C\u00e1c trang \u0111\u1ec1u gi\u1ed1ng nhau. N\u00f3 l\u00e0 m\u1ed9t trang HTML thu\u1ea7n s\u1eed d\u1ee5ng m\u1ed9t \u0111o\u1ea1n m\u00e3 \u0111\u1ee3i trong v\u00f2ng hai gi\u00e2y r\u1ed3i sau \u0111\u00f3 n\u00f3i &#8220;hello world&#8221;. B\u1ea1n c\u00f3 th\u1ec3 ki\u1ec3m tra v\u00e0 th\u1ea5y ch\u1ec9 c\u00f3 m\u1ed9t ph\u01b0\u01a1ng th\u1ee9c kh\u00f4ng l\u00e0m b\u1ea1n ph\u1ea3i \u0111\u1ee3i ch\u1edd 2 gi\u00e2y th\u00ec m\u1edbi hi\u1ec3n th\u1ecb n\u1ed9i dung.<\/p>\n\n\n<ul><li>Trang v\u1edbi m\u00e3 n\u1ed9i tuy\u1ebfn &#8211;&nbsp;<a href=\"https:\/\/varvy.com\/pagespeed\/defer\/defer-example-normal.html\" rel=\"nofollow\">xem \u1edf \u0111\u00e2y<\/a><\/li><li>Trang v\u1edbi script ngo\u00e0i s\u1eed d\u1ee5ng &#8220;defer&#8221; &#8211;&nbsp;<a href=\"https:\/\/varvy.com\/pagespeed\/defer\/defer-example-defer.html\" rel=\"nofollow\">xem \u1edf \u0111\u00e2y<\/a><\/li><li>Trang s\u1eed d\u1ee5ng \u0111o\u1ea1n m\u00e3 \u0111\u01b0\u1ee3c khuy\u1ebfn ngh\u1ecb \u1edf tr\u00ean &#8211;&nbsp;<a href=\"https:\/\/varvy.com\/pagespeed\/defer\/defer-example-solved.html\" rel=\"nofollow\">xem \u1edf \u0111\u00e2y<\/a><\/li><\/ul>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Diem_quan_trong\"><\/span>\u0110i\u1ec3m quan tr\u1ecdng<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<p>\u01afu ti\u00ean h\u00e0ng \u0111\u1ea7u c\u1ea7n ph\u1ea3i \u0111\u01b0\u1ee3c h\u01b0\u1edbng v\u00e0o nhi\u1ec7m v\u1ee5 ph\u00e2n ph\u1ed1i n\u1ed9i dung cho ng\u01b0\u1eddi d\u00f9ng c\u00e0ng s\u1edbm c\u00e0ng t\u1ed1t. Nhi\u1ec1u trang web hi\u1ec7n kh\u00f4ng l\u00e0m \u0111i\u1ec1u \u0111\u00f3 v\u1edbi c\u00e1ch x\u1eed l\u00fd JavaScript ch\u01b0a h\u1ee3p l\u00fd. Ng\u01b0\u1eddi d\u00f9ng kh\u00f4ng c\u1ea7n ph\u1ea3i ch\u1edd \u0111\u1ee3i \u0111\u1ec3 xem n\u1ed9i dung c\u1ee7a b\u1ea1n ch\u1ec9 v\u00ec m\u1ed9t s\u1ed1 \u0111o\u1ea1n m\u00e3 c\u00f3 nhi\u1ec7m v\u1ee5 l\u00e0m \u0111i\u1ec1u g\u00ec \u0111\u00f3 b\u00ean d\u01b0\u1edbi m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean. Ch\u1eb3ng th\u00e0nh v\u1ea5n \u0111\u1ec1 l\u00e0 ch\u00e2n trang web c\u1ee7a b\u1ea1n tr\u00f4ng tuy\u1ec7t th\u1ebf n\u00e0o \u0111\u00e2u, th\u1ef1c t\u1ebf l\u00e0 kh\u00f4ng c\u00f3 l\u00fd do n\u00e0o cho ng\u01b0\u1eddi d\u00f9ng &#8211; ng\u01b0\u1eddi th\u1eadm ch\u00ed c\u00f3 th\u1ec3 c\u00f2n ch\u1eb3ng bao gi\u1edd cu\u1ed9n chu\u1ed9t xu\u1ed1ng b\u00ean d\u01b0\u1edbi ch\u00e2n trang ph\u1ea3i t\u1ea3i c\u00e1c JavaScript c\u00f3 nhi\u1ec7m v\u1ee5 l\u00e0m ch\u00e2n trang c\u1ee7a b\u1ea1n tr\u00f4ng ngon m\u1eaft.<\/p>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Cong_cu\"><\/span>C\u00f4ng c\u1ee5<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<p>S\u1eed d\u1ee5ng c\u00f4ng c\u1ee5 n\u00e0y \u0111\u1ec3 ki\u1ec3m tra c\u00e1ch JavaScript \u0111\u01b0\u1ee3c s\u1eed d\u1ee5ng tr\u00ean trang: <a href=\"https:\/\/varvy.com\/tools\/js\/\">https:\/\/varvy.com\/tools\/js\/<\/a><\/p>\n\n\n<p><em>(D\u1ecbch t\u1eeb b\u00e0i vi\u1ebft: Defer loading javascript- T\u00e1c gi\u1ea3: Patrick Sexton \u2013 Website: Varvy)<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Tr\u00ec ho\u00e3n t\u1ea3i JavaScript \u0111\u00fang c\u00e1ch l\u00e0 khi b\u1ea1n ch\u1ec9 t\u1ea3i ho\u1eb7c ph\u00e2n t\u00edch c\u00fa ph\u00e1p (parsing) JavaScript sau khi n\u1ed9i dung c\u1ee7a trang \u0111\u01b0\u1ee3c t\u1ea3i xong (hay n\u00f3i c\u00e1ch kh\u00e1c JavaScript s\u1ebd kh\u00f4ng l\u00e0m \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn t\u1ed1c \u0111\u1ed9 trang ho\u1eb7c tuy\u1ebfn hi\u1ec3n th\u1ecb quan tr\u1ecdng). S\u1eed d\u1ee5ng s\u1ef1 ki\u1ec7n &#8220;onload&#8221; ch\u00fang ta g\u1ecdi &hellip;<\/p>\n","protected":false},"author":1,"featured_media":13066,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[272],"tags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v21.6 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>L\u00e0m th\u1ebf n\u00e0o \u0111\u1ec3 tr\u00ec ho\u00e3n t\u1ea3i JavaScript &#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\/tri-hoan-tai-javascript\/\" \/>\n<meta property=\"og:locale\" content=\"vi_VN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"L\u00e0m th\u1ebf n\u00e0o \u0111\u1ec3 tr\u00ec ho\u00e3n t\u1ea3i JavaScript &#8226; Ki\u1ebfn c\u00e0ng\" \/>\n<meta property=\"og:description\" content=\"Tr\u00ec ho\u00e3n t\u1ea3i JavaScript \u0111\u00fang c\u00e1ch l\u00e0 khi b\u1ea1n ch\u1ec9 t\u1ea3i ho\u1eb7c ph\u00e2n t\u00edch c\u00fa ph\u00e1p (parsing) JavaScript sau khi n\u1ed9i dung c\u1ee7a trang \u0111\u01b0\u1ee3c t\u1ea3i xong (hay n\u00f3i c\u00e1ch kh\u00e1c JavaScript s\u1ebd kh\u00f4ng l\u00e0m \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn t\u1ed1c \u0111\u1ed9 trang ho\u1eb7c tuy\u1ebfn hi\u1ec3n th\u1ecb quan tr\u1ecdng). S\u1eed d\u1ee5ng s\u1ef1 ki\u1ec7n &#8220;onload&#8221; ch\u00fang ta g\u1ecdi &hellip;\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kiencang.net\/tri-hoan-tai-javascript\/\" \/>\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=\"2019-02-13T04:45:39+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/kiencang.net\/wp-content\/uploads\/2019\/02\/cach-tri-hoan-tai-javascript-1.png\" \/>\n\t<meta property=\"og:image:width\" content=\"860\" \/>\n\t<meta property=\"og:image:height\" content=\"451\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\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=\"9 ph\u00fat\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"L\u00e0m th\u1ebf n\u00e0o \u0111\u1ec3 tr\u00ec ho\u00e3n t\u1ea3i JavaScript &#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\/tri-hoan-tai-javascript\/","og_locale":"vi_VN","og_type":"article","og_title":"L\u00e0m th\u1ebf n\u00e0o \u0111\u1ec3 tr\u00ec ho\u00e3n t\u1ea3i JavaScript &#8226; Ki\u1ebfn c\u00e0ng","og_description":"Tr\u00ec ho\u00e3n t\u1ea3i JavaScript \u0111\u00fang c\u00e1ch l\u00e0 khi b\u1ea1n ch\u1ec9 t\u1ea3i ho\u1eb7c ph\u00e2n t\u00edch c\u00fa ph\u00e1p (parsing) JavaScript sau khi n\u1ed9i dung c\u1ee7a trang \u0111\u01b0\u1ee3c t\u1ea3i xong (hay n\u00f3i c\u00e1ch kh\u00e1c JavaScript s\u1ebd kh\u00f4ng l\u00e0m \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn t\u1ed1c \u0111\u1ed9 trang ho\u1eb7c tuy\u1ebfn hi\u1ec3n th\u1ecb quan tr\u1ecdng). S\u1eed d\u1ee5ng s\u1ef1 ki\u1ec7n &#8220;onload&#8221; ch\u00fang ta g\u1ecdi &hellip;","og_url":"https:\/\/kiencang.net\/tri-hoan-tai-javascript\/","og_site_name":"Ki\u1ebfn c\u00e0ng","article_author":"https:\/\/www.facebook.com\/anhducnguyen87\/","article_published_time":"2019-02-13T04:45:39+00:00","og_image":[{"width":860,"height":451,"url":"https:\/\/kiencang.net\/wp-content\/uploads\/2019\/02\/cach-tri-hoan-tai-javascript-1.png","type":"image\/png"}],"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":"9 ph\u00fat"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/kiencang.net\/tri-hoan-tai-javascript\/","url":"https:\/\/kiencang.net\/tri-hoan-tai-javascript\/","name":"L\u00e0m th\u1ebf n\u00e0o \u0111\u1ec3 tr\u00ec ho\u00e3n t\u1ea3i JavaScript &#8226; Ki\u1ebfn c\u00e0ng","isPartOf":{"@id":"https:\/\/kiencang.net\/#website"},"datePublished":"2019-02-13T04:45:39+00:00","dateModified":"2019-02-13T04:45:39+00:00","author":{"@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16"},"breadcrumb":{"@id":"https:\/\/kiencang.net\/tri-hoan-tai-javascript\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kiencang.net\/tri-hoan-tai-javascript\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kiencang.net\/tri-hoan-tai-javascript\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kiencang.net\/"},{"@type":"ListItem","position":2,"name":"L\u00e0m th\u1ebf n\u00e0o \u0111\u1ec3 tr\u00ec ho\u00e3n t\u1ea3i JavaScript"}]},{"@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\/12874"}],"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=12874"}],"version-history":[{"count":0,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/12874\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media\/13066"}],"wp:attachment":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media?parent=12874"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/categories?post=12874"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/tags?post=12874"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}