{"id":16863,"date":"2020-03-19T15:39:51","date_gmt":"2020-03-19T08:39:51","guid":{"rendered":"https:\/\/kiencang.net\/?p=15301"},"modified":"2020-03-19T15:39:51","modified_gmt":"2020-03-19T08:39:51","slug":"xac-dinh-javascript-ben-thu-ba-cham-website","status":"publish","type":"post","link":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","title":{"rendered":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website"},"content":{"rendered":"\n
Ghi ch\u00fa c\u1ee7a ng\u01b0\u1eddi d\u1ecbch: B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm<\/a>. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba. Th\u1ef1c h\u00e0nh th\u00ec v\u1ed1n ph\u1ee5 thu\u1ed9c v\u00e0o c\u00f4ng c\u1ee5, b\u00e0i n\u00e0y s\u1ebd ch\u1ec9 cho b\u1ea1n c\u00e1ch s\u1eed d\u1ee5ng c\u00f4ng c\u1ee5. Nh\u01b0ng n\u00f3 s\u1ebd v\u1eabn l\u00e0 l\u00fd thuy\u1ebft n\u1ebfu b\u1ea1n kh\u00f4ng t\u1ef1 th\u1ef1c h\u00e0nh tr\u00ean ch\u00ednh trang web c\u1ee7a b\u1ea1n! OK, b\u1eaft \u0111\u1ea7u th\u00f4i.<\/p>\n\n\n—<\/p>\n\n\nPh\u00e1t tri\u1ec3n c\u00e1c k\u1ef9 n\u0103ng ph\u00e1t hi\u1ec7n v\u1ea5n \u0111\u1ec1 v\u1ec1 hi\u1ec7u su\u1ea5t, t\u1ed1c \u0111\u1ed9 v\u1edbi c\u00f4ng c\u1ee5 Lighthouse v\u00e0 Chrome DevTools.<\/p>\n\n\nL\u00e0 ng\u01b0\u1eddi l\u1eadp tr\u00ecnh, b\u1ea1n th\u01b0\u1eddng kh\u00f4ng c\u00f3 kh\u1ea3 n\u0103ng l\u00e0m ch\u1ee7 c\u00e1ch \u0111o\u1ea1n m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba t\u1ea3i v\u1ec1<\/a>. Tr\u01b0\u1edbc khi b\u1ea1n c\u00f3 th\u1ec3 t\u1ed1i \u01b0u h\u00f3a n\u1ed9i dung thu\u1ed9c b\u00ean th\u1ee9 ba, b\u1ea1n ph\u1ea3i th\u1ef1c hi\u1ec7n m\u1ed9t s\u1ed1 c\u00f4ng vi\u1ec7c \u0111\u1ec3 ph\u00e1t hi\u1ec7n ra c\u00e1i g\u00ec \u0111ang l\u00e0m ch\u1eadm website c\u1ee7a b\u1ea1n<\/em>.<\/p>\n\n\nTrong b\u00e0i vi\u1ebft n\u00e0y, b\u1ea1n s\u1ebd \u0111\u01b0\u1ee3c h\u1ecdc c\u00e1ch s\u1eed d\u1ee5ng Lighthouse v\u00e0 Chrome DevTools \u0111\u1ec3 x\u00e1c \u0111\u1ecbnh c\u00e1c ngu\u1ed3n c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm trang. B\u00e0i vi\u1ebft t\u00ecm hi\u1ec3u c\u00e1c k\u1ef9 thu\u1eadt ng\u00e0y c\u00e0ng m\u1ea1nh m\u1ebd, \u0111em l\u1ea1i k\u1ebft qu\u1ea3 t\u1ed1t nh\u1ea5t khi k\u1ebft h\u1ee3p v\u1edbi nhau.<\/p>\n\n\n\n\n\n\n\nM\u1ee5c l\u1ee5c<\/p>\nToggle<\/span><\/path><\/svg><\/svg><\/span><\/span><\/label><\/a><\/span><\/div>\nN\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 5 ph\u00fat<\/a><\/li>S\u1eed d\u1ee5ng t\u00e0i nguy\u00ean c\u1ee7a b\u00ean th\u1ee9 ba<\/a><\/li>Gi\u1ea3m th\u1eddi gian th\u1ef1c thi JavaScript<\/a><\/li>Tr\u00e1nh t\u1ea3i tr\u1ecdng m\u1ea1ng l\u1edbn<\/a><\/li>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 15 ph\u00fat<\/a><\/li>Chrome DevTools badging (g\u1eafn huy hi\u1ec7u bi\u1ec3u t\u01b0\u1ee3ng) m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba<\/a><\/li>Panel hi\u1ec7u su\u1ea5t c\u1ee7a Chrome DevTools<\/a><\/li>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 30 ph\u00fat<\/a><\/li><\/ul><\/nav><\/div>\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 5 ph\u00fat<\/span><\/h2>\n\n\nC\u00f4ng c\u1ee5 ki\u1ec3m tra hi\u1ec7u su\u1ea5t c\u1ee7a Lighthouse gi\u00fap b\u1ea1n kh\u00e1m ph\u00e1 c\u00e1c c\u01a1 h\u1ed9i \u0111\u1ec3 t\u0103ng t\u1ed1c \u0111\u1ed9 trang. C\u00e1c \u0111o\u1ea1n m\u00e3 ch\u1eadm ch\u1ea1p c\u1ee7a b\u00ean th\u1ee9 ba c\u00f3 kh\u1ea3 n\u0103ng xu\u1ea5t hi\u1ec7n nhi\u1ec1u nh\u1ea5t trong khu v\u1ef1c Diagnostics\/Ch\u1ea9n \u0111o\u00e1n<\/em> v\u00e0 c\u00e1c ki\u1ec3m tra Reduce JavaScript excution time\/Gi\u1ea3m th\u1eddi gian th\u1ef1c thi JavaScipt<\/em> v\u00e0 Avoid enormous netword payloads\/Tr\u00e1nh t\u1ea3i tr\u1ecdng m\u1ea1ng l\u1edbn<\/em>.<\/p>\n\n\n\u0110\u1ec3 ch\u1ea1y ki\u1ec3m tra, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J <\/em>(ho\u1eb7c Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Audits<\/strong>.<\/li>Click v\u00e0o Mobile.<\/strong><\/li>Ch\u1ecdn checkbox Performance<\/strong> (B\u1ea1n c\u00f3 th\u1ec3 b\u1ecf ch\u1ecdn t\u1ea5t c\u1ea3 ph\u1ea7n checkbox c\u00f2n l\u1ea1i trong ph\u1ea7n Audits.)<\/li>Click v\u00e0o Simulated Fast 3G, 4x CPU Slowdown<\/strong> (Gi\u1ea3 l\u1eadp m\u1ea1ng 3G nhanh, l\u00e0m ch\u1eadm CPU 4 l\u1ea7n)<\/li>Ch\u1ecdn checkbox Clear Storage<\/strong>.<\/li>Click Ch\u1ea1y audits<\/strong>.<\/li><\/ol>\n\n\n<\/figure><\/div>\n\n\n\n\n\n<\/span>S\u1eed d\u1ee5ng t\u00e0i nguy\u00ean c\u1ee7a b\u00ean th\u1ee9 ba<\/span><\/h2>\n\n\nPh\u1ea7n ki\u1ec3m tra s\u1eed d\u1ee5ng t\u00e0i nguy\u00ean c\u1ee7a b\u00ean th\u1ee9 ba<\/strong> c\u1ee7a Lighthouse cho th\u1ea5y m\u1ed9t danh s\u00e1ch c\u00e1c nh\u00e0 cung c\u1ea5p c\u1ee7a b\u00ean th\u1ee9 ba m\u00e0 trang \u0111ang s\u1eed d\u1ee5ng. C\u00e1i nh\u00ecn t\u1ed5ng quan n\u00e0y c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n hi\u1ec3u r\u00f5 h\u01a1n b\u1ee9c tranh to\u00e0n c\u1ea3nh v\u00e0 x\u00e1c \u0111\u1ecbnh m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba b\u1ecb d\u01b0 th\u1eeba (redundant). Ki\u1ec3m tra c\u00f3 s\u1eb5n trong c\u00e1c extension (ph\u1ea7n m\u1edf r\u1ed9ng) c\u1ee7a Lighthouse<\/a> v\u00e0 s\u1ebd s\u1edbm \u0111\u01b0\u1ee3c th\u00eam v\u00e0o DevTools trong Chrome 77. <\/p>\n\n\nT\u00ean c\u00e1c nh\u00e0 cung c\u1ea5p c\u1ee7a b\u00ean th\u1ee9 ba \u0111\u01b0\u1ee3c t\u1ea1o ra b\u1eb1ng ch\u1ee9c n\u0103ng Startup generator. <\/figcaption><\/figure><\/div>\n\n\n\n\n\n<\/span>Gi\u1ea3m th\u1eddi gian th\u1ef1c thi JavaScript<\/span><\/h2>\n\n\nKi\u1ec3m tra Gi\u1ea3m th\u1eddi gian th\u1ef1c thi JavaScript<\/a> \/ Reduce JavaScript execution time<\/em> c\u1ee7a Lighthouse l\u00e0m n\u1ed5i b\u1eadt c\u00e1c m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba m\u1ea5t nhi\u1ec1u th\u1eddi gian \u0111\u1ec3 ph\u00e2n t\u00edch c\u00fa ph\u00e1p (parse), bi\u00ean d\u1ecbch (compile) ho\u1eb7c \u0111\u00e1nh gi\u00e1 (evaluate). Ch\u1ecdn checkbox Show 3rd-party resources<\/strong> (hi\u1ec3n th\u1ecb c\u00e1c t\u00e0i nguy\u00ean c\u1ee7a b\u00ean th\u1ee9 ba) \u0111\u1ec3 ph\u00e1t hi\u1ec7n c\u00e1c \u0111o\u1ea1n m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba g\u00e2y \u00e1p l\u1ef1c th\u1eddi gian l\u00ean CPU.<\/p>\n\n\n<\/figure><\/div>\n\n\n\n\n\n<\/span>Tr\u00e1nh t\u1ea3i tr\u1ecdng m\u1ea1ng l\u1edbn<\/span><\/h2>\n\n\nKi\u1ec3m tra Avoid enormous network payloads \/ Tr\u00e1nh t\u1ea3i tr\u1ecdng m\u1ea1ng l\u1edbn<\/em> x\u00e1c \u0111\u1ecbnh c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng-bao g\u1ed3m nh\u1eefng t\u00e0i nguy\u00ean t\u1eeb b\u00ean th\u1ee9 ba-c\u00e1i c\u00f3 th\u1ec3 l\u00e0m ch\u1eadm th\u1eddi gian t\u1ea3i c\u1ee7a trang. Ki\u1ec3m tra s\u1ebd \u0111\u01b0a ra c\u00e1c c\u1ea3nh b\u00e1o khi t\u1ea3i tr\u1ecdng m\u1ea1ng v\u01b0\u1ee3t qu\u00e1 4000 KB.<\/p>\n\n\n<\/figure><\/div>\n\n\n\n\n\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 15 ph\u00fat<\/span><\/h2>\n\n\nKi\u1ec3m tra c\u1ee7a Lighthouse ch\u1ec9 ph\u00e1t hi\u1ec7n c\u00e1c v\u1ea5n \u0111\u1ec1 nghi\u00eam tr\u1ecdng nh\u1ea5t v\u1ec1 t\u1ed1c \u0111\u1ed9, v\u00ec th\u1ebf b\u1ea1n c\u00f3 th\u1ec3 c\u00f3 nh\u1eefng c\u1ea3i ti\u1ebfn th\u00eam n\u1eefa ngay c\u1ea3 khi trang c\u1ee7a b\u1ea1n v\u01b0\u1ee3t qua t\u1ea5t c\u1ea3 c\u00e1c b\u00e0i ki\u1ec3m tra. C\u00e1c panel Chrome DevTools Network v\u00e0 Performance c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh c\u00e1c \u0111o\u1ea1n m\u00e3 g\u00e2y ch\u1eadm. <\/p>\n\n\n\n\n\n<\/span>Chrome DevTools badging (g\u1eafn huy hi\u1ec7u bi\u1ec3u t\u01b0\u1ee3ng) m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba<\/span><\/h2>\n\n\nDevTools c\u00f3 th\u1ec3 highlight (l\u00e0m n\u1ed5i b\u1eadt) c\u00e1c \u0111o\u1ea1n m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba theo t\u00ean c\u1ee7a nh\u00e0 cung c\u1ea5p trong panel Network<\/strong>. Ch\u1ee9c n\u0103ng n\u00e0y c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba n\u00e0o t\u1ea1o ra y\u00eau c\u1ea7u tr\u00ean trang v\u00e0 bi\u1ebft h\u1ecd \u0111ang l\u00e0m \u0111i\u1ec1u g\u00ec.<\/p>\n\n\n\u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng badge cho b\u00ean th\u1ee9 ba, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Nh\u1ea5n Control+Shift+P<\/em> (ho\u1eb7c Command+Shift+P<\/em> tr\u00ean Mac) \u0111\u1ec3 b\u1eadt menu Command<\/strong>.<\/li>Nh\u1eadp Show third party badges<\/em> v\u00e0o box<\/li><\/ol>\n\n\nGi\u1edd b\u1ea1n c\u00f3 th\u1ec3 th\u1ea5y badges c\u1ee7a b\u00ean th\u1ee9 ba tr\u00ean b\u1ea5t k\u1ef3 trang n\u00e0o b\u1ea1n gh\u00e9 th\u0103m. \u0110\u1ec3 ki\u1ec3m tra \u0111i\u1ec1u n\u00e0y, h\u00e3y th\u1eed truy c\u1eadp trang https:\/\/developers.google.com\/web\/<\/a><\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean Mac) \u0111\u1ec3 m\u1edf DevTools<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Ch\u1ecdn checkbok Disable cache<\/strong> (v\u00f4 hi\u1ec7u h\u00f3a cache).<\/li>T\u1ea3i l\u1ea1i trang.<\/li><\/ol>\n\n\nGi\u1edd b\u1ea1n s\u1ebd th\u1ea5y m\u1ed9t badge b\u00ean c\u1ea1nh t\u1eebng m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba. Click v\u00e0o badge \u0111\u1ec3 hi\u1ec3n th\u1ecb nhi\u1ec1u th\u00f4ng tin h\u01a1n v\u1ec1 \u0111o\u1ea1n m\u00e3 \u0111\u00f3.<\/p>\n\n\n<\/figure><\/div>\n\n\n\u0110\u1ec3 c\u00f3 th\u00eam th\u00f4ng tin v\u1ec1 \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba l\u00ean hi\u1ec7u su\u1ea5t, b\u1ea1n h\u00e3y truy c\u1eadp v\u00e0o trang: https:\/\/www.thirdpartyweb.today\/<\/a>. N\u00f3 s\u1eed d\u1ee5ng d\u1eef li\u1ec7u HTTP Archive<\/a> \u0111\u1ec3 \u0111\u01b0a ra c\u00e1i nh\u00ecn t\u1ed5ng quan v\u1ec1 c\u00e1c nh\u00e0 cung c\u1ea5p c\u1ee7a b\u00ean th\u1ee9 ba v\u00e0 \u1ea3nh h\u01b0\u1edfng c\u1ee7a ch\u00fang l\u00ean web.<\/p>\n\n\n\n\n\n<\/span>Panel hi\u1ec7u su\u1ea5t c\u1ee7a Chrome DevTools<\/span><\/h2>\n\n\nM\u1ed9t khi \u0111\u01b0\u1ee3c b\u1eadt, badge m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba c\u0169ng xu\u1ea5t hi\u1ec7n trong panel Performance<\/strong> DevTools. Panel Performance ghi l\u1ea1i m\u1ed9t b\u1ea3ng waterfall<\/a> \u0111\u1ea1i di\u1ec7n, cho bi\u1ebft trang c\u1ee7a b\u1ea1n \u0111ang ti\u00eau t\u1ed1n th\u1eddi gian \u1edf nh\u1eefng ph\u1ea7n n\u00e0o v\u00e0 c\u00e1ch gi\u00fap b\u1ea1n quan s\u00e1t hi\u1ec7u su\u1ea5t m\u1ed9t c\u00e1ch chi ti\u1ebft.<\/p>\n\n\n\u0110\u1ec3 ghi l\u1ea1i c\u00e1ch trang t\u1ea3i, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Performance<\/strong>.<\/li>Click v\u00e0o n\u00fat Start profiling and reload page<\/strong>.<\/li><\/ol>\n\n\n\u0110\u1ec3 xem c\u00e1c ho\u1ea1t \u0111\u1ed9ng xu\u1ea5t hi\u1ec7n trong lu\u1ed3ng ch\u00ednh c\u1ee7a trang<\/a>, b\u1ea1n h\u00e3y ki\u1ec3m tra khu v\u1ef1c Main<\/strong>. C\u00e1c t\u00e1c v\u1ee5 d\u00e0i (long task)<\/strong> \u0111\u01b0\u1ee3c g\u00e1n nh\u00e3n b\u1eb1ng c\u1ea3nh b\u00e1o c\u1edd m\u00e0u \u0111\u1ecf, \u0111\u1ec3 bi\u1ebft chi ti\u1ebft h\u01a1n v\u1ec1 th\u1eddi gian th\u1ef1c thi, b\u1ea1n h\u00e3y hover qua ch\u00fang.<\/p>\n\n\nThu\u1eadt ng\u1eef quan tr\u1ecdng<\/strong>: M\u1ed9t t\u00e1c v\u1ee5 d\u00e0i<\/a> l\u00e0 m\u1ed9t \u0111o\u1ea1n m\u00e3 JavaScript chi\u1ebfm lu\u1ed3ng ch\u00ednh t\u1eeb 50 ms tr\u1edf l\u00ean, \u0111i\u1ec1u n\u00e0y t\u00e1c \u0111\u1ed9ng l\u00ean nh\u1eadn th\u1ee9c c\u1ee7a ng\u01b0\u1eddi truy c\u1eadp r\u1eb1ng UI (giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng) b\u1ecb \u0111\u01a1 (freeze).<\/p>\n\n\n<\/figure><\/div>\n\n\nB\u1ea1n c\u0169ng c\u00f3 th\u1ec3 s\u1eafp x\u1ebfp c\u00e1c t\u00e1c v\u1ee5 JavaScript theo th\u1eddi gian th\u1ef1c thi \u0111\u1ec3 x\u00e1c \u0111\u1ecbnh t\u00e0i nguy\u00ean b\u00ean th\u1ee9 ba n\u00e0o l\u00e0 ch\u1eadm nh\u1ea5t:<\/p>\n\n\nT\u1ea1i v\u1ecb tr\u00ed cu\u1ed1i c\u00f9ng c\u1ee7a panel Performance<\/strong>, click v\u00e0o tab Bottom-Up<\/strong>.<\/li>Trong danh s\u00e1ch x\u1ed5 xu\u1ed1ng \u0111\u00e3 \u0111\u01b0\u1ee3c nh\u00f3m l\u1ea1i, b\u1ea1n ch\u1ecdn Group by Product<\/strong> (nh\u00f3m theo s\u1ea3n ph\u1ea9m)<\/li><\/ol>\n\n\n<\/figure>\n\n\n\n\n\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 30 ph\u00fat<\/span><\/h2>\n\n\nChrome DevTools v\u1edbi t\u00ednh n\u0103ng ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng (network request blocking) cho ph\u00e9p b\u1ea1n quan s\u00e1t h\u00e0nh vi c\u1ee7a trang khi m\u1ed9t \u0111o\u1ea1n JavaScript, CSS ho\u1eb7c m\u1ed9t ngu\u1ed3n c\u1ee5 th\u1ec3 kh\u00e1c kh\u00f4ng \u0111\u01b0\u1ee3c t\u1ea3i v\u1ec1. Sau khi b\u1ea1n \u0111\u00e3 x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba m\u00e0 b\u1ea1n nghi ng\u1edd \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn hi\u1ec7u su\u1ea5t, b\u1ea1n c\u1ea7n ti\u1ebfn h\u00e0nh ki\u1ec3m tra xem th\u1eddi gian t\u1ea3i s\u1ebd thay \u0111\u1ed5i nh\u01b0 th\u1ebf n\u00e0o b\u1eb1ng c\u00e1ch ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u c\u1ee7a nh\u1eefng \u0111o\u1ea1n JavaScript \u0111\u00f3.<\/p>\n\n\n \u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng ch\u1eb7n y\u00eau c\u1ea7u (request blocking), h\u00e3y l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> ho\u1eb7c (Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Chu\u1ed9t ph\u1ea3i v\u00e0o b\u1ea5t c\u1ee9 y\u00eau c\u1ea7u n\u00e0o trong panel Network<\/strong>.<\/li>Ch\u1ecdn Block request URL<\/strong> (ch\u1eb7n URL y\u00eau c\u1ea7u).<\/li><\/ol>\n\n\n<\/figure><\/div>\n\n\nTab Request blocking<\/strong> s\u1ebd xu\u1ea5t hi\u1ec7n trong DevTools drawer. B\u1ea1n c\u00f3 th\u1ec3 qu\u1ea3n l\u00fd c\u00e1c y\u00eau c\u1ea7u \u0111\u00e3 b\u1ecb ch\u1eb7n \u1edf \u0111\u00f3.<\/p>\n\n\n\u0110\u1ec3 \u0111o \u0111\u1ea1c \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba:<\/p>\n\n\n\u0110o \u0111\u1ea1c l\u01b0\u1ee3ng th\u1eddi gian trang b\u1ea1n c\u1ea7n \u0111\u1ec3 t\u1ea3i v\u1ec1 b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng panel Network. \u0110\u1ec3 gi\u1ea3 l\u1eadp c\u00e1c \u0111i\u1ec1u ki\u1ec7n c\u1ee7a th\u1ebf gi\u1edbi th\u1ef1c, h\u00e3y b\u1eadt network throttling (\u0111i\u1ec1u ch\u1ec9nh m\u1ea1ng) v\u00e0 CPU throttling (\u0111i\u1ec1u ch\u1ec9nh CPU). Tr\u00ean c\u00e1c k\u1ebft n\u1ed1i nhanh v\u00e0 ph\u1ea7n c\u1ee9ng c\u1ee7a m\u00e1y b\u00e0n, \u1ea3nh h\u01b0\u1edfng c\u1ee7a c\u00e1c JavaScript n\u1eb7ng n\u1ec1 c\u00f3 th\u1ec3 ho\u00e0n to\u00e0n kh\u00e1c tr\u00ean thi\u1ebft b\u1ecb di \u0111\u1ed9ng.)<\/li>Ch\u1eb7n c\u00e1c URL ho\u1eb7c t\u00ean mi\u1ec1n \u0111\u1ea1i di\u1ec7n cho JavaScript c\u1ee7a b\u00ean th\u1ee9 b\u1ea1n m\u00e0 b\u1ea1n tin r\u1eb1ng n\u00f3 l\u00e0 v\u1ea5n \u0111\u1ec1.<\/li>T\u1ea3i l\u1ea1i trang v\u00e0 \u0111o \u0111\u1ea1c l\u1ea1i th\u1eddi gian n\u00f3 c\u1ea7n \u0111\u1ec3 t\u1ea3i m\u00e0 kh\u00f4ng c\u1ea7n c\u00e1c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba b\u1ecb ch\u1eb7n.<\/li><\/ol>\n\n\nB\u1ea1n ch\u1eafc h\u1eb3n hy v\u1ecdng th\u1ea5y t\u1ed1c \u0111\u1ed9 \u0111\u01b0\u1ee3c c\u1ea3i thi\u1ec7n, nh\u01b0ng thi tho\u1ea3ng vi\u1ec7c ch\u1eb7n t\u1ec7p l\u1ec7nh c\u1ee7a b\u00ean th\u1ee9 ba c\u00f3 th\u1ec3 kh\u00f4ng c\u00f3 \u0111\u01b0\u1ee3c \u1ea3nh h\u01b0\u1edfng nh\u01b0 b\u1ea1n mong ch\u1edd. N\u1ebfu b\u1ea1n r\u01a1i v\u00e0o tr\u01b0\u1eddng h\u1ee3p \u0111\u00f3, h\u00e3y gi\u1ea3m danh s\u00e1ch c\u00e1c URL b\u1ecb ch\u1eb7n cho \u0111\u1ebfn khi b\u1ea1n c\u00f4 l\u1eadp \u0111\u01b0\u1ee3c m\u1ed9t c\u00e1i l\u00e0 nguy\u00ean nh\u00e2n g\u00e2y ch\u1eadm ch\u1ea1p.<\/p>\n\n\nL\u01b0u \u00fd r\u1eb1ng b\u1ea1n c\u1ea7n th\u1ee9c hi\u1ec7n \u00edt nh\u1ea5t l\u00e0 ba l\u1ea7n ch\u1ea1y \u0111\u1ec3 \u0111o \u0111\u1ea1c v\u00e0 xem x\u00e9t gi\u00e1 tr\u1ecb trung b\u00ecnh, \u0111i\u1ec1u \u0111\u00f3 s\u1ebd cho ra gi\u00e1 tr\u1ecb \u1ed5n \u0111\u1ecbnh h\u01a1n. C\u00e1c n\u1ed9i dung c\u1ee7a b\u00ean th\u1ee9 ba th\u1ec9nh tho\u1ea3ng s\u1ebd k\u00e9o c\u00e1c t\u00e0i nguy\u00ean kh\u00e1c nhau m\u1ed7i khi t\u1ea3i trang, c\u00e1ch ti\u1ebfp c\u1eadn n\u00e0y cho ph\u00e9p b\u1ea1n c\u00f3 \u0111\u01b0\u1ee3c \u01b0\u1edbc t\u00ednh th\u1ef1c t\u1ebf h\u01a1n. DevTools gi\u1edd h\u1ed7 tr\u1ee3 c\u00f9ng l\u00fac nhi\u1ec1u b\u1ea3n ghi trong panel Performance<\/strong>, gi\u00fap b\u1ea1n l\u00e0m \u0111i\u1ec1u n\u00e0y d\u1ec5 d\u00e0ng h\u01a1n m\u1ed9t ch\u00fat.<\/p>\n\n\n(D\u1ecbch t\u1eeb b\u00e0i vi\u1ebft: Identify slow third-party JavaScript, t\u00e1c gi\u1ea3: Milica Mihajlija, trang web[.]dev)<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"Ghi ch\u00fa c\u1ee7a ng\u01b0\u1eddi d\u1ecbch: B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba. …<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[272],"tags":[],"yoast_head":"\nC\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng<\/title>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\t\n\t\n\t\n","yoast_head_json":{"title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_locale":"vi_VN","og_type":"article","og_title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","og_description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","og_url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_site_name":"Ki\u1ebfn c\u00e0ng","article_author":"https:\/\/www.facebook.com\/anhducnguyen87\/","article_published_time":"2020-03-19T08:39:51+00:00","og_image":[{"url":"https:\/\/kiencang.net\/wp-content\/uploads\/2020\/03\/audits-panel-767x1024.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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","isPartOf":{"@id":"https:\/\/kiencang.net\/#website"},"datePublished":"2020-03-19T08:39:51+00:00","dateModified":"2020-03-19T08:39:51+00:00","author":{"@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16"},"description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","breadcrumb":{"@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kiencang.net\/"},{"@type":"ListItem","position":2,"name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm 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\/16863"}],"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=16863"}],"version-history":[{"count":0,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/16863\/revisions"}],"wp:attachment":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media?parent=16863"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/categories?post=16863"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/tags?post=16863"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
—<\/p>\n\n\n
Ph\u00e1t tri\u1ec3n c\u00e1c k\u1ef9 n\u0103ng ph\u00e1t hi\u1ec7n v\u1ea5n \u0111\u1ec1 v\u1ec1 hi\u1ec7u su\u1ea5t, t\u1ed1c \u0111\u1ed9 v\u1edbi c\u00f4ng c\u1ee5 Lighthouse v\u00e0 Chrome DevTools.<\/p>\n\n\n
L\u00e0 ng\u01b0\u1eddi l\u1eadp tr\u00ecnh, b\u1ea1n th\u01b0\u1eddng kh\u00f4ng c\u00f3 kh\u1ea3 n\u0103ng l\u00e0m ch\u1ee7 c\u00e1ch \u0111o\u1ea1n m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba t\u1ea3i v\u1ec1<\/a>. Tr\u01b0\u1edbc khi b\u1ea1n c\u00f3 th\u1ec3 t\u1ed1i \u01b0u h\u00f3a n\u1ed9i dung thu\u1ed9c b\u00ean th\u1ee9 ba, b\u1ea1n ph\u1ea3i th\u1ef1c hi\u1ec7n m\u1ed9t s\u1ed1 c\u00f4ng vi\u1ec7c \u0111\u1ec3 ph\u00e1t hi\u1ec7n ra c\u00e1i g\u00ec \u0111ang l\u00e0m ch\u1eadm website c\u1ee7a b\u1ea1n<\/em>.<\/p>\n\n\nTrong b\u00e0i vi\u1ebft n\u00e0y, b\u1ea1n s\u1ebd \u0111\u01b0\u1ee3c h\u1ecdc c\u00e1ch s\u1eed d\u1ee5ng Lighthouse v\u00e0 Chrome DevTools \u0111\u1ec3 x\u00e1c \u0111\u1ecbnh c\u00e1c ngu\u1ed3n c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm trang. B\u00e0i vi\u1ebft t\u00ecm hi\u1ec3u c\u00e1c k\u1ef9 thu\u1eadt ng\u00e0y c\u00e0ng m\u1ea1nh m\u1ebd, \u0111em l\u1ea1i k\u1ebft qu\u1ea3 t\u1ed1t nh\u1ea5t khi k\u1ebft h\u1ee3p v\u1edbi nhau.<\/p>\n\n\n\n\n\n\n\nM\u1ee5c l\u1ee5c<\/p>\nToggle<\/span><\/path><\/svg><\/svg><\/span><\/span><\/label><\/a><\/span><\/div>\nN\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 5 ph\u00fat<\/a><\/li>S\u1eed d\u1ee5ng t\u00e0i nguy\u00ean c\u1ee7a b\u00ean th\u1ee9 ba<\/a><\/li>Gi\u1ea3m th\u1eddi gian th\u1ef1c thi JavaScript<\/a><\/li>Tr\u00e1nh t\u1ea3i tr\u1ecdng m\u1ea1ng l\u1edbn<\/a><\/li>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 15 ph\u00fat<\/a><\/li>Chrome DevTools badging (g\u1eafn huy hi\u1ec7u bi\u1ec3u t\u01b0\u1ee3ng) m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba<\/a><\/li>Panel hi\u1ec7u su\u1ea5t c\u1ee7a Chrome DevTools<\/a><\/li>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 30 ph\u00fat<\/a><\/li><\/ul><\/nav><\/div>\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 5 ph\u00fat<\/span><\/h2>\n\n\nC\u00f4ng c\u1ee5 ki\u1ec3m tra hi\u1ec7u su\u1ea5t c\u1ee7a Lighthouse gi\u00fap b\u1ea1n kh\u00e1m ph\u00e1 c\u00e1c c\u01a1 h\u1ed9i \u0111\u1ec3 t\u0103ng t\u1ed1c \u0111\u1ed9 trang. C\u00e1c \u0111o\u1ea1n m\u00e3 ch\u1eadm ch\u1ea1p c\u1ee7a b\u00ean th\u1ee9 ba c\u00f3 kh\u1ea3 n\u0103ng xu\u1ea5t hi\u1ec7n nhi\u1ec1u nh\u1ea5t trong khu v\u1ef1c Diagnostics\/Ch\u1ea9n \u0111o\u00e1n<\/em> v\u00e0 c\u00e1c ki\u1ec3m tra Reduce JavaScript excution time\/Gi\u1ea3m th\u1eddi gian th\u1ef1c thi JavaScipt<\/em> v\u00e0 Avoid enormous netword payloads\/Tr\u00e1nh t\u1ea3i tr\u1ecdng m\u1ea1ng l\u1edbn<\/em>.<\/p>\n\n\n\u0110\u1ec3 ch\u1ea1y ki\u1ec3m tra, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J <\/em>(ho\u1eb7c Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Audits<\/strong>.<\/li>Click v\u00e0o Mobile.<\/strong><\/li>Ch\u1ecdn checkbox Performance<\/strong> (B\u1ea1n c\u00f3 th\u1ec3 b\u1ecf ch\u1ecdn t\u1ea5t c\u1ea3 ph\u1ea7n checkbox c\u00f2n l\u1ea1i trong ph\u1ea7n Audits.)<\/li>Click v\u00e0o Simulated Fast 3G, 4x CPU Slowdown<\/strong> (Gi\u1ea3 l\u1eadp m\u1ea1ng 3G nhanh, l\u00e0m ch\u1eadm CPU 4 l\u1ea7n)<\/li>Ch\u1ecdn checkbox Clear Storage<\/strong>.<\/li>Click Ch\u1ea1y audits<\/strong>.<\/li><\/ol>\n\n\n<\/figure><\/div>\n\n\n\n\n\n<\/span>S\u1eed d\u1ee5ng t\u00e0i nguy\u00ean c\u1ee7a b\u00ean th\u1ee9 ba<\/span><\/h2>\n\n\nPh\u1ea7n ki\u1ec3m tra s\u1eed d\u1ee5ng t\u00e0i nguy\u00ean c\u1ee7a b\u00ean th\u1ee9 ba<\/strong> c\u1ee7a Lighthouse cho th\u1ea5y m\u1ed9t danh s\u00e1ch c\u00e1c nh\u00e0 cung c\u1ea5p c\u1ee7a b\u00ean th\u1ee9 ba m\u00e0 trang \u0111ang s\u1eed d\u1ee5ng. C\u00e1i nh\u00ecn t\u1ed5ng quan n\u00e0y c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n hi\u1ec3u r\u00f5 h\u01a1n b\u1ee9c tranh to\u00e0n c\u1ea3nh v\u00e0 x\u00e1c \u0111\u1ecbnh m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba b\u1ecb d\u01b0 th\u1eeba (redundant). Ki\u1ec3m tra c\u00f3 s\u1eb5n trong c\u00e1c extension (ph\u1ea7n m\u1edf r\u1ed9ng) c\u1ee7a Lighthouse<\/a> v\u00e0 s\u1ebd s\u1edbm \u0111\u01b0\u1ee3c th\u00eam v\u00e0o DevTools trong Chrome 77. <\/p>\n\n\nT\u00ean c\u00e1c nh\u00e0 cung c\u1ea5p c\u1ee7a b\u00ean th\u1ee9 ba \u0111\u01b0\u1ee3c t\u1ea1o ra b\u1eb1ng ch\u1ee9c n\u0103ng Startup generator. <\/figcaption><\/figure><\/div>\n\n\n\n\n\n<\/span>Gi\u1ea3m th\u1eddi gian th\u1ef1c thi JavaScript<\/span><\/h2>\n\n\nKi\u1ec3m tra Gi\u1ea3m th\u1eddi gian th\u1ef1c thi JavaScript<\/a> \/ Reduce JavaScript execution time<\/em> c\u1ee7a Lighthouse l\u00e0m n\u1ed5i b\u1eadt c\u00e1c m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba m\u1ea5t nhi\u1ec1u th\u1eddi gian \u0111\u1ec3 ph\u00e2n t\u00edch c\u00fa ph\u00e1p (parse), bi\u00ean d\u1ecbch (compile) ho\u1eb7c \u0111\u00e1nh gi\u00e1 (evaluate). Ch\u1ecdn checkbox Show 3rd-party resources<\/strong> (hi\u1ec3n th\u1ecb c\u00e1c t\u00e0i nguy\u00ean c\u1ee7a b\u00ean th\u1ee9 ba) \u0111\u1ec3 ph\u00e1t hi\u1ec7n c\u00e1c \u0111o\u1ea1n m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba g\u00e2y \u00e1p l\u1ef1c th\u1eddi gian l\u00ean CPU.<\/p>\n\n\n<\/figure><\/div>\n\n\n\n\n\n<\/span>Tr\u00e1nh t\u1ea3i tr\u1ecdng m\u1ea1ng l\u1edbn<\/span><\/h2>\n\n\nKi\u1ec3m tra Avoid enormous network payloads \/ Tr\u00e1nh t\u1ea3i tr\u1ecdng m\u1ea1ng l\u1edbn<\/em> x\u00e1c \u0111\u1ecbnh c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng-bao g\u1ed3m nh\u1eefng t\u00e0i nguy\u00ean t\u1eeb b\u00ean th\u1ee9 ba-c\u00e1i c\u00f3 th\u1ec3 l\u00e0m ch\u1eadm th\u1eddi gian t\u1ea3i c\u1ee7a trang. Ki\u1ec3m tra s\u1ebd \u0111\u01b0a ra c\u00e1c c\u1ea3nh b\u00e1o khi t\u1ea3i tr\u1ecdng m\u1ea1ng v\u01b0\u1ee3t qu\u00e1 4000 KB.<\/p>\n\n\n<\/figure><\/div>\n\n\n\n\n\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 15 ph\u00fat<\/span><\/h2>\n\n\nKi\u1ec3m tra c\u1ee7a Lighthouse ch\u1ec9 ph\u00e1t hi\u1ec7n c\u00e1c v\u1ea5n \u0111\u1ec1 nghi\u00eam tr\u1ecdng nh\u1ea5t v\u1ec1 t\u1ed1c \u0111\u1ed9, v\u00ec th\u1ebf b\u1ea1n c\u00f3 th\u1ec3 c\u00f3 nh\u1eefng c\u1ea3i ti\u1ebfn th\u00eam n\u1eefa ngay c\u1ea3 khi trang c\u1ee7a b\u1ea1n v\u01b0\u1ee3t qua t\u1ea5t c\u1ea3 c\u00e1c b\u00e0i ki\u1ec3m tra. C\u00e1c panel Chrome DevTools Network v\u00e0 Performance c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh c\u00e1c \u0111o\u1ea1n m\u00e3 g\u00e2y ch\u1eadm. <\/p>\n\n\n\n\n\n<\/span>Chrome DevTools badging (g\u1eafn huy hi\u1ec7u bi\u1ec3u t\u01b0\u1ee3ng) m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba<\/span><\/h2>\n\n\nDevTools c\u00f3 th\u1ec3 highlight (l\u00e0m n\u1ed5i b\u1eadt) c\u00e1c \u0111o\u1ea1n m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba theo t\u00ean c\u1ee7a nh\u00e0 cung c\u1ea5p trong panel Network<\/strong>. Ch\u1ee9c n\u0103ng n\u00e0y c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba n\u00e0o t\u1ea1o ra y\u00eau c\u1ea7u tr\u00ean trang v\u00e0 bi\u1ebft h\u1ecd \u0111ang l\u00e0m \u0111i\u1ec1u g\u00ec.<\/p>\n\n\n\u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng badge cho b\u00ean th\u1ee9 ba, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Nh\u1ea5n Control+Shift+P<\/em> (ho\u1eb7c Command+Shift+P<\/em> tr\u00ean Mac) \u0111\u1ec3 b\u1eadt menu Command<\/strong>.<\/li>Nh\u1eadp Show third party badges<\/em> v\u00e0o box<\/li><\/ol>\n\n\nGi\u1edd b\u1ea1n c\u00f3 th\u1ec3 th\u1ea5y badges c\u1ee7a b\u00ean th\u1ee9 ba tr\u00ean b\u1ea5t k\u1ef3 trang n\u00e0o b\u1ea1n gh\u00e9 th\u0103m. \u0110\u1ec3 ki\u1ec3m tra \u0111i\u1ec1u n\u00e0y, h\u00e3y th\u1eed truy c\u1eadp trang https:\/\/developers.google.com\/web\/<\/a><\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean Mac) \u0111\u1ec3 m\u1edf DevTools<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Ch\u1ecdn checkbok Disable cache<\/strong> (v\u00f4 hi\u1ec7u h\u00f3a cache).<\/li>T\u1ea3i l\u1ea1i trang.<\/li><\/ol>\n\n\nGi\u1edd b\u1ea1n s\u1ebd th\u1ea5y m\u1ed9t badge b\u00ean c\u1ea1nh t\u1eebng m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba. Click v\u00e0o badge \u0111\u1ec3 hi\u1ec3n th\u1ecb nhi\u1ec1u th\u00f4ng tin h\u01a1n v\u1ec1 \u0111o\u1ea1n m\u00e3 \u0111\u00f3.<\/p>\n\n\n<\/figure><\/div>\n\n\n\u0110\u1ec3 c\u00f3 th\u00eam th\u00f4ng tin v\u1ec1 \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba l\u00ean hi\u1ec7u su\u1ea5t, b\u1ea1n h\u00e3y truy c\u1eadp v\u00e0o trang: https:\/\/www.thirdpartyweb.today\/<\/a>. N\u00f3 s\u1eed d\u1ee5ng d\u1eef li\u1ec7u HTTP Archive<\/a> \u0111\u1ec3 \u0111\u01b0a ra c\u00e1i nh\u00ecn t\u1ed5ng quan v\u1ec1 c\u00e1c nh\u00e0 cung c\u1ea5p c\u1ee7a b\u00ean th\u1ee9 ba v\u00e0 \u1ea3nh h\u01b0\u1edfng c\u1ee7a ch\u00fang l\u00ean web.<\/p>\n\n\n\n\n\n<\/span>Panel hi\u1ec7u su\u1ea5t c\u1ee7a Chrome DevTools<\/span><\/h2>\n\n\nM\u1ed9t khi \u0111\u01b0\u1ee3c b\u1eadt, badge m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba c\u0169ng xu\u1ea5t hi\u1ec7n trong panel Performance<\/strong> DevTools. Panel Performance ghi l\u1ea1i m\u1ed9t b\u1ea3ng waterfall<\/a> \u0111\u1ea1i di\u1ec7n, cho bi\u1ebft trang c\u1ee7a b\u1ea1n \u0111ang ti\u00eau t\u1ed1n th\u1eddi gian \u1edf nh\u1eefng ph\u1ea7n n\u00e0o v\u00e0 c\u00e1ch gi\u00fap b\u1ea1n quan s\u00e1t hi\u1ec7u su\u1ea5t m\u1ed9t c\u00e1ch chi ti\u1ebft.<\/p>\n\n\n\u0110\u1ec3 ghi l\u1ea1i c\u00e1ch trang t\u1ea3i, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Performance<\/strong>.<\/li>Click v\u00e0o n\u00fat Start profiling and reload page<\/strong>.<\/li><\/ol>\n\n\n\u0110\u1ec3 xem c\u00e1c ho\u1ea1t \u0111\u1ed9ng xu\u1ea5t hi\u1ec7n trong lu\u1ed3ng ch\u00ednh c\u1ee7a trang<\/a>, b\u1ea1n h\u00e3y ki\u1ec3m tra khu v\u1ef1c Main<\/strong>. C\u00e1c t\u00e1c v\u1ee5 d\u00e0i (long task)<\/strong> \u0111\u01b0\u1ee3c g\u00e1n nh\u00e3n b\u1eb1ng c\u1ea3nh b\u00e1o c\u1edd m\u00e0u \u0111\u1ecf, \u0111\u1ec3 bi\u1ebft chi ti\u1ebft h\u01a1n v\u1ec1 th\u1eddi gian th\u1ef1c thi, b\u1ea1n h\u00e3y hover qua ch\u00fang.<\/p>\n\n\nThu\u1eadt ng\u1eef quan tr\u1ecdng<\/strong>: M\u1ed9t t\u00e1c v\u1ee5 d\u00e0i<\/a> l\u00e0 m\u1ed9t \u0111o\u1ea1n m\u00e3 JavaScript chi\u1ebfm lu\u1ed3ng ch\u00ednh t\u1eeb 50 ms tr\u1edf l\u00ean, \u0111i\u1ec1u n\u00e0y t\u00e1c \u0111\u1ed9ng l\u00ean nh\u1eadn th\u1ee9c c\u1ee7a ng\u01b0\u1eddi truy c\u1eadp r\u1eb1ng UI (giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng) b\u1ecb \u0111\u01a1 (freeze).<\/p>\n\n\n<\/figure><\/div>\n\n\nB\u1ea1n c\u0169ng c\u00f3 th\u1ec3 s\u1eafp x\u1ebfp c\u00e1c t\u00e1c v\u1ee5 JavaScript theo th\u1eddi gian th\u1ef1c thi \u0111\u1ec3 x\u00e1c \u0111\u1ecbnh t\u00e0i nguy\u00ean b\u00ean th\u1ee9 ba n\u00e0o l\u00e0 ch\u1eadm nh\u1ea5t:<\/p>\n\n\nT\u1ea1i v\u1ecb tr\u00ed cu\u1ed1i c\u00f9ng c\u1ee7a panel Performance<\/strong>, click v\u00e0o tab Bottom-Up<\/strong>.<\/li>Trong danh s\u00e1ch x\u1ed5 xu\u1ed1ng \u0111\u00e3 \u0111\u01b0\u1ee3c nh\u00f3m l\u1ea1i, b\u1ea1n ch\u1ecdn Group by Product<\/strong> (nh\u00f3m theo s\u1ea3n ph\u1ea9m)<\/li><\/ol>\n\n\n<\/figure>\n\n\n\n\n\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 30 ph\u00fat<\/span><\/h2>\n\n\nChrome DevTools v\u1edbi t\u00ednh n\u0103ng ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng (network request blocking) cho ph\u00e9p b\u1ea1n quan s\u00e1t h\u00e0nh vi c\u1ee7a trang khi m\u1ed9t \u0111o\u1ea1n JavaScript, CSS ho\u1eb7c m\u1ed9t ngu\u1ed3n c\u1ee5 th\u1ec3 kh\u00e1c kh\u00f4ng \u0111\u01b0\u1ee3c t\u1ea3i v\u1ec1. Sau khi b\u1ea1n \u0111\u00e3 x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba m\u00e0 b\u1ea1n nghi ng\u1edd \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn hi\u1ec7u su\u1ea5t, b\u1ea1n c\u1ea7n ti\u1ebfn h\u00e0nh ki\u1ec3m tra xem th\u1eddi gian t\u1ea3i s\u1ebd thay \u0111\u1ed5i nh\u01b0 th\u1ebf n\u00e0o b\u1eb1ng c\u00e1ch ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u c\u1ee7a nh\u1eefng \u0111o\u1ea1n JavaScript \u0111\u00f3.<\/p>\n\n\n \u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng ch\u1eb7n y\u00eau c\u1ea7u (request blocking), h\u00e3y l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> ho\u1eb7c (Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Chu\u1ed9t ph\u1ea3i v\u00e0o b\u1ea5t c\u1ee9 y\u00eau c\u1ea7u n\u00e0o trong panel Network<\/strong>.<\/li>Ch\u1ecdn Block request URL<\/strong> (ch\u1eb7n URL y\u00eau c\u1ea7u).<\/li><\/ol>\n\n\n<\/figure><\/div>\n\n\nTab Request blocking<\/strong> s\u1ebd xu\u1ea5t hi\u1ec7n trong DevTools drawer. B\u1ea1n c\u00f3 th\u1ec3 qu\u1ea3n l\u00fd c\u00e1c y\u00eau c\u1ea7u \u0111\u00e3 b\u1ecb ch\u1eb7n \u1edf \u0111\u00f3.<\/p>\n\n\n\u0110\u1ec3 \u0111o \u0111\u1ea1c \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba:<\/p>\n\n\n\u0110o \u0111\u1ea1c l\u01b0\u1ee3ng th\u1eddi gian trang b\u1ea1n c\u1ea7n \u0111\u1ec3 t\u1ea3i v\u1ec1 b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng panel Network. \u0110\u1ec3 gi\u1ea3 l\u1eadp c\u00e1c \u0111i\u1ec1u ki\u1ec7n c\u1ee7a th\u1ebf gi\u1edbi th\u1ef1c, h\u00e3y b\u1eadt network throttling (\u0111i\u1ec1u ch\u1ec9nh m\u1ea1ng) v\u00e0 CPU throttling (\u0111i\u1ec1u ch\u1ec9nh CPU). Tr\u00ean c\u00e1c k\u1ebft n\u1ed1i nhanh v\u00e0 ph\u1ea7n c\u1ee9ng c\u1ee7a m\u00e1y b\u00e0n, \u1ea3nh h\u01b0\u1edfng c\u1ee7a c\u00e1c JavaScript n\u1eb7ng n\u1ec1 c\u00f3 th\u1ec3 ho\u00e0n to\u00e0n kh\u00e1c tr\u00ean thi\u1ebft b\u1ecb di \u0111\u1ed9ng.)<\/li>Ch\u1eb7n c\u00e1c URL ho\u1eb7c t\u00ean mi\u1ec1n \u0111\u1ea1i di\u1ec7n cho JavaScript c\u1ee7a b\u00ean th\u1ee9 b\u1ea1n m\u00e0 b\u1ea1n tin r\u1eb1ng n\u00f3 l\u00e0 v\u1ea5n \u0111\u1ec1.<\/li>T\u1ea3i l\u1ea1i trang v\u00e0 \u0111o \u0111\u1ea1c l\u1ea1i th\u1eddi gian n\u00f3 c\u1ea7n \u0111\u1ec3 t\u1ea3i m\u00e0 kh\u00f4ng c\u1ea7n c\u00e1c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba b\u1ecb ch\u1eb7n.<\/li><\/ol>\n\n\nB\u1ea1n ch\u1eafc h\u1eb3n hy v\u1ecdng th\u1ea5y t\u1ed1c \u0111\u1ed9 \u0111\u01b0\u1ee3c c\u1ea3i thi\u1ec7n, nh\u01b0ng thi tho\u1ea3ng vi\u1ec7c ch\u1eb7n t\u1ec7p l\u1ec7nh c\u1ee7a b\u00ean th\u1ee9 ba c\u00f3 th\u1ec3 kh\u00f4ng c\u00f3 \u0111\u01b0\u1ee3c \u1ea3nh h\u01b0\u1edfng nh\u01b0 b\u1ea1n mong ch\u1edd. N\u1ebfu b\u1ea1n r\u01a1i v\u00e0o tr\u01b0\u1eddng h\u1ee3p \u0111\u00f3, h\u00e3y gi\u1ea3m danh s\u00e1ch c\u00e1c URL b\u1ecb ch\u1eb7n cho \u0111\u1ebfn khi b\u1ea1n c\u00f4 l\u1eadp \u0111\u01b0\u1ee3c m\u1ed9t c\u00e1i l\u00e0 nguy\u00ean nh\u00e2n g\u00e2y ch\u1eadm ch\u1ea1p.<\/p>\n\n\nL\u01b0u \u00fd r\u1eb1ng b\u1ea1n c\u1ea7n th\u1ee9c hi\u1ec7n \u00edt nh\u1ea5t l\u00e0 ba l\u1ea7n ch\u1ea1y \u0111\u1ec3 \u0111o \u0111\u1ea1c v\u00e0 xem x\u00e9t gi\u00e1 tr\u1ecb trung b\u00ecnh, \u0111i\u1ec1u \u0111\u00f3 s\u1ebd cho ra gi\u00e1 tr\u1ecb \u1ed5n \u0111\u1ecbnh h\u01a1n. C\u00e1c n\u1ed9i dung c\u1ee7a b\u00ean th\u1ee9 ba th\u1ec9nh tho\u1ea3ng s\u1ebd k\u00e9o c\u00e1c t\u00e0i nguy\u00ean kh\u00e1c nhau m\u1ed7i khi t\u1ea3i trang, c\u00e1ch ti\u1ebfp c\u1eadn n\u00e0y cho ph\u00e9p b\u1ea1n c\u00f3 \u0111\u01b0\u1ee3c \u01b0\u1edbc t\u00ednh th\u1ef1c t\u1ebf h\u01a1n. DevTools gi\u1edd h\u1ed7 tr\u1ee3 c\u00f9ng l\u00fac nhi\u1ec1u b\u1ea3n ghi trong panel Performance<\/strong>, gi\u00fap b\u1ea1n l\u00e0m \u0111i\u1ec1u n\u00e0y d\u1ec5 d\u00e0ng h\u01a1n m\u1ed9t ch\u00fat.<\/p>\n\n\n(D\u1ecbch t\u1eeb b\u00e0i vi\u1ebft: Identify slow third-party JavaScript, t\u00e1c gi\u1ea3: Milica Mihajlija, trang web[.]dev)<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"Ghi ch\u00fa c\u1ee7a ng\u01b0\u1eddi d\u1ecbch: B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba. …<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[272],"tags":[],"yoast_head":"\nC\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng<\/title>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\t\n\t\n\t\n","yoast_head_json":{"title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_locale":"vi_VN","og_type":"article","og_title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","og_description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","og_url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_site_name":"Ki\u1ebfn c\u00e0ng","article_author":"https:\/\/www.facebook.com\/anhducnguyen87\/","article_published_time":"2020-03-19T08:39:51+00:00","og_image":[{"url":"https:\/\/kiencang.net\/wp-content\/uploads\/2020\/03\/audits-panel-767x1024.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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","isPartOf":{"@id":"https:\/\/kiencang.net\/#website"},"datePublished":"2020-03-19T08:39:51+00:00","dateModified":"2020-03-19T08:39:51+00:00","author":{"@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16"},"description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","breadcrumb":{"@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kiencang.net\/"},{"@type":"ListItem","position":2,"name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm 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\/16863"}],"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=16863"}],"version-history":[{"count":0,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/16863\/revisions"}],"wp:attachment":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media?parent=16863"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/categories?post=16863"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/tags?post=16863"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
Trong b\u00e0i vi\u1ebft n\u00e0y, b\u1ea1n s\u1ebd \u0111\u01b0\u1ee3c h\u1ecdc c\u00e1ch s\u1eed d\u1ee5ng Lighthouse v\u00e0 Chrome DevTools \u0111\u1ec3 x\u00e1c \u0111\u1ecbnh c\u00e1c ngu\u1ed3n c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm trang. B\u00e0i vi\u1ebft t\u00ecm hi\u1ec3u c\u00e1c k\u1ef9 thu\u1eadt ng\u00e0y c\u00e0ng m\u1ea1nh m\u1ebd, \u0111em l\u1ea1i k\u1ebft qu\u1ea3 t\u1ed1t nh\u1ea5t khi k\u1ebft h\u1ee3p v\u1edbi nhau.<\/p>\n\n\n
M\u1ee5c l\u1ee5c<\/p>\nToggle<\/span><\/path><\/svg><\/svg><\/span><\/span><\/label><\/a><\/span><\/div>\nN\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 5 ph\u00fat<\/a><\/li>S\u1eed d\u1ee5ng t\u00e0i nguy\u00ean c\u1ee7a b\u00ean th\u1ee9 ba<\/a><\/li>Gi\u1ea3m th\u1eddi gian th\u1ef1c thi JavaScript<\/a><\/li>Tr\u00e1nh t\u1ea3i tr\u1ecdng m\u1ea1ng l\u1edbn<\/a><\/li>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 15 ph\u00fat<\/a><\/li>Chrome DevTools badging (g\u1eafn huy hi\u1ec7u bi\u1ec3u t\u01b0\u1ee3ng) m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba<\/a><\/li>Panel hi\u1ec7u su\u1ea5t c\u1ee7a Chrome DevTools<\/a><\/li>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 30 ph\u00fat<\/a><\/li><\/ul><\/nav><\/div>\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 5 ph\u00fat<\/span><\/h2>\n\n\nC\u00f4ng c\u1ee5 ki\u1ec3m tra hi\u1ec7u su\u1ea5t c\u1ee7a Lighthouse gi\u00fap b\u1ea1n kh\u00e1m ph\u00e1 c\u00e1c c\u01a1 h\u1ed9i \u0111\u1ec3 t\u0103ng t\u1ed1c \u0111\u1ed9 trang. C\u00e1c \u0111o\u1ea1n m\u00e3 ch\u1eadm ch\u1ea1p c\u1ee7a b\u00ean th\u1ee9 ba c\u00f3 kh\u1ea3 n\u0103ng xu\u1ea5t hi\u1ec7n nhi\u1ec1u nh\u1ea5t trong khu v\u1ef1c Diagnostics\/Ch\u1ea9n \u0111o\u00e1n<\/em> v\u00e0 c\u00e1c ki\u1ec3m tra Reduce JavaScript excution time\/Gi\u1ea3m th\u1eddi gian th\u1ef1c thi JavaScipt<\/em> v\u00e0 Avoid enormous netword payloads\/Tr\u00e1nh t\u1ea3i tr\u1ecdng m\u1ea1ng l\u1edbn<\/em>.<\/p>\n\n\n\u0110\u1ec3 ch\u1ea1y ki\u1ec3m tra, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J <\/em>(ho\u1eb7c Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Audits<\/strong>.<\/li>Click v\u00e0o Mobile.<\/strong><\/li>Ch\u1ecdn checkbox Performance<\/strong> (B\u1ea1n c\u00f3 th\u1ec3 b\u1ecf ch\u1ecdn t\u1ea5t c\u1ea3 ph\u1ea7n checkbox c\u00f2n l\u1ea1i trong ph\u1ea7n Audits.)<\/li>Click v\u00e0o Simulated Fast 3G, 4x CPU Slowdown<\/strong> (Gi\u1ea3 l\u1eadp m\u1ea1ng 3G nhanh, l\u00e0m ch\u1eadm CPU 4 l\u1ea7n)<\/li>Ch\u1ecdn checkbox Clear Storage<\/strong>.<\/li>Click Ch\u1ea1y audits<\/strong>.<\/li><\/ol>\n\n\n<\/figure><\/div>\n\n\n\n\n\n<\/span>S\u1eed d\u1ee5ng t\u00e0i nguy\u00ean c\u1ee7a b\u00ean th\u1ee9 ba<\/span><\/h2>\n\n\nPh\u1ea7n ki\u1ec3m tra s\u1eed d\u1ee5ng t\u00e0i nguy\u00ean c\u1ee7a b\u00ean th\u1ee9 ba<\/strong> c\u1ee7a Lighthouse cho th\u1ea5y m\u1ed9t danh s\u00e1ch c\u00e1c nh\u00e0 cung c\u1ea5p c\u1ee7a b\u00ean th\u1ee9 ba m\u00e0 trang \u0111ang s\u1eed d\u1ee5ng. C\u00e1i nh\u00ecn t\u1ed5ng quan n\u00e0y c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n hi\u1ec3u r\u00f5 h\u01a1n b\u1ee9c tranh to\u00e0n c\u1ea3nh v\u00e0 x\u00e1c \u0111\u1ecbnh m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba b\u1ecb d\u01b0 th\u1eeba (redundant). Ki\u1ec3m tra c\u00f3 s\u1eb5n trong c\u00e1c extension (ph\u1ea7n m\u1edf r\u1ed9ng) c\u1ee7a Lighthouse<\/a> v\u00e0 s\u1ebd s\u1edbm \u0111\u01b0\u1ee3c th\u00eam v\u00e0o DevTools trong Chrome 77. <\/p>\n\n\nT\u00ean c\u00e1c nh\u00e0 cung c\u1ea5p c\u1ee7a b\u00ean th\u1ee9 ba \u0111\u01b0\u1ee3c t\u1ea1o ra b\u1eb1ng ch\u1ee9c n\u0103ng Startup generator. <\/figcaption><\/figure><\/div>\n\n\n\n\n\n<\/span>Gi\u1ea3m th\u1eddi gian th\u1ef1c thi JavaScript<\/span><\/h2>\n\n\nKi\u1ec3m tra Gi\u1ea3m th\u1eddi gian th\u1ef1c thi JavaScript<\/a> \/ Reduce JavaScript execution time<\/em> c\u1ee7a Lighthouse l\u00e0m n\u1ed5i b\u1eadt c\u00e1c m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba m\u1ea5t nhi\u1ec1u th\u1eddi gian \u0111\u1ec3 ph\u00e2n t\u00edch c\u00fa ph\u00e1p (parse), bi\u00ean d\u1ecbch (compile) ho\u1eb7c \u0111\u00e1nh gi\u00e1 (evaluate). Ch\u1ecdn checkbox Show 3rd-party resources<\/strong> (hi\u1ec3n th\u1ecb c\u00e1c t\u00e0i nguy\u00ean c\u1ee7a b\u00ean th\u1ee9 ba) \u0111\u1ec3 ph\u00e1t hi\u1ec7n c\u00e1c \u0111o\u1ea1n m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba g\u00e2y \u00e1p l\u1ef1c th\u1eddi gian l\u00ean CPU.<\/p>\n\n\n<\/figure><\/div>\n\n\n\n\n\n<\/span>Tr\u00e1nh t\u1ea3i tr\u1ecdng m\u1ea1ng l\u1edbn<\/span><\/h2>\n\n\nKi\u1ec3m tra Avoid enormous network payloads \/ Tr\u00e1nh t\u1ea3i tr\u1ecdng m\u1ea1ng l\u1edbn<\/em> x\u00e1c \u0111\u1ecbnh c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng-bao g\u1ed3m nh\u1eefng t\u00e0i nguy\u00ean t\u1eeb b\u00ean th\u1ee9 ba-c\u00e1i c\u00f3 th\u1ec3 l\u00e0m ch\u1eadm th\u1eddi gian t\u1ea3i c\u1ee7a trang. Ki\u1ec3m tra s\u1ebd \u0111\u01b0a ra c\u00e1c c\u1ea3nh b\u00e1o khi t\u1ea3i tr\u1ecdng m\u1ea1ng v\u01b0\u1ee3t qu\u00e1 4000 KB.<\/p>\n\n\n<\/figure><\/div>\n\n\n\n\n\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 15 ph\u00fat<\/span><\/h2>\n\n\nKi\u1ec3m tra c\u1ee7a Lighthouse ch\u1ec9 ph\u00e1t hi\u1ec7n c\u00e1c v\u1ea5n \u0111\u1ec1 nghi\u00eam tr\u1ecdng nh\u1ea5t v\u1ec1 t\u1ed1c \u0111\u1ed9, v\u00ec th\u1ebf b\u1ea1n c\u00f3 th\u1ec3 c\u00f3 nh\u1eefng c\u1ea3i ti\u1ebfn th\u00eam n\u1eefa ngay c\u1ea3 khi trang c\u1ee7a b\u1ea1n v\u01b0\u1ee3t qua t\u1ea5t c\u1ea3 c\u00e1c b\u00e0i ki\u1ec3m tra. C\u00e1c panel Chrome DevTools Network v\u00e0 Performance c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh c\u00e1c \u0111o\u1ea1n m\u00e3 g\u00e2y ch\u1eadm. <\/p>\n\n\n\n\n\n<\/span>Chrome DevTools badging (g\u1eafn huy hi\u1ec7u bi\u1ec3u t\u01b0\u1ee3ng) m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba<\/span><\/h2>\n\n\nDevTools c\u00f3 th\u1ec3 highlight (l\u00e0m n\u1ed5i b\u1eadt) c\u00e1c \u0111o\u1ea1n m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba theo t\u00ean c\u1ee7a nh\u00e0 cung c\u1ea5p trong panel Network<\/strong>. Ch\u1ee9c n\u0103ng n\u00e0y c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba n\u00e0o t\u1ea1o ra y\u00eau c\u1ea7u tr\u00ean trang v\u00e0 bi\u1ebft h\u1ecd \u0111ang l\u00e0m \u0111i\u1ec1u g\u00ec.<\/p>\n\n\n\u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng badge cho b\u00ean th\u1ee9 ba, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Nh\u1ea5n Control+Shift+P<\/em> (ho\u1eb7c Command+Shift+P<\/em> tr\u00ean Mac) \u0111\u1ec3 b\u1eadt menu Command<\/strong>.<\/li>Nh\u1eadp Show third party badges<\/em> v\u00e0o box<\/li><\/ol>\n\n\nGi\u1edd b\u1ea1n c\u00f3 th\u1ec3 th\u1ea5y badges c\u1ee7a b\u00ean th\u1ee9 ba tr\u00ean b\u1ea5t k\u1ef3 trang n\u00e0o b\u1ea1n gh\u00e9 th\u0103m. \u0110\u1ec3 ki\u1ec3m tra \u0111i\u1ec1u n\u00e0y, h\u00e3y th\u1eed truy c\u1eadp trang https:\/\/developers.google.com\/web\/<\/a><\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean Mac) \u0111\u1ec3 m\u1edf DevTools<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Ch\u1ecdn checkbok Disable cache<\/strong> (v\u00f4 hi\u1ec7u h\u00f3a cache).<\/li>T\u1ea3i l\u1ea1i trang.<\/li><\/ol>\n\n\nGi\u1edd b\u1ea1n s\u1ebd th\u1ea5y m\u1ed9t badge b\u00ean c\u1ea1nh t\u1eebng m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba. Click v\u00e0o badge \u0111\u1ec3 hi\u1ec3n th\u1ecb nhi\u1ec1u th\u00f4ng tin h\u01a1n v\u1ec1 \u0111o\u1ea1n m\u00e3 \u0111\u00f3.<\/p>\n\n\n<\/figure><\/div>\n\n\n\u0110\u1ec3 c\u00f3 th\u00eam th\u00f4ng tin v\u1ec1 \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba l\u00ean hi\u1ec7u su\u1ea5t, b\u1ea1n h\u00e3y truy c\u1eadp v\u00e0o trang: https:\/\/www.thirdpartyweb.today\/<\/a>. N\u00f3 s\u1eed d\u1ee5ng d\u1eef li\u1ec7u HTTP Archive<\/a> \u0111\u1ec3 \u0111\u01b0a ra c\u00e1i nh\u00ecn t\u1ed5ng quan v\u1ec1 c\u00e1c nh\u00e0 cung c\u1ea5p c\u1ee7a b\u00ean th\u1ee9 ba v\u00e0 \u1ea3nh h\u01b0\u1edfng c\u1ee7a ch\u00fang l\u00ean web.<\/p>\n\n\n\n\n\n<\/span>Panel hi\u1ec7u su\u1ea5t c\u1ee7a Chrome DevTools<\/span><\/h2>\n\n\nM\u1ed9t khi \u0111\u01b0\u1ee3c b\u1eadt, badge m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba c\u0169ng xu\u1ea5t hi\u1ec7n trong panel Performance<\/strong> DevTools. Panel Performance ghi l\u1ea1i m\u1ed9t b\u1ea3ng waterfall<\/a> \u0111\u1ea1i di\u1ec7n, cho bi\u1ebft trang c\u1ee7a b\u1ea1n \u0111ang ti\u00eau t\u1ed1n th\u1eddi gian \u1edf nh\u1eefng ph\u1ea7n n\u00e0o v\u00e0 c\u00e1ch gi\u00fap b\u1ea1n quan s\u00e1t hi\u1ec7u su\u1ea5t m\u1ed9t c\u00e1ch chi ti\u1ebft.<\/p>\n\n\n\u0110\u1ec3 ghi l\u1ea1i c\u00e1ch trang t\u1ea3i, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Performance<\/strong>.<\/li>Click v\u00e0o n\u00fat Start profiling and reload page<\/strong>.<\/li><\/ol>\n\n\n\u0110\u1ec3 xem c\u00e1c ho\u1ea1t \u0111\u1ed9ng xu\u1ea5t hi\u1ec7n trong lu\u1ed3ng ch\u00ednh c\u1ee7a trang<\/a>, b\u1ea1n h\u00e3y ki\u1ec3m tra khu v\u1ef1c Main<\/strong>. C\u00e1c t\u00e1c v\u1ee5 d\u00e0i (long task)<\/strong> \u0111\u01b0\u1ee3c g\u00e1n nh\u00e3n b\u1eb1ng c\u1ea3nh b\u00e1o c\u1edd m\u00e0u \u0111\u1ecf, \u0111\u1ec3 bi\u1ebft chi ti\u1ebft h\u01a1n v\u1ec1 th\u1eddi gian th\u1ef1c thi, b\u1ea1n h\u00e3y hover qua ch\u00fang.<\/p>\n\n\nThu\u1eadt ng\u1eef quan tr\u1ecdng<\/strong>: M\u1ed9t t\u00e1c v\u1ee5 d\u00e0i<\/a> l\u00e0 m\u1ed9t \u0111o\u1ea1n m\u00e3 JavaScript chi\u1ebfm lu\u1ed3ng ch\u00ednh t\u1eeb 50 ms tr\u1edf l\u00ean, \u0111i\u1ec1u n\u00e0y t\u00e1c \u0111\u1ed9ng l\u00ean nh\u1eadn th\u1ee9c c\u1ee7a ng\u01b0\u1eddi truy c\u1eadp r\u1eb1ng UI (giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng) b\u1ecb \u0111\u01a1 (freeze).<\/p>\n\n\n<\/figure><\/div>\n\n\nB\u1ea1n c\u0169ng c\u00f3 th\u1ec3 s\u1eafp x\u1ebfp c\u00e1c t\u00e1c v\u1ee5 JavaScript theo th\u1eddi gian th\u1ef1c thi \u0111\u1ec3 x\u00e1c \u0111\u1ecbnh t\u00e0i nguy\u00ean b\u00ean th\u1ee9 ba n\u00e0o l\u00e0 ch\u1eadm nh\u1ea5t:<\/p>\n\n\nT\u1ea1i v\u1ecb tr\u00ed cu\u1ed1i c\u00f9ng c\u1ee7a panel Performance<\/strong>, click v\u00e0o tab Bottom-Up<\/strong>.<\/li>Trong danh s\u00e1ch x\u1ed5 xu\u1ed1ng \u0111\u00e3 \u0111\u01b0\u1ee3c nh\u00f3m l\u1ea1i, b\u1ea1n ch\u1ecdn Group by Product<\/strong> (nh\u00f3m theo s\u1ea3n ph\u1ea9m)<\/li><\/ol>\n\n\n<\/figure>\n\n\n\n\n\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 30 ph\u00fat<\/span><\/h2>\n\n\nChrome DevTools v\u1edbi t\u00ednh n\u0103ng ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng (network request blocking) cho ph\u00e9p b\u1ea1n quan s\u00e1t h\u00e0nh vi c\u1ee7a trang khi m\u1ed9t \u0111o\u1ea1n JavaScript, CSS ho\u1eb7c m\u1ed9t ngu\u1ed3n c\u1ee5 th\u1ec3 kh\u00e1c kh\u00f4ng \u0111\u01b0\u1ee3c t\u1ea3i v\u1ec1. Sau khi b\u1ea1n \u0111\u00e3 x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba m\u00e0 b\u1ea1n nghi ng\u1edd \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn hi\u1ec7u su\u1ea5t, b\u1ea1n c\u1ea7n ti\u1ebfn h\u00e0nh ki\u1ec3m tra xem th\u1eddi gian t\u1ea3i s\u1ebd thay \u0111\u1ed5i nh\u01b0 th\u1ebf n\u00e0o b\u1eb1ng c\u00e1ch ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u c\u1ee7a nh\u1eefng \u0111o\u1ea1n JavaScript \u0111\u00f3.<\/p>\n\n\n \u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng ch\u1eb7n y\u00eau c\u1ea7u (request blocking), h\u00e3y l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> ho\u1eb7c (Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Chu\u1ed9t ph\u1ea3i v\u00e0o b\u1ea5t c\u1ee9 y\u00eau c\u1ea7u n\u00e0o trong panel Network<\/strong>.<\/li>Ch\u1ecdn Block request URL<\/strong> (ch\u1eb7n URL y\u00eau c\u1ea7u).<\/li><\/ol>\n\n\n<\/figure><\/div>\n\n\nTab Request blocking<\/strong> s\u1ebd xu\u1ea5t hi\u1ec7n trong DevTools drawer. B\u1ea1n c\u00f3 th\u1ec3 qu\u1ea3n l\u00fd c\u00e1c y\u00eau c\u1ea7u \u0111\u00e3 b\u1ecb ch\u1eb7n \u1edf \u0111\u00f3.<\/p>\n\n\n\u0110\u1ec3 \u0111o \u0111\u1ea1c \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba:<\/p>\n\n\n\u0110o \u0111\u1ea1c l\u01b0\u1ee3ng th\u1eddi gian trang b\u1ea1n c\u1ea7n \u0111\u1ec3 t\u1ea3i v\u1ec1 b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng panel Network. \u0110\u1ec3 gi\u1ea3 l\u1eadp c\u00e1c \u0111i\u1ec1u ki\u1ec7n c\u1ee7a th\u1ebf gi\u1edbi th\u1ef1c, h\u00e3y b\u1eadt network throttling (\u0111i\u1ec1u ch\u1ec9nh m\u1ea1ng) v\u00e0 CPU throttling (\u0111i\u1ec1u ch\u1ec9nh CPU). Tr\u00ean c\u00e1c k\u1ebft n\u1ed1i nhanh v\u00e0 ph\u1ea7n c\u1ee9ng c\u1ee7a m\u00e1y b\u00e0n, \u1ea3nh h\u01b0\u1edfng c\u1ee7a c\u00e1c JavaScript n\u1eb7ng n\u1ec1 c\u00f3 th\u1ec3 ho\u00e0n to\u00e0n kh\u00e1c tr\u00ean thi\u1ebft b\u1ecb di \u0111\u1ed9ng.)<\/li>Ch\u1eb7n c\u00e1c URL ho\u1eb7c t\u00ean mi\u1ec1n \u0111\u1ea1i di\u1ec7n cho JavaScript c\u1ee7a b\u00ean th\u1ee9 b\u1ea1n m\u00e0 b\u1ea1n tin r\u1eb1ng n\u00f3 l\u00e0 v\u1ea5n \u0111\u1ec1.<\/li>T\u1ea3i l\u1ea1i trang v\u00e0 \u0111o \u0111\u1ea1c l\u1ea1i th\u1eddi gian n\u00f3 c\u1ea7n \u0111\u1ec3 t\u1ea3i m\u00e0 kh\u00f4ng c\u1ea7n c\u00e1c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba b\u1ecb ch\u1eb7n.<\/li><\/ol>\n\n\nB\u1ea1n ch\u1eafc h\u1eb3n hy v\u1ecdng th\u1ea5y t\u1ed1c \u0111\u1ed9 \u0111\u01b0\u1ee3c c\u1ea3i thi\u1ec7n, nh\u01b0ng thi tho\u1ea3ng vi\u1ec7c ch\u1eb7n t\u1ec7p l\u1ec7nh c\u1ee7a b\u00ean th\u1ee9 ba c\u00f3 th\u1ec3 kh\u00f4ng c\u00f3 \u0111\u01b0\u1ee3c \u1ea3nh h\u01b0\u1edfng nh\u01b0 b\u1ea1n mong ch\u1edd. N\u1ebfu b\u1ea1n r\u01a1i v\u00e0o tr\u01b0\u1eddng h\u1ee3p \u0111\u00f3, h\u00e3y gi\u1ea3m danh s\u00e1ch c\u00e1c URL b\u1ecb ch\u1eb7n cho \u0111\u1ebfn khi b\u1ea1n c\u00f4 l\u1eadp \u0111\u01b0\u1ee3c m\u1ed9t c\u00e1i l\u00e0 nguy\u00ean nh\u00e2n g\u00e2y ch\u1eadm ch\u1ea1p.<\/p>\n\n\nL\u01b0u \u00fd r\u1eb1ng b\u1ea1n c\u1ea7n th\u1ee9c hi\u1ec7n \u00edt nh\u1ea5t l\u00e0 ba l\u1ea7n ch\u1ea1y \u0111\u1ec3 \u0111o \u0111\u1ea1c v\u00e0 xem x\u00e9t gi\u00e1 tr\u1ecb trung b\u00ecnh, \u0111i\u1ec1u \u0111\u00f3 s\u1ebd cho ra gi\u00e1 tr\u1ecb \u1ed5n \u0111\u1ecbnh h\u01a1n. C\u00e1c n\u1ed9i dung c\u1ee7a b\u00ean th\u1ee9 ba th\u1ec9nh tho\u1ea3ng s\u1ebd k\u00e9o c\u00e1c t\u00e0i nguy\u00ean kh\u00e1c nhau m\u1ed7i khi t\u1ea3i trang, c\u00e1ch ti\u1ebfp c\u1eadn n\u00e0y cho ph\u00e9p b\u1ea1n c\u00f3 \u0111\u01b0\u1ee3c \u01b0\u1edbc t\u00ednh th\u1ef1c t\u1ebf h\u01a1n. DevTools gi\u1edd h\u1ed7 tr\u1ee3 c\u00f9ng l\u00fac nhi\u1ec1u b\u1ea3n ghi trong panel Performance<\/strong>, gi\u00fap b\u1ea1n l\u00e0m \u0111i\u1ec1u n\u00e0y d\u1ec5 d\u00e0ng h\u01a1n m\u1ed9t ch\u00fat.<\/p>\n\n\n(D\u1ecbch t\u1eeb b\u00e0i vi\u1ebft: Identify slow third-party JavaScript, t\u00e1c gi\u1ea3: Milica Mihajlija, trang web[.]dev)<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"Ghi ch\u00fa c\u1ee7a ng\u01b0\u1eddi d\u1ecbch: B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba. …<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[272],"tags":[],"yoast_head":"\nC\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng<\/title>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\t\n\t\n\t\n","yoast_head_json":{"title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_locale":"vi_VN","og_type":"article","og_title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","og_description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","og_url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_site_name":"Ki\u1ebfn c\u00e0ng","article_author":"https:\/\/www.facebook.com\/anhducnguyen87\/","article_published_time":"2020-03-19T08:39:51+00:00","og_image":[{"url":"https:\/\/kiencang.net\/wp-content\/uploads\/2020\/03\/audits-panel-767x1024.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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","isPartOf":{"@id":"https:\/\/kiencang.net\/#website"},"datePublished":"2020-03-19T08:39:51+00:00","dateModified":"2020-03-19T08:39:51+00:00","author":{"@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16"},"description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","breadcrumb":{"@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kiencang.net\/"},{"@type":"ListItem","position":2,"name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm 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\/16863"}],"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=16863"}],"version-history":[{"count":0,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/16863\/revisions"}],"wp:attachment":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media?parent=16863"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/categories?post=16863"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/tags?post=16863"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
C\u00f4ng c\u1ee5 ki\u1ec3m tra hi\u1ec7u su\u1ea5t c\u1ee7a Lighthouse gi\u00fap b\u1ea1n kh\u00e1m ph\u00e1 c\u00e1c c\u01a1 h\u1ed9i \u0111\u1ec3 t\u0103ng t\u1ed1c \u0111\u1ed9 trang. C\u00e1c \u0111o\u1ea1n m\u00e3 ch\u1eadm ch\u1ea1p c\u1ee7a b\u00ean th\u1ee9 ba c\u00f3 kh\u1ea3 n\u0103ng xu\u1ea5t hi\u1ec7n nhi\u1ec1u nh\u1ea5t trong khu v\u1ef1c Diagnostics\/Ch\u1ea9n \u0111o\u00e1n<\/em> v\u00e0 c\u00e1c ki\u1ec3m tra Reduce JavaScript excution time\/Gi\u1ea3m th\u1eddi gian th\u1ef1c thi JavaScipt<\/em> v\u00e0 Avoid enormous netword payloads\/Tr\u00e1nh t\u1ea3i tr\u1ecdng m\u1ea1ng l\u1edbn<\/em>.<\/p>\n\n\n\u0110\u1ec3 ch\u1ea1y ki\u1ec3m tra, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J <\/em>(ho\u1eb7c Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Audits<\/strong>.<\/li>Click v\u00e0o Mobile.<\/strong><\/li>Ch\u1ecdn checkbox Performance<\/strong> (B\u1ea1n c\u00f3 th\u1ec3 b\u1ecf ch\u1ecdn t\u1ea5t c\u1ea3 ph\u1ea7n checkbox c\u00f2n l\u1ea1i trong ph\u1ea7n Audits.)<\/li>Click v\u00e0o Simulated Fast 3G, 4x CPU Slowdown<\/strong> (Gi\u1ea3 l\u1eadp m\u1ea1ng 3G nhanh, l\u00e0m ch\u1eadm CPU 4 l\u1ea7n)<\/li>Ch\u1ecdn checkbox Clear Storage<\/strong>.<\/li>Click Ch\u1ea1y audits<\/strong>.<\/li><\/ol>\n\n\n<\/figure><\/div>\n\n\n\n\n\n<\/span>S\u1eed d\u1ee5ng t\u00e0i nguy\u00ean c\u1ee7a b\u00ean th\u1ee9 ba<\/span><\/h2>\n\n\nPh\u1ea7n ki\u1ec3m tra s\u1eed d\u1ee5ng t\u00e0i nguy\u00ean c\u1ee7a b\u00ean th\u1ee9 ba<\/strong> c\u1ee7a Lighthouse cho th\u1ea5y m\u1ed9t danh s\u00e1ch c\u00e1c nh\u00e0 cung c\u1ea5p c\u1ee7a b\u00ean th\u1ee9 ba m\u00e0 trang \u0111ang s\u1eed d\u1ee5ng. C\u00e1i nh\u00ecn t\u1ed5ng quan n\u00e0y c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n hi\u1ec3u r\u00f5 h\u01a1n b\u1ee9c tranh to\u00e0n c\u1ea3nh v\u00e0 x\u00e1c \u0111\u1ecbnh m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba b\u1ecb d\u01b0 th\u1eeba (redundant). Ki\u1ec3m tra c\u00f3 s\u1eb5n trong c\u00e1c extension (ph\u1ea7n m\u1edf r\u1ed9ng) c\u1ee7a Lighthouse<\/a> v\u00e0 s\u1ebd s\u1edbm \u0111\u01b0\u1ee3c th\u00eam v\u00e0o DevTools trong Chrome 77. <\/p>\n\n\nT\u00ean c\u00e1c nh\u00e0 cung c\u1ea5p c\u1ee7a b\u00ean th\u1ee9 ba \u0111\u01b0\u1ee3c t\u1ea1o ra b\u1eb1ng ch\u1ee9c n\u0103ng Startup generator. <\/figcaption><\/figure><\/div>\n\n\n\n\n\n<\/span>Gi\u1ea3m th\u1eddi gian th\u1ef1c thi JavaScript<\/span><\/h2>\n\n\nKi\u1ec3m tra Gi\u1ea3m th\u1eddi gian th\u1ef1c thi JavaScript<\/a> \/ Reduce JavaScript execution time<\/em> c\u1ee7a Lighthouse l\u00e0m n\u1ed5i b\u1eadt c\u00e1c m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba m\u1ea5t nhi\u1ec1u th\u1eddi gian \u0111\u1ec3 ph\u00e2n t\u00edch c\u00fa ph\u00e1p (parse), bi\u00ean d\u1ecbch (compile) ho\u1eb7c \u0111\u00e1nh gi\u00e1 (evaluate). Ch\u1ecdn checkbox Show 3rd-party resources<\/strong> (hi\u1ec3n th\u1ecb c\u00e1c t\u00e0i nguy\u00ean c\u1ee7a b\u00ean th\u1ee9 ba) \u0111\u1ec3 ph\u00e1t hi\u1ec7n c\u00e1c \u0111o\u1ea1n m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba g\u00e2y \u00e1p l\u1ef1c th\u1eddi gian l\u00ean CPU.<\/p>\n\n\n<\/figure><\/div>\n\n\n\n\n\n<\/span>Tr\u00e1nh t\u1ea3i tr\u1ecdng m\u1ea1ng l\u1edbn<\/span><\/h2>\n\n\nKi\u1ec3m tra Avoid enormous network payloads \/ Tr\u00e1nh t\u1ea3i tr\u1ecdng m\u1ea1ng l\u1edbn<\/em> x\u00e1c \u0111\u1ecbnh c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng-bao g\u1ed3m nh\u1eefng t\u00e0i nguy\u00ean t\u1eeb b\u00ean th\u1ee9 ba-c\u00e1i c\u00f3 th\u1ec3 l\u00e0m ch\u1eadm th\u1eddi gian t\u1ea3i c\u1ee7a trang. Ki\u1ec3m tra s\u1ebd \u0111\u01b0a ra c\u00e1c c\u1ea3nh b\u00e1o khi t\u1ea3i tr\u1ecdng m\u1ea1ng v\u01b0\u1ee3t qu\u00e1 4000 KB.<\/p>\n\n\n<\/figure><\/div>\n\n\n\n\n\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 15 ph\u00fat<\/span><\/h2>\n\n\nKi\u1ec3m tra c\u1ee7a Lighthouse ch\u1ec9 ph\u00e1t hi\u1ec7n c\u00e1c v\u1ea5n \u0111\u1ec1 nghi\u00eam tr\u1ecdng nh\u1ea5t v\u1ec1 t\u1ed1c \u0111\u1ed9, v\u00ec th\u1ebf b\u1ea1n c\u00f3 th\u1ec3 c\u00f3 nh\u1eefng c\u1ea3i ti\u1ebfn th\u00eam n\u1eefa ngay c\u1ea3 khi trang c\u1ee7a b\u1ea1n v\u01b0\u1ee3t qua t\u1ea5t c\u1ea3 c\u00e1c b\u00e0i ki\u1ec3m tra. C\u00e1c panel Chrome DevTools Network v\u00e0 Performance c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh c\u00e1c \u0111o\u1ea1n m\u00e3 g\u00e2y ch\u1eadm. <\/p>\n\n\n\n\n\n<\/span>Chrome DevTools badging (g\u1eafn huy hi\u1ec7u bi\u1ec3u t\u01b0\u1ee3ng) m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba<\/span><\/h2>\n\n\nDevTools c\u00f3 th\u1ec3 highlight (l\u00e0m n\u1ed5i b\u1eadt) c\u00e1c \u0111o\u1ea1n m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba theo t\u00ean c\u1ee7a nh\u00e0 cung c\u1ea5p trong panel Network<\/strong>. Ch\u1ee9c n\u0103ng n\u00e0y c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba n\u00e0o t\u1ea1o ra y\u00eau c\u1ea7u tr\u00ean trang v\u00e0 bi\u1ebft h\u1ecd \u0111ang l\u00e0m \u0111i\u1ec1u g\u00ec.<\/p>\n\n\n\u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng badge cho b\u00ean th\u1ee9 ba, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Nh\u1ea5n Control+Shift+P<\/em> (ho\u1eb7c Command+Shift+P<\/em> tr\u00ean Mac) \u0111\u1ec3 b\u1eadt menu Command<\/strong>.<\/li>Nh\u1eadp Show third party badges<\/em> v\u00e0o box<\/li><\/ol>\n\n\nGi\u1edd b\u1ea1n c\u00f3 th\u1ec3 th\u1ea5y badges c\u1ee7a b\u00ean th\u1ee9 ba tr\u00ean b\u1ea5t k\u1ef3 trang n\u00e0o b\u1ea1n gh\u00e9 th\u0103m. \u0110\u1ec3 ki\u1ec3m tra \u0111i\u1ec1u n\u00e0y, h\u00e3y th\u1eed truy c\u1eadp trang https:\/\/developers.google.com\/web\/<\/a><\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean Mac) \u0111\u1ec3 m\u1edf DevTools<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Ch\u1ecdn checkbok Disable cache<\/strong> (v\u00f4 hi\u1ec7u h\u00f3a cache).<\/li>T\u1ea3i l\u1ea1i trang.<\/li><\/ol>\n\n\nGi\u1edd b\u1ea1n s\u1ebd th\u1ea5y m\u1ed9t badge b\u00ean c\u1ea1nh t\u1eebng m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba. Click v\u00e0o badge \u0111\u1ec3 hi\u1ec3n th\u1ecb nhi\u1ec1u th\u00f4ng tin h\u01a1n v\u1ec1 \u0111o\u1ea1n m\u00e3 \u0111\u00f3.<\/p>\n\n\n<\/figure><\/div>\n\n\n\u0110\u1ec3 c\u00f3 th\u00eam th\u00f4ng tin v\u1ec1 \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba l\u00ean hi\u1ec7u su\u1ea5t, b\u1ea1n h\u00e3y truy c\u1eadp v\u00e0o trang: https:\/\/www.thirdpartyweb.today\/<\/a>. N\u00f3 s\u1eed d\u1ee5ng d\u1eef li\u1ec7u HTTP Archive<\/a> \u0111\u1ec3 \u0111\u01b0a ra c\u00e1i nh\u00ecn t\u1ed5ng quan v\u1ec1 c\u00e1c nh\u00e0 cung c\u1ea5p c\u1ee7a b\u00ean th\u1ee9 ba v\u00e0 \u1ea3nh h\u01b0\u1edfng c\u1ee7a ch\u00fang l\u00ean web.<\/p>\n\n\n\n\n\n<\/span>Panel hi\u1ec7u su\u1ea5t c\u1ee7a Chrome DevTools<\/span><\/h2>\n\n\nM\u1ed9t khi \u0111\u01b0\u1ee3c b\u1eadt, badge m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba c\u0169ng xu\u1ea5t hi\u1ec7n trong panel Performance<\/strong> DevTools. Panel Performance ghi l\u1ea1i m\u1ed9t b\u1ea3ng waterfall<\/a> \u0111\u1ea1i di\u1ec7n, cho bi\u1ebft trang c\u1ee7a b\u1ea1n \u0111ang ti\u00eau t\u1ed1n th\u1eddi gian \u1edf nh\u1eefng ph\u1ea7n n\u00e0o v\u00e0 c\u00e1ch gi\u00fap b\u1ea1n quan s\u00e1t hi\u1ec7u su\u1ea5t m\u1ed9t c\u00e1ch chi ti\u1ebft.<\/p>\n\n\n\u0110\u1ec3 ghi l\u1ea1i c\u00e1ch trang t\u1ea3i, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Performance<\/strong>.<\/li>Click v\u00e0o n\u00fat Start profiling and reload page<\/strong>.<\/li><\/ol>\n\n\n\u0110\u1ec3 xem c\u00e1c ho\u1ea1t \u0111\u1ed9ng xu\u1ea5t hi\u1ec7n trong lu\u1ed3ng ch\u00ednh c\u1ee7a trang<\/a>, b\u1ea1n h\u00e3y ki\u1ec3m tra khu v\u1ef1c Main<\/strong>. C\u00e1c t\u00e1c v\u1ee5 d\u00e0i (long task)<\/strong> \u0111\u01b0\u1ee3c g\u00e1n nh\u00e3n b\u1eb1ng c\u1ea3nh b\u00e1o c\u1edd m\u00e0u \u0111\u1ecf, \u0111\u1ec3 bi\u1ebft chi ti\u1ebft h\u01a1n v\u1ec1 th\u1eddi gian th\u1ef1c thi, b\u1ea1n h\u00e3y hover qua ch\u00fang.<\/p>\n\n\nThu\u1eadt ng\u1eef quan tr\u1ecdng<\/strong>: M\u1ed9t t\u00e1c v\u1ee5 d\u00e0i<\/a> l\u00e0 m\u1ed9t \u0111o\u1ea1n m\u00e3 JavaScript chi\u1ebfm lu\u1ed3ng ch\u00ednh t\u1eeb 50 ms tr\u1edf l\u00ean, \u0111i\u1ec1u n\u00e0y t\u00e1c \u0111\u1ed9ng l\u00ean nh\u1eadn th\u1ee9c c\u1ee7a ng\u01b0\u1eddi truy c\u1eadp r\u1eb1ng UI (giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng) b\u1ecb \u0111\u01a1 (freeze).<\/p>\n\n\n<\/figure><\/div>\n\n\nB\u1ea1n c\u0169ng c\u00f3 th\u1ec3 s\u1eafp x\u1ebfp c\u00e1c t\u00e1c v\u1ee5 JavaScript theo th\u1eddi gian th\u1ef1c thi \u0111\u1ec3 x\u00e1c \u0111\u1ecbnh t\u00e0i nguy\u00ean b\u00ean th\u1ee9 ba n\u00e0o l\u00e0 ch\u1eadm nh\u1ea5t:<\/p>\n\n\nT\u1ea1i v\u1ecb tr\u00ed cu\u1ed1i c\u00f9ng c\u1ee7a panel Performance<\/strong>, click v\u00e0o tab Bottom-Up<\/strong>.<\/li>Trong danh s\u00e1ch x\u1ed5 xu\u1ed1ng \u0111\u00e3 \u0111\u01b0\u1ee3c nh\u00f3m l\u1ea1i, b\u1ea1n ch\u1ecdn Group by Product<\/strong> (nh\u00f3m theo s\u1ea3n ph\u1ea9m)<\/li><\/ol>\n\n\n<\/figure>\n\n\n\n\n\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 30 ph\u00fat<\/span><\/h2>\n\n\nChrome DevTools v\u1edbi t\u00ednh n\u0103ng ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng (network request blocking) cho ph\u00e9p b\u1ea1n quan s\u00e1t h\u00e0nh vi c\u1ee7a trang khi m\u1ed9t \u0111o\u1ea1n JavaScript, CSS ho\u1eb7c m\u1ed9t ngu\u1ed3n c\u1ee5 th\u1ec3 kh\u00e1c kh\u00f4ng \u0111\u01b0\u1ee3c t\u1ea3i v\u1ec1. Sau khi b\u1ea1n \u0111\u00e3 x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba m\u00e0 b\u1ea1n nghi ng\u1edd \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn hi\u1ec7u su\u1ea5t, b\u1ea1n c\u1ea7n ti\u1ebfn h\u00e0nh ki\u1ec3m tra xem th\u1eddi gian t\u1ea3i s\u1ebd thay \u0111\u1ed5i nh\u01b0 th\u1ebf n\u00e0o b\u1eb1ng c\u00e1ch ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u c\u1ee7a nh\u1eefng \u0111o\u1ea1n JavaScript \u0111\u00f3.<\/p>\n\n\n \u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng ch\u1eb7n y\u00eau c\u1ea7u (request blocking), h\u00e3y l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> ho\u1eb7c (Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Chu\u1ed9t ph\u1ea3i v\u00e0o b\u1ea5t c\u1ee9 y\u00eau c\u1ea7u n\u00e0o trong panel Network<\/strong>.<\/li>Ch\u1ecdn Block request URL<\/strong> (ch\u1eb7n URL y\u00eau c\u1ea7u).<\/li><\/ol>\n\n\n<\/figure><\/div>\n\n\nTab Request blocking<\/strong> s\u1ebd xu\u1ea5t hi\u1ec7n trong DevTools drawer. B\u1ea1n c\u00f3 th\u1ec3 qu\u1ea3n l\u00fd c\u00e1c y\u00eau c\u1ea7u \u0111\u00e3 b\u1ecb ch\u1eb7n \u1edf \u0111\u00f3.<\/p>\n\n\n\u0110\u1ec3 \u0111o \u0111\u1ea1c \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba:<\/p>\n\n\n\u0110o \u0111\u1ea1c l\u01b0\u1ee3ng th\u1eddi gian trang b\u1ea1n c\u1ea7n \u0111\u1ec3 t\u1ea3i v\u1ec1 b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng panel Network. \u0110\u1ec3 gi\u1ea3 l\u1eadp c\u00e1c \u0111i\u1ec1u ki\u1ec7n c\u1ee7a th\u1ebf gi\u1edbi th\u1ef1c, h\u00e3y b\u1eadt network throttling (\u0111i\u1ec1u ch\u1ec9nh m\u1ea1ng) v\u00e0 CPU throttling (\u0111i\u1ec1u ch\u1ec9nh CPU). Tr\u00ean c\u00e1c k\u1ebft n\u1ed1i nhanh v\u00e0 ph\u1ea7n c\u1ee9ng c\u1ee7a m\u00e1y b\u00e0n, \u1ea3nh h\u01b0\u1edfng c\u1ee7a c\u00e1c JavaScript n\u1eb7ng n\u1ec1 c\u00f3 th\u1ec3 ho\u00e0n to\u00e0n kh\u00e1c tr\u00ean thi\u1ebft b\u1ecb di \u0111\u1ed9ng.)<\/li>Ch\u1eb7n c\u00e1c URL ho\u1eb7c t\u00ean mi\u1ec1n \u0111\u1ea1i di\u1ec7n cho JavaScript c\u1ee7a b\u00ean th\u1ee9 b\u1ea1n m\u00e0 b\u1ea1n tin r\u1eb1ng n\u00f3 l\u00e0 v\u1ea5n \u0111\u1ec1.<\/li>T\u1ea3i l\u1ea1i trang v\u00e0 \u0111o \u0111\u1ea1c l\u1ea1i th\u1eddi gian n\u00f3 c\u1ea7n \u0111\u1ec3 t\u1ea3i m\u00e0 kh\u00f4ng c\u1ea7n c\u00e1c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba b\u1ecb ch\u1eb7n.<\/li><\/ol>\n\n\nB\u1ea1n ch\u1eafc h\u1eb3n hy v\u1ecdng th\u1ea5y t\u1ed1c \u0111\u1ed9 \u0111\u01b0\u1ee3c c\u1ea3i thi\u1ec7n, nh\u01b0ng thi tho\u1ea3ng vi\u1ec7c ch\u1eb7n t\u1ec7p l\u1ec7nh c\u1ee7a b\u00ean th\u1ee9 ba c\u00f3 th\u1ec3 kh\u00f4ng c\u00f3 \u0111\u01b0\u1ee3c \u1ea3nh h\u01b0\u1edfng nh\u01b0 b\u1ea1n mong ch\u1edd. N\u1ebfu b\u1ea1n r\u01a1i v\u00e0o tr\u01b0\u1eddng h\u1ee3p \u0111\u00f3, h\u00e3y gi\u1ea3m danh s\u00e1ch c\u00e1c URL b\u1ecb ch\u1eb7n cho \u0111\u1ebfn khi b\u1ea1n c\u00f4 l\u1eadp \u0111\u01b0\u1ee3c m\u1ed9t c\u00e1i l\u00e0 nguy\u00ean nh\u00e2n g\u00e2y ch\u1eadm ch\u1ea1p.<\/p>\n\n\nL\u01b0u \u00fd r\u1eb1ng b\u1ea1n c\u1ea7n th\u1ee9c hi\u1ec7n \u00edt nh\u1ea5t l\u00e0 ba l\u1ea7n ch\u1ea1y \u0111\u1ec3 \u0111o \u0111\u1ea1c v\u00e0 xem x\u00e9t gi\u00e1 tr\u1ecb trung b\u00ecnh, \u0111i\u1ec1u \u0111\u00f3 s\u1ebd cho ra gi\u00e1 tr\u1ecb \u1ed5n \u0111\u1ecbnh h\u01a1n. C\u00e1c n\u1ed9i dung c\u1ee7a b\u00ean th\u1ee9 ba th\u1ec9nh tho\u1ea3ng s\u1ebd k\u00e9o c\u00e1c t\u00e0i nguy\u00ean kh\u00e1c nhau m\u1ed7i khi t\u1ea3i trang, c\u00e1ch ti\u1ebfp c\u1eadn n\u00e0y cho ph\u00e9p b\u1ea1n c\u00f3 \u0111\u01b0\u1ee3c \u01b0\u1edbc t\u00ednh th\u1ef1c t\u1ebf h\u01a1n. DevTools gi\u1edd h\u1ed7 tr\u1ee3 c\u00f9ng l\u00fac nhi\u1ec1u b\u1ea3n ghi trong panel Performance<\/strong>, gi\u00fap b\u1ea1n l\u00e0m \u0111i\u1ec1u n\u00e0y d\u1ec5 d\u00e0ng h\u01a1n m\u1ed9t ch\u00fat.<\/p>\n\n\n(D\u1ecbch t\u1eeb b\u00e0i vi\u1ebft: Identify slow third-party JavaScript, t\u00e1c gi\u1ea3: Milica Mihajlija, trang web[.]dev)<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"Ghi ch\u00fa c\u1ee7a ng\u01b0\u1eddi d\u1ecbch: B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba. …<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[272],"tags":[],"yoast_head":"\nC\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng<\/title>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\t\n\t\n\t\n","yoast_head_json":{"title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_locale":"vi_VN","og_type":"article","og_title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","og_description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","og_url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_site_name":"Ki\u1ebfn c\u00e0ng","article_author":"https:\/\/www.facebook.com\/anhducnguyen87\/","article_published_time":"2020-03-19T08:39:51+00:00","og_image":[{"url":"https:\/\/kiencang.net\/wp-content\/uploads\/2020\/03\/audits-panel-767x1024.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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","isPartOf":{"@id":"https:\/\/kiencang.net\/#website"},"datePublished":"2020-03-19T08:39:51+00:00","dateModified":"2020-03-19T08:39:51+00:00","author":{"@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16"},"description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","breadcrumb":{"@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kiencang.net\/"},{"@type":"ListItem","position":2,"name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm 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\/16863"}],"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=16863"}],"version-history":[{"count":0,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/16863\/revisions"}],"wp:attachment":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media?parent=16863"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/categories?post=16863"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/tags?post=16863"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
\u0110\u1ec3 ch\u1ea1y ki\u1ec3m tra, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\n
Ph\u1ea7n ki\u1ec3m tra s\u1eed d\u1ee5ng t\u00e0i nguy\u00ean c\u1ee7a b\u00ean th\u1ee9 ba<\/strong> c\u1ee7a Lighthouse cho th\u1ea5y m\u1ed9t danh s\u00e1ch c\u00e1c nh\u00e0 cung c\u1ea5p c\u1ee7a b\u00ean th\u1ee9 ba m\u00e0 trang \u0111ang s\u1eed d\u1ee5ng. C\u00e1i nh\u00ecn t\u1ed5ng quan n\u00e0y c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n hi\u1ec3u r\u00f5 h\u01a1n b\u1ee9c tranh to\u00e0n c\u1ea3nh v\u00e0 x\u00e1c \u0111\u1ecbnh m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba b\u1ecb d\u01b0 th\u1eeba (redundant). Ki\u1ec3m tra c\u00f3 s\u1eb5n trong c\u00e1c extension (ph\u1ea7n m\u1edf r\u1ed9ng) c\u1ee7a Lighthouse<\/a> v\u00e0 s\u1ebd s\u1edbm \u0111\u01b0\u1ee3c th\u00eam v\u00e0o DevTools trong Chrome 77. <\/p>\n\n\nT\u00ean c\u00e1c nh\u00e0 cung c\u1ea5p c\u1ee7a b\u00ean th\u1ee9 ba \u0111\u01b0\u1ee3c t\u1ea1o ra b\u1eb1ng ch\u1ee9c n\u0103ng Startup generator. <\/figcaption><\/figure><\/div>\n\n\n\n\n\n<\/span>Gi\u1ea3m th\u1eddi gian th\u1ef1c thi JavaScript<\/span><\/h2>\n\n\nKi\u1ec3m tra Gi\u1ea3m th\u1eddi gian th\u1ef1c thi JavaScript<\/a> \/ Reduce JavaScript execution time<\/em> c\u1ee7a Lighthouse l\u00e0m n\u1ed5i b\u1eadt c\u00e1c m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba m\u1ea5t nhi\u1ec1u th\u1eddi gian \u0111\u1ec3 ph\u00e2n t\u00edch c\u00fa ph\u00e1p (parse), bi\u00ean d\u1ecbch (compile) ho\u1eb7c \u0111\u00e1nh gi\u00e1 (evaluate). Ch\u1ecdn checkbox Show 3rd-party resources<\/strong> (hi\u1ec3n th\u1ecb c\u00e1c t\u00e0i nguy\u00ean c\u1ee7a b\u00ean th\u1ee9 ba) \u0111\u1ec3 ph\u00e1t hi\u1ec7n c\u00e1c \u0111o\u1ea1n m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba g\u00e2y \u00e1p l\u1ef1c th\u1eddi gian l\u00ean CPU.<\/p>\n\n\n<\/figure><\/div>\n\n\n\n\n\n<\/span>Tr\u00e1nh t\u1ea3i tr\u1ecdng m\u1ea1ng l\u1edbn<\/span><\/h2>\n\n\nKi\u1ec3m tra Avoid enormous network payloads \/ Tr\u00e1nh t\u1ea3i tr\u1ecdng m\u1ea1ng l\u1edbn<\/em> x\u00e1c \u0111\u1ecbnh c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng-bao g\u1ed3m nh\u1eefng t\u00e0i nguy\u00ean t\u1eeb b\u00ean th\u1ee9 ba-c\u00e1i c\u00f3 th\u1ec3 l\u00e0m ch\u1eadm th\u1eddi gian t\u1ea3i c\u1ee7a trang. Ki\u1ec3m tra s\u1ebd \u0111\u01b0a ra c\u00e1c c\u1ea3nh b\u00e1o khi t\u1ea3i tr\u1ecdng m\u1ea1ng v\u01b0\u1ee3t qu\u00e1 4000 KB.<\/p>\n\n\n<\/figure><\/div>\n\n\n\n\n\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 15 ph\u00fat<\/span><\/h2>\n\n\nKi\u1ec3m tra c\u1ee7a Lighthouse ch\u1ec9 ph\u00e1t hi\u1ec7n c\u00e1c v\u1ea5n \u0111\u1ec1 nghi\u00eam tr\u1ecdng nh\u1ea5t v\u1ec1 t\u1ed1c \u0111\u1ed9, v\u00ec th\u1ebf b\u1ea1n c\u00f3 th\u1ec3 c\u00f3 nh\u1eefng c\u1ea3i ti\u1ebfn th\u00eam n\u1eefa ngay c\u1ea3 khi trang c\u1ee7a b\u1ea1n v\u01b0\u1ee3t qua t\u1ea5t c\u1ea3 c\u00e1c b\u00e0i ki\u1ec3m tra. C\u00e1c panel Chrome DevTools Network v\u00e0 Performance c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh c\u00e1c \u0111o\u1ea1n m\u00e3 g\u00e2y ch\u1eadm. <\/p>\n\n\n\n\n\n<\/span>Chrome DevTools badging (g\u1eafn huy hi\u1ec7u bi\u1ec3u t\u01b0\u1ee3ng) m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba<\/span><\/h2>\n\n\nDevTools c\u00f3 th\u1ec3 highlight (l\u00e0m n\u1ed5i b\u1eadt) c\u00e1c \u0111o\u1ea1n m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba theo t\u00ean c\u1ee7a nh\u00e0 cung c\u1ea5p trong panel Network<\/strong>. Ch\u1ee9c n\u0103ng n\u00e0y c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba n\u00e0o t\u1ea1o ra y\u00eau c\u1ea7u tr\u00ean trang v\u00e0 bi\u1ebft h\u1ecd \u0111ang l\u00e0m \u0111i\u1ec1u g\u00ec.<\/p>\n\n\n\u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng badge cho b\u00ean th\u1ee9 ba, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Nh\u1ea5n Control+Shift+P<\/em> (ho\u1eb7c Command+Shift+P<\/em> tr\u00ean Mac) \u0111\u1ec3 b\u1eadt menu Command<\/strong>.<\/li>Nh\u1eadp Show third party badges<\/em> v\u00e0o box<\/li><\/ol>\n\n\nGi\u1edd b\u1ea1n c\u00f3 th\u1ec3 th\u1ea5y badges c\u1ee7a b\u00ean th\u1ee9 ba tr\u00ean b\u1ea5t k\u1ef3 trang n\u00e0o b\u1ea1n gh\u00e9 th\u0103m. \u0110\u1ec3 ki\u1ec3m tra \u0111i\u1ec1u n\u00e0y, h\u00e3y th\u1eed truy c\u1eadp trang https:\/\/developers.google.com\/web\/<\/a><\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean Mac) \u0111\u1ec3 m\u1edf DevTools<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Ch\u1ecdn checkbok Disable cache<\/strong> (v\u00f4 hi\u1ec7u h\u00f3a cache).<\/li>T\u1ea3i l\u1ea1i trang.<\/li><\/ol>\n\n\nGi\u1edd b\u1ea1n s\u1ebd th\u1ea5y m\u1ed9t badge b\u00ean c\u1ea1nh t\u1eebng m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba. Click v\u00e0o badge \u0111\u1ec3 hi\u1ec3n th\u1ecb nhi\u1ec1u th\u00f4ng tin h\u01a1n v\u1ec1 \u0111o\u1ea1n m\u00e3 \u0111\u00f3.<\/p>\n\n\n<\/figure><\/div>\n\n\n\u0110\u1ec3 c\u00f3 th\u00eam th\u00f4ng tin v\u1ec1 \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba l\u00ean hi\u1ec7u su\u1ea5t, b\u1ea1n h\u00e3y truy c\u1eadp v\u00e0o trang: https:\/\/www.thirdpartyweb.today\/<\/a>. N\u00f3 s\u1eed d\u1ee5ng d\u1eef li\u1ec7u HTTP Archive<\/a> \u0111\u1ec3 \u0111\u01b0a ra c\u00e1i nh\u00ecn t\u1ed5ng quan v\u1ec1 c\u00e1c nh\u00e0 cung c\u1ea5p c\u1ee7a b\u00ean th\u1ee9 ba v\u00e0 \u1ea3nh h\u01b0\u1edfng c\u1ee7a ch\u00fang l\u00ean web.<\/p>\n\n\n\n\n\n<\/span>Panel hi\u1ec7u su\u1ea5t c\u1ee7a Chrome DevTools<\/span><\/h2>\n\n\nM\u1ed9t khi \u0111\u01b0\u1ee3c b\u1eadt, badge m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba c\u0169ng xu\u1ea5t hi\u1ec7n trong panel Performance<\/strong> DevTools. Panel Performance ghi l\u1ea1i m\u1ed9t b\u1ea3ng waterfall<\/a> \u0111\u1ea1i di\u1ec7n, cho bi\u1ebft trang c\u1ee7a b\u1ea1n \u0111ang ti\u00eau t\u1ed1n th\u1eddi gian \u1edf nh\u1eefng ph\u1ea7n n\u00e0o v\u00e0 c\u00e1ch gi\u00fap b\u1ea1n quan s\u00e1t hi\u1ec7u su\u1ea5t m\u1ed9t c\u00e1ch chi ti\u1ebft.<\/p>\n\n\n\u0110\u1ec3 ghi l\u1ea1i c\u00e1ch trang t\u1ea3i, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Performance<\/strong>.<\/li>Click v\u00e0o n\u00fat Start profiling and reload page<\/strong>.<\/li><\/ol>\n\n\n\u0110\u1ec3 xem c\u00e1c ho\u1ea1t \u0111\u1ed9ng xu\u1ea5t hi\u1ec7n trong lu\u1ed3ng ch\u00ednh c\u1ee7a trang<\/a>, b\u1ea1n h\u00e3y ki\u1ec3m tra khu v\u1ef1c Main<\/strong>. C\u00e1c t\u00e1c v\u1ee5 d\u00e0i (long task)<\/strong> \u0111\u01b0\u1ee3c g\u00e1n nh\u00e3n b\u1eb1ng c\u1ea3nh b\u00e1o c\u1edd m\u00e0u \u0111\u1ecf, \u0111\u1ec3 bi\u1ebft chi ti\u1ebft h\u01a1n v\u1ec1 th\u1eddi gian th\u1ef1c thi, b\u1ea1n h\u00e3y hover qua ch\u00fang.<\/p>\n\n\nThu\u1eadt ng\u1eef quan tr\u1ecdng<\/strong>: M\u1ed9t t\u00e1c v\u1ee5 d\u00e0i<\/a> l\u00e0 m\u1ed9t \u0111o\u1ea1n m\u00e3 JavaScript chi\u1ebfm lu\u1ed3ng ch\u00ednh t\u1eeb 50 ms tr\u1edf l\u00ean, \u0111i\u1ec1u n\u00e0y t\u00e1c \u0111\u1ed9ng l\u00ean nh\u1eadn th\u1ee9c c\u1ee7a ng\u01b0\u1eddi truy c\u1eadp r\u1eb1ng UI (giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng) b\u1ecb \u0111\u01a1 (freeze).<\/p>\n\n\n<\/figure><\/div>\n\n\nB\u1ea1n c\u0169ng c\u00f3 th\u1ec3 s\u1eafp x\u1ebfp c\u00e1c t\u00e1c v\u1ee5 JavaScript theo th\u1eddi gian th\u1ef1c thi \u0111\u1ec3 x\u00e1c \u0111\u1ecbnh t\u00e0i nguy\u00ean b\u00ean th\u1ee9 ba n\u00e0o l\u00e0 ch\u1eadm nh\u1ea5t:<\/p>\n\n\nT\u1ea1i v\u1ecb tr\u00ed cu\u1ed1i c\u00f9ng c\u1ee7a panel Performance<\/strong>, click v\u00e0o tab Bottom-Up<\/strong>.<\/li>Trong danh s\u00e1ch x\u1ed5 xu\u1ed1ng \u0111\u00e3 \u0111\u01b0\u1ee3c nh\u00f3m l\u1ea1i, b\u1ea1n ch\u1ecdn Group by Product<\/strong> (nh\u00f3m theo s\u1ea3n ph\u1ea9m)<\/li><\/ol>\n\n\n<\/figure>\n\n\n\n\n\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 30 ph\u00fat<\/span><\/h2>\n\n\nChrome DevTools v\u1edbi t\u00ednh n\u0103ng ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng (network request blocking) cho ph\u00e9p b\u1ea1n quan s\u00e1t h\u00e0nh vi c\u1ee7a trang khi m\u1ed9t \u0111o\u1ea1n JavaScript, CSS ho\u1eb7c m\u1ed9t ngu\u1ed3n c\u1ee5 th\u1ec3 kh\u00e1c kh\u00f4ng \u0111\u01b0\u1ee3c t\u1ea3i v\u1ec1. Sau khi b\u1ea1n \u0111\u00e3 x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba m\u00e0 b\u1ea1n nghi ng\u1edd \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn hi\u1ec7u su\u1ea5t, b\u1ea1n c\u1ea7n ti\u1ebfn h\u00e0nh ki\u1ec3m tra xem th\u1eddi gian t\u1ea3i s\u1ebd thay \u0111\u1ed5i nh\u01b0 th\u1ebf n\u00e0o b\u1eb1ng c\u00e1ch ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u c\u1ee7a nh\u1eefng \u0111o\u1ea1n JavaScript \u0111\u00f3.<\/p>\n\n\n \u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng ch\u1eb7n y\u00eau c\u1ea7u (request blocking), h\u00e3y l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> ho\u1eb7c (Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Chu\u1ed9t ph\u1ea3i v\u00e0o b\u1ea5t c\u1ee9 y\u00eau c\u1ea7u n\u00e0o trong panel Network<\/strong>.<\/li>Ch\u1ecdn Block request URL<\/strong> (ch\u1eb7n URL y\u00eau c\u1ea7u).<\/li><\/ol>\n\n\n<\/figure><\/div>\n\n\nTab Request blocking<\/strong> s\u1ebd xu\u1ea5t hi\u1ec7n trong DevTools drawer. B\u1ea1n c\u00f3 th\u1ec3 qu\u1ea3n l\u00fd c\u00e1c y\u00eau c\u1ea7u \u0111\u00e3 b\u1ecb ch\u1eb7n \u1edf \u0111\u00f3.<\/p>\n\n\n\u0110\u1ec3 \u0111o \u0111\u1ea1c \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba:<\/p>\n\n\n\u0110o \u0111\u1ea1c l\u01b0\u1ee3ng th\u1eddi gian trang b\u1ea1n c\u1ea7n \u0111\u1ec3 t\u1ea3i v\u1ec1 b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng panel Network. \u0110\u1ec3 gi\u1ea3 l\u1eadp c\u00e1c \u0111i\u1ec1u ki\u1ec7n c\u1ee7a th\u1ebf gi\u1edbi th\u1ef1c, h\u00e3y b\u1eadt network throttling (\u0111i\u1ec1u ch\u1ec9nh m\u1ea1ng) v\u00e0 CPU throttling (\u0111i\u1ec1u ch\u1ec9nh CPU). Tr\u00ean c\u00e1c k\u1ebft n\u1ed1i nhanh v\u00e0 ph\u1ea7n c\u1ee9ng c\u1ee7a m\u00e1y b\u00e0n, \u1ea3nh h\u01b0\u1edfng c\u1ee7a c\u00e1c JavaScript n\u1eb7ng n\u1ec1 c\u00f3 th\u1ec3 ho\u00e0n to\u00e0n kh\u00e1c tr\u00ean thi\u1ebft b\u1ecb di \u0111\u1ed9ng.)<\/li>Ch\u1eb7n c\u00e1c URL ho\u1eb7c t\u00ean mi\u1ec1n \u0111\u1ea1i di\u1ec7n cho JavaScript c\u1ee7a b\u00ean th\u1ee9 b\u1ea1n m\u00e0 b\u1ea1n tin r\u1eb1ng n\u00f3 l\u00e0 v\u1ea5n \u0111\u1ec1.<\/li>T\u1ea3i l\u1ea1i trang v\u00e0 \u0111o \u0111\u1ea1c l\u1ea1i th\u1eddi gian n\u00f3 c\u1ea7n \u0111\u1ec3 t\u1ea3i m\u00e0 kh\u00f4ng c\u1ea7n c\u00e1c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba b\u1ecb ch\u1eb7n.<\/li><\/ol>\n\n\nB\u1ea1n ch\u1eafc h\u1eb3n hy v\u1ecdng th\u1ea5y t\u1ed1c \u0111\u1ed9 \u0111\u01b0\u1ee3c c\u1ea3i thi\u1ec7n, nh\u01b0ng thi tho\u1ea3ng vi\u1ec7c ch\u1eb7n t\u1ec7p l\u1ec7nh c\u1ee7a b\u00ean th\u1ee9 ba c\u00f3 th\u1ec3 kh\u00f4ng c\u00f3 \u0111\u01b0\u1ee3c \u1ea3nh h\u01b0\u1edfng nh\u01b0 b\u1ea1n mong ch\u1edd. N\u1ebfu b\u1ea1n r\u01a1i v\u00e0o tr\u01b0\u1eddng h\u1ee3p \u0111\u00f3, h\u00e3y gi\u1ea3m danh s\u00e1ch c\u00e1c URL b\u1ecb ch\u1eb7n cho \u0111\u1ebfn khi b\u1ea1n c\u00f4 l\u1eadp \u0111\u01b0\u1ee3c m\u1ed9t c\u00e1i l\u00e0 nguy\u00ean nh\u00e2n g\u00e2y ch\u1eadm ch\u1ea1p.<\/p>\n\n\nL\u01b0u \u00fd r\u1eb1ng b\u1ea1n c\u1ea7n th\u1ee9c hi\u1ec7n \u00edt nh\u1ea5t l\u00e0 ba l\u1ea7n ch\u1ea1y \u0111\u1ec3 \u0111o \u0111\u1ea1c v\u00e0 xem x\u00e9t gi\u00e1 tr\u1ecb trung b\u00ecnh, \u0111i\u1ec1u \u0111\u00f3 s\u1ebd cho ra gi\u00e1 tr\u1ecb \u1ed5n \u0111\u1ecbnh h\u01a1n. C\u00e1c n\u1ed9i dung c\u1ee7a b\u00ean th\u1ee9 ba th\u1ec9nh tho\u1ea3ng s\u1ebd k\u00e9o c\u00e1c t\u00e0i nguy\u00ean kh\u00e1c nhau m\u1ed7i khi t\u1ea3i trang, c\u00e1ch ti\u1ebfp c\u1eadn n\u00e0y cho ph\u00e9p b\u1ea1n c\u00f3 \u0111\u01b0\u1ee3c \u01b0\u1edbc t\u00ednh th\u1ef1c t\u1ebf h\u01a1n. DevTools gi\u1edd h\u1ed7 tr\u1ee3 c\u00f9ng l\u00fac nhi\u1ec1u b\u1ea3n ghi trong panel Performance<\/strong>, gi\u00fap b\u1ea1n l\u00e0m \u0111i\u1ec1u n\u00e0y d\u1ec5 d\u00e0ng h\u01a1n m\u1ed9t ch\u00fat.<\/p>\n\n\n(D\u1ecbch t\u1eeb b\u00e0i vi\u1ebft: Identify slow third-party JavaScript, t\u00e1c gi\u1ea3: Milica Mihajlija, trang web[.]dev)<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"Ghi ch\u00fa c\u1ee7a ng\u01b0\u1eddi d\u1ecbch: B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba. …<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[272],"tags":[],"yoast_head":"\nC\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng<\/title>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\t\n\t\n\t\n","yoast_head_json":{"title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_locale":"vi_VN","og_type":"article","og_title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","og_description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","og_url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_site_name":"Ki\u1ebfn c\u00e0ng","article_author":"https:\/\/www.facebook.com\/anhducnguyen87\/","article_published_time":"2020-03-19T08:39:51+00:00","og_image":[{"url":"https:\/\/kiencang.net\/wp-content\/uploads\/2020\/03\/audits-panel-767x1024.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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","isPartOf":{"@id":"https:\/\/kiencang.net\/#website"},"datePublished":"2020-03-19T08:39:51+00:00","dateModified":"2020-03-19T08:39:51+00:00","author":{"@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16"},"description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","breadcrumb":{"@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kiencang.net\/"},{"@type":"ListItem","position":2,"name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm 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\/16863"}],"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=16863"}],"version-history":[{"count":0,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/16863\/revisions"}],"wp:attachment":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media?parent=16863"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/categories?post=16863"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/tags?post=16863"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
Ki\u1ec3m tra Gi\u1ea3m th\u1eddi gian th\u1ef1c thi JavaScript<\/a> \/ Reduce JavaScript execution time<\/em> c\u1ee7a Lighthouse l\u00e0m n\u1ed5i b\u1eadt c\u00e1c m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba m\u1ea5t nhi\u1ec1u th\u1eddi gian \u0111\u1ec3 ph\u00e2n t\u00edch c\u00fa ph\u00e1p (parse), bi\u00ean d\u1ecbch (compile) ho\u1eb7c \u0111\u00e1nh gi\u00e1 (evaluate). Ch\u1ecdn checkbox Show 3rd-party resources<\/strong> (hi\u1ec3n th\u1ecb c\u00e1c t\u00e0i nguy\u00ean c\u1ee7a b\u00ean th\u1ee9 ba) \u0111\u1ec3 ph\u00e1t hi\u1ec7n c\u00e1c \u0111o\u1ea1n m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba g\u00e2y \u00e1p l\u1ef1c th\u1eddi gian l\u00ean CPU.<\/p>\n\n\n<\/figure><\/div>\n\n\n\n\n\n<\/span>Tr\u00e1nh t\u1ea3i tr\u1ecdng m\u1ea1ng l\u1edbn<\/span><\/h2>\n\n\nKi\u1ec3m tra Avoid enormous network payloads \/ Tr\u00e1nh t\u1ea3i tr\u1ecdng m\u1ea1ng l\u1edbn<\/em> x\u00e1c \u0111\u1ecbnh c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng-bao g\u1ed3m nh\u1eefng t\u00e0i nguy\u00ean t\u1eeb b\u00ean th\u1ee9 ba-c\u00e1i c\u00f3 th\u1ec3 l\u00e0m ch\u1eadm th\u1eddi gian t\u1ea3i c\u1ee7a trang. Ki\u1ec3m tra s\u1ebd \u0111\u01b0a ra c\u00e1c c\u1ea3nh b\u00e1o khi t\u1ea3i tr\u1ecdng m\u1ea1ng v\u01b0\u1ee3t qu\u00e1 4000 KB.<\/p>\n\n\n<\/figure><\/div>\n\n\n\n\n\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 15 ph\u00fat<\/span><\/h2>\n\n\nKi\u1ec3m tra c\u1ee7a Lighthouse ch\u1ec9 ph\u00e1t hi\u1ec7n c\u00e1c v\u1ea5n \u0111\u1ec1 nghi\u00eam tr\u1ecdng nh\u1ea5t v\u1ec1 t\u1ed1c \u0111\u1ed9, v\u00ec th\u1ebf b\u1ea1n c\u00f3 th\u1ec3 c\u00f3 nh\u1eefng c\u1ea3i ti\u1ebfn th\u00eam n\u1eefa ngay c\u1ea3 khi trang c\u1ee7a b\u1ea1n v\u01b0\u1ee3t qua t\u1ea5t c\u1ea3 c\u00e1c b\u00e0i ki\u1ec3m tra. C\u00e1c panel Chrome DevTools Network v\u00e0 Performance c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh c\u00e1c \u0111o\u1ea1n m\u00e3 g\u00e2y ch\u1eadm. <\/p>\n\n\n\n\n\n<\/span>Chrome DevTools badging (g\u1eafn huy hi\u1ec7u bi\u1ec3u t\u01b0\u1ee3ng) m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba<\/span><\/h2>\n\n\nDevTools c\u00f3 th\u1ec3 highlight (l\u00e0m n\u1ed5i b\u1eadt) c\u00e1c \u0111o\u1ea1n m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba theo t\u00ean c\u1ee7a nh\u00e0 cung c\u1ea5p trong panel Network<\/strong>. Ch\u1ee9c n\u0103ng n\u00e0y c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba n\u00e0o t\u1ea1o ra y\u00eau c\u1ea7u tr\u00ean trang v\u00e0 bi\u1ebft h\u1ecd \u0111ang l\u00e0m \u0111i\u1ec1u g\u00ec.<\/p>\n\n\n\u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng badge cho b\u00ean th\u1ee9 ba, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Nh\u1ea5n Control+Shift+P<\/em> (ho\u1eb7c Command+Shift+P<\/em> tr\u00ean Mac) \u0111\u1ec3 b\u1eadt menu Command<\/strong>.<\/li>Nh\u1eadp Show third party badges<\/em> v\u00e0o box<\/li><\/ol>\n\n\nGi\u1edd b\u1ea1n c\u00f3 th\u1ec3 th\u1ea5y badges c\u1ee7a b\u00ean th\u1ee9 ba tr\u00ean b\u1ea5t k\u1ef3 trang n\u00e0o b\u1ea1n gh\u00e9 th\u0103m. \u0110\u1ec3 ki\u1ec3m tra \u0111i\u1ec1u n\u00e0y, h\u00e3y th\u1eed truy c\u1eadp trang https:\/\/developers.google.com\/web\/<\/a><\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean Mac) \u0111\u1ec3 m\u1edf DevTools<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Ch\u1ecdn checkbok Disable cache<\/strong> (v\u00f4 hi\u1ec7u h\u00f3a cache).<\/li>T\u1ea3i l\u1ea1i trang.<\/li><\/ol>\n\n\nGi\u1edd b\u1ea1n s\u1ebd th\u1ea5y m\u1ed9t badge b\u00ean c\u1ea1nh t\u1eebng m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba. Click v\u00e0o badge \u0111\u1ec3 hi\u1ec3n th\u1ecb nhi\u1ec1u th\u00f4ng tin h\u01a1n v\u1ec1 \u0111o\u1ea1n m\u00e3 \u0111\u00f3.<\/p>\n\n\n<\/figure><\/div>\n\n\n\u0110\u1ec3 c\u00f3 th\u00eam th\u00f4ng tin v\u1ec1 \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba l\u00ean hi\u1ec7u su\u1ea5t, b\u1ea1n h\u00e3y truy c\u1eadp v\u00e0o trang: https:\/\/www.thirdpartyweb.today\/<\/a>. N\u00f3 s\u1eed d\u1ee5ng d\u1eef li\u1ec7u HTTP Archive<\/a> \u0111\u1ec3 \u0111\u01b0a ra c\u00e1i nh\u00ecn t\u1ed5ng quan v\u1ec1 c\u00e1c nh\u00e0 cung c\u1ea5p c\u1ee7a b\u00ean th\u1ee9 ba v\u00e0 \u1ea3nh h\u01b0\u1edfng c\u1ee7a ch\u00fang l\u00ean web.<\/p>\n\n\n\n\n\n<\/span>Panel hi\u1ec7u su\u1ea5t c\u1ee7a Chrome DevTools<\/span><\/h2>\n\n\nM\u1ed9t khi \u0111\u01b0\u1ee3c b\u1eadt, badge m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba c\u0169ng xu\u1ea5t hi\u1ec7n trong panel Performance<\/strong> DevTools. Panel Performance ghi l\u1ea1i m\u1ed9t b\u1ea3ng waterfall<\/a> \u0111\u1ea1i di\u1ec7n, cho bi\u1ebft trang c\u1ee7a b\u1ea1n \u0111ang ti\u00eau t\u1ed1n th\u1eddi gian \u1edf nh\u1eefng ph\u1ea7n n\u00e0o v\u00e0 c\u00e1ch gi\u00fap b\u1ea1n quan s\u00e1t hi\u1ec7u su\u1ea5t m\u1ed9t c\u00e1ch chi ti\u1ebft.<\/p>\n\n\n\u0110\u1ec3 ghi l\u1ea1i c\u00e1ch trang t\u1ea3i, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Performance<\/strong>.<\/li>Click v\u00e0o n\u00fat Start profiling and reload page<\/strong>.<\/li><\/ol>\n\n\n\u0110\u1ec3 xem c\u00e1c ho\u1ea1t \u0111\u1ed9ng xu\u1ea5t hi\u1ec7n trong lu\u1ed3ng ch\u00ednh c\u1ee7a trang<\/a>, b\u1ea1n h\u00e3y ki\u1ec3m tra khu v\u1ef1c Main<\/strong>. C\u00e1c t\u00e1c v\u1ee5 d\u00e0i (long task)<\/strong> \u0111\u01b0\u1ee3c g\u00e1n nh\u00e3n b\u1eb1ng c\u1ea3nh b\u00e1o c\u1edd m\u00e0u \u0111\u1ecf, \u0111\u1ec3 bi\u1ebft chi ti\u1ebft h\u01a1n v\u1ec1 th\u1eddi gian th\u1ef1c thi, b\u1ea1n h\u00e3y hover qua ch\u00fang.<\/p>\n\n\nThu\u1eadt ng\u1eef quan tr\u1ecdng<\/strong>: M\u1ed9t t\u00e1c v\u1ee5 d\u00e0i<\/a> l\u00e0 m\u1ed9t \u0111o\u1ea1n m\u00e3 JavaScript chi\u1ebfm lu\u1ed3ng ch\u00ednh t\u1eeb 50 ms tr\u1edf l\u00ean, \u0111i\u1ec1u n\u00e0y t\u00e1c \u0111\u1ed9ng l\u00ean nh\u1eadn th\u1ee9c c\u1ee7a ng\u01b0\u1eddi truy c\u1eadp r\u1eb1ng UI (giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng) b\u1ecb \u0111\u01a1 (freeze).<\/p>\n\n\n<\/figure><\/div>\n\n\nB\u1ea1n c\u0169ng c\u00f3 th\u1ec3 s\u1eafp x\u1ebfp c\u00e1c t\u00e1c v\u1ee5 JavaScript theo th\u1eddi gian th\u1ef1c thi \u0111\u1ec3 x\u00e1c \u0111\u1ecbnh t\u00e0i nguy\u00ean b\u00ean th\u1ee9 ba n\u00e0o l\u00e0 ch\u1eadm nh\u1ea5t:<\/p>\n\n\nT\u1ea1i v\u1ecb tr\u00ed cu\u1ed1i c\u00f9ng c\u1ee7a panel Performance<\/strong>, click v\u00e0o tab Bottom-Up<\/strong>.<\/li>Trong danh s\u00e1ch x\u1ed5 xu\u1ed1ng \u0111\u00e3 \u0111\u01b0\u1ee3c nh\u00f3m l\u1ea1i, b\u1ea1n ch\u1ecdn Group by Product<\/strong> (nh\u00f3m theo s\u1ea3n ph\u1ea9m)<\/li><\/ol>\n\n\n<\/figure>\n\n\n\n\n\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 30 ph\u00fat<\/span><\/h2>\n\n\nChrome DevTools v\u1edbi t\u00ednh n\u0103ng ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng (network request blocking) cho ph\u00e9p b\u1ea1n quan s\u00e1t h\u00e0nh vi c\u1ee7a trang khi m\u1ed9t \u0111o\u1ea1n JavaScript, CSS ho\u1eb7c m\u1ed9t ngu\u1ed3n c\u1ee5 th\u1ec3 kh\u00e1c kh\u00f4ng \u0111\u01b0\u1ee3c t\u1ea3i v\u1ec1. Sau khi b\u1ea1n \u0111\u00e3 x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba m\u00e0 b\u1ea1n nghi ng\u1edd \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn hi\u1ec7u su\u1ea5t, b\u1ea1n c\u1ea7n ti\u1ebfn h\u00e0nh ki\u1ec3m tra xem th\u1eddi gian t\u1ea3i s\u1ebd thay \u0111\u1ed5i nh\u01b0 th\u1ebf n\u00e0o b\u1eb1ng c\u00e1ch ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u c\u1ee7a nh\u1eefng \u0111o\u1ea1n JavaScript \u0111\u00f3.<\/p>\n\n\n \u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng ch\u1eb7n y\u00eau c\u1ea7u (request blocking), h\u00e3y l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> ho\u1eb7c (Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Chu\u1ed9t ph\u1ea3i v\u00e0o b\u1ea5t c\u1ee9 y\u00eau c\u1ea7u n\u00e0o trong panel Network<\/strong>.<\/li>Ch\u1ecdn Block request URL<\/strong> (ch\u1eb7n URL y\u00eau c\u1ea7u).<\/li><\/ol>\n\n\n<\/figure><\/div>\n\n\nTab Request blocking<\/strong> s\u1ebd xu\u1ea5t hi\u1ec7n trong DevTools drawer. B\u1ea1n c\u00f3 th\u1ec3 qu\u1ea3n l\u00fd c\u00e1c y\u00eau c\u1ea7u \u0111\u00e3 b\u1ecb ch\u1eb7n \u1edf \u0111\u00f3.<\/p>\n\n\n\u0110\u1ec3 \u0111o \u0111\u1ea1c \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba:<\/p>\n\n\n\u0110o \u0111\u1ea1c l\u01b0\u1ee3ng th\u1eddi gian trang b\u1ea1n c\u1ea7n \u0111\u1ec3 t\u1ea3i v\u1ec1 b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng panel Network. \u0110\u1ec3 gi\u1ea3 l\u1eadp c\u00e1c \u0111i\u1ec1u ki\u1ec7n c\u1ee7a th\u1ebf gi\u1edbi th\u1ef1c, h\u00e3y b\u1eadt network throttling (\u0111i\u1ec1u ch\u1ec9nh m\u1ea1ng) v\u00e0 CPU throttling (\u0111i\u1ec1u ch\u1ec9nh CPU). Tr\u00ean c\u00e1c k\u1ebft n\u1ed1i nhanh v\u00e0 ph\u1ea7n c\u1ee9ng c\u1ee7a m\u00e1y b\u00e0n, \u1ea3nh h\u01b0\u1edfng c\u1ee7a c\u00e1c JavaScript n\u1eb7ng n\u1ec1 c\u00f3 th\u1ec3 ho\u00e0n to\u00e0n kh\u00e1c tr\u00ean thi\u1ebft b\u1ecb di \u0111\u1ed9ng.)<\/li>Ch\u1eb7n c\u00e1c URL ho\u1eb7c t\u00ean mi\u1ec1n \u0111\u1ea1i di\u1ec7n cho JavaScript c\u1ee7a b\u00ean th\u1ee9 b\u1ea1n m\u00e0 b\u1ea1n tin r\u1eb1ng n\u00f3 l\u00e0 v\u1ea5n \u0111\u1ec1.<\/li>T\u1ea3i l\u1ea1i trang v\u00e0 \u0111o \u0111\u1ea1c l\u1ea1i th\u1eddi gian n\u00f3 c\u1ea7n \u0111\u1ec3 t\u1ea3i m\u00e0 kh\u00f4ng c\u1ea7n c\u00e1c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba b\u1ecb ch\u1eb7n.<\/li><\/ol>\n\n\nB\u1ea1n ch\u1eafc h\u1eb3n hy v\u1ecdng th\u1ea5y t\u1ed1c \u0111\u1ed9 \u0111\u01b0\u1ee3c c\u1ea3i thi\u1ec7n, nh\u01b0ng thi tho\u1ea3ng vi\u1ec7c ch\u1eb7n t\u1ec7p l\u1ec7nh c\u1ee7a b\u00ean th\u1ee9 ba c\u00f3 th\u1ec3 kh\u00f4ng c\u00f3 \u0111\u01b0\u1ee3c \u1ea3nh h\u01b0\u1edfng nh\u01b0 b\u1ea1n mong ch\u1edd. N\u1ebfu b\u1ea1n r\u01a1i v\u00e0o tr\u01b0\u1eddng h\u1ee3p \u0111\u00f3, h\u00e3y gi\u1ea3m danh s\u00e1ch c\u00e1c URL b\u1ecb ch\u1eb7n cho \u0111\u1ebfn khi b\u1ea1n c\u00f4 l\u1eadp \u0111\u01b0\u1ee3c m\u1ed9t c\u00e1i l\u00e0 nguy\u00ean nh\u00e2n g\u00e2y ch\u1eadm ch\u1ea1p.<\/p>\n\n\nL\u01b0u \u00fd r\u1eb1ng b\u1ea1n c\u1ea7n th\u1ee9c hi\u1ec7n \u00edt nh\u1ea5t l\u00e0 ba l\u1ea7n ch\u1ea1y \u0111\u1ec3 \u0111o \u0111\u1ea1c v\u00e0 xem x\u00e9t gi\u00e1 tr\u1ecb trung b\u00ecnh, \u0111i\u1ec1u \u0111\u00f3 s\u1ebd cho ra gi\u00e1 tr\u1ecb \u1ed5n \u0111\u1ecbnh h\u01a1n. C\u00e1c n\u1ed9i dung c\u1ee7a b\u00ean th\u1ee9 ba th\u1ec9nh tho\u1ea3ng s\u1ebd k\u00e9o c\u00e1c t\u00e0i nguy\u00ean kh\u00e1c nhau m\u1ed7i khi t\u1ea3i trang, c\u00e1ch ti\u1ebfp c\u1eadn n\u00e0y cho ph\u00e9p b\u1ea1n c\u00f3 \u0111\u01b0\u1ee3c \u01b0\u1edbc t\u00ednh th\u1ef1c t\u1ebf h\u01a1n. DevTools gi\u1edd h\u1ed7 tr\u1ee3 c\u00f9ng l\u00fac nhi\u1ec1u b\u1ea3n ghi trong panel Performance<\/strong>, gi\u00fap b\u1ea1n l\u00e0m \u0111i\u1ec1u n\u00e0y d\u1ec5 d\u00e0ng h\u01a1n m\u1ed9t ch\u00fat.<\/p>\n\n\n(D\u1ecbch t\u1eeb b\u00e0i vi\u1ebft: Identify slow third-party JavaScript, t\u00e1c gi\u1ea3: Milica Mihajlija, trang web[.]dev)<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"Ghi ch\u00fa c\u1ee7a ng\u01b0\u1eddi d\u1ecbch: B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba. …<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[272],"tags":[],"yoast_head":"\nC\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng<\/title>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\t\n\t\n\t\n","yoast_head_json":{"title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_locale":"vi_VN","og_type":"article","og_title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","og_description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","og_url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_site_name":"Ki\u1ebfn c\u00e0ng","article_author":"https:\/\/www.facebook.com\/anhducnguyen87\/","article_published_time":"2020-03-19T08:39:51+00:00","og_image":[{"url":"https:\/\/kiencang.net\/wp-content\/uploads\/2020\/03\/audits-panel-767x1024.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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","isPartOf":{"@id":"https:\/\/kiencang.net\/#website"},"datePublished":"2020-03-19T08:39:51+00:00","dateModified":"2020-03-19T08:39:51+00:00","author":{"@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16"},"description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","breadcrumb":{"@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kiencang.net\/"},{"@type":"ListItem","position":2,"name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm 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\/16863"}],"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=16863"}],"version-history":[{"count":0,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/16863\/revisions"}],"wp:attachment":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media?parent=16863"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/categories?post=16863"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/tags?post=16863"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
Ki\u1ec3m tra Avoid enormous network payloads \/ Tr\u00e1nh t\u1ea3i tr\u1ecdng m\u1ea1ng l\u1edbn<\/em> x\u00e1c \u0111\u1ecbnh c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng-bao g\u1ed3m nh\u1eefng t\u00e0i nguy\u00ean t\u1eeb b\u00ean th\u1ee9 ba-c\u00e1i c\u00f3 th\u1ec3 l\u00e0m ch\u1eadm th\u1eddi gian t\u1ea3i c\u1ee7a trang. Ki\u1ec3m tra s\u1ebd \u0111\u01b0a ra c\u00e1c c\u1ea3nh b\u00e1o khi t\u1ea3i tr\u1ecdng m\u1ea1ng v\u01b0\u1ee3t qu\u00e1 4000 KB.<\/p>\n\n\n<\/figure><\/div>\n\n\n\n\n\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 15 ph\u00fat<\/span><\/h2>\n\n\nKi\u1ec3m tra c\u1ee7a Lighthouse ch\u1ec9 ph\u00e1t hi\u1ec7n c\u00e1c v\u1ea5n \u0111\u1ec1 nghi\u00eam tr\u1ecdng nh\u1ea5t v\u1ec1 t\u1ed1c \u0111\u1ed9, v\u00ec th\u1ebf b\u1ea1n c\u00f3 th\u1ec3 c\u00f3 nh\u1eefng c\u1ea3i ti\u1ebfn th\u00eam n\u1eefa ngay c\u1ea3 khi trang c\u1ee7a b\u1ea1n v\u01b0\u1ee3t qua t\u1ea5t c\u1ea3 c\u00e1c b\u00e0i ki\u1ec3m tra. C\u00e1c panel Chrome DevTools Network v\u00e0 Performance c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh c\u00e1c \u0111o\u1ea1n m\u00e3 g\u00e2y ch\u1eadm. <\/p>\n\n\n\n\n\n<\/span>Chrome DevTools badging (g\u1eafn huy hi\u1ec7u bi\u1ec3u t\u01b0\u1ee3ng) m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba<\/span><\/h2>\n\n\nDevTools c\u00f3 th\u1ec3 highlight (l\u00e0m n\u1ed5i b\u1eadt) c\u00e1c \u0111o\u1ea1n m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba theo t\u00ean c\u1ee7a nh\u00e0 cung c\u1ea5p trong panel Network<\/strong>. Ch\u1ee9c n\u0103ng n\u00e0y c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba n\u00e0o t\u1ea1o ra y\u00eau c\u1ea7u tr\u00ean trang v\u00e0 bi\u1ebft h\u1ecd \u0111ang l\u00e0m \u0111i\u1ec1u g\u00ec.<\/p>\n\n\n\u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng badge cho b\u00ean th\u1ee9 ba, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Nh\u1ea5n Control+Shift+P<\/em> (ho\u1eb7c Command+Shift+P<\/em> tr\u00ean Mac) \u0111\u1ec3 b\u1eadt menu Command<\/strong>.<\/li>Nh\u1eadp Show third party badges<\/em> v\u00e0o box<\/li><\/ol>\n\n\nGi\u1edd b\u1ea1n c\u00f3 th\u1ec3 th\u1ea5y badges c\u1ee7a b\u00ean th\u1ee9 ba tr\u00ean b\u1ea5t k\u1ef3 trang n\u00e0o b\u1ea1n gh\u00e9 th\u0103m. \u0110\u1ec3 ki\u1ec3m tra \u0111i\u1ec1u n\u00e0y, h\u00e3y th\u1eed truy c\u1eadp trang https:\/\/developers.google.com\/web\/<\/a><\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean Mac) \u0111\u1ec3 m\u1edf DevTools<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Ch\u1ecdn checkbok Disable cache<\/strong> (v\u00f4 hi\u1ec7u h\u00f3a cache).<\/li>T\u1ea3i l\u1ea1i trang.<\/li><\/ol>\n\n\nGi\u1edd b\u1ea1n s\u1ebd th\u1ea5y m\u1ed9t badge b\u00ean c\u1ea1nh t\u1eebng m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba. Click v\u00e0o badge \u0111\u1ec3 hi\u1ec3n th\u1ecb nhi\u1ec1u th\u00f4ng tin h\u01a1n v\u1ec1 \u0111o\u1ea1n m\u00e3 \u0111\u00f3.<\/p>\n\n\n<\/figure><\/div>\n\n\n\u0110\u1ec3 c\u00f3 th\u00eam th\u00f4ng tin v\u1ec1 \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba l\u00ean hi\u1ec7u su\u1ea5t, b\u1ea1n h\u00e3y truy c\u1eadp v\u00e0o trang: https:\/\/www.thirdpartyweb.today\/<\/a>. N\u00f3 s\u1eed d\u1ee5ng d\u1eef li\u1ec7u HTTP Archive<\/a> \u0111\u1ec3 \u0111\u01b0a ra c\u00e1i nh\u00ecn t\u1ed5ng quan v\u1ec1 c\u00e1c nh\u00e0 cung c\u1ea5p c\u1ee7a b\u00ean th\u1ee9 ba v\u00e0 \u1ea3nh h\u01b0\u1edfng c\u1ee7a ch\u00fang l\u00ean web.<\/p>\n\n\n\n\n\n<\/span>Panel hi\u1ec7u su\u1ea5t c\u1ee7a Chrome DevTools<\/span><\/h2>\n\n\nM\u1ed9t khi \u0111\u01b0\u1ee3c b\u1eadt, badge m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba c\u0169ng xu\u1ea5t hi\u1ec7n trong panel Performance<\/strong> DevTools. Panel Performance ghi l\u1ea1i m\u1ed9t b\u1ea3ng waterfall<\/a> \u0111\u1ea1i di\u1ec7n, cho bi\u1ebft trang c\u1ee7a b\u1ea1n \u0111ang ti\u00eau t\u1ed1n th\u1eddi gian \u1edf nh\u1eefng ph\u1ea7n n\u00e0o v\u00e0 c\u00e1ch gi\u00fap b\u1ea1n quan s\u00e1t hi\u1ec7u su\u1ea5t m\u1ed9t c\u00e1ch chi ti\u1ebft.<\/p>\n\n\n\u0110\u1ec3 ghi l\u1ea1i c\u00e1ch trang t\u1ea3i, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Performance<\/strong>.<\/li>Click v\u00e0o n\u00fat Start profiling and reload page<\/strong>.<\/li><\/ol>\n\n\n\u0110\u1ec3 xem c\u00e1c ho\u1ea1t \u0111\u1ed9ng xu\u1ea5t hi\u1ec7n trong lu\u1ed3ng ch\u00ednh c\u1ee7a trang<\/a>, b\u1ea1n h\u00e3y ki\u1ec3m tra khu v\u1ef1c Main<\/strong>. C\u00e1c t\u00e1c v\u1ee5 d\u00e0i (long task)<\/strong> \u0111\u01b0\u1ee3c g\u00e1n nh\u00e3n b\u1eb1ng c\u1ea3nh b\u00e1o c\u1edd m\u00e0u \u0111\u1ecf, \u0111\u1ec3 bi\u1ebft chi ti\u1ebft h\u01a1n v\u1ec1 th\u1eddi gian th\u1ef1c thi, b\u1ea1n h\u00e3y hover qua ch\u00fang.<\/p>\n\n\nThu\u1eadt ng\u1eef quan tr\u1ecdng<\/strong>: M\u1ed9t t\u00e1c v\u1ee5 d\u00e0i<\/a> l\u00e0 m\u1ed9t \u0111o\u1ea1n m\u00e3 JavaScript chi\u1ebfm lu\u1ed3ng ch\u00ednh t\u1eeb 50 ms tr\u1edf l\u00ean, \u0111i\u1ec1u n\u00e0y t\u00e1c \u0111\u1ed9ng l\u00ean nh\u1eadn th\u1ee9c c\u1ee7a ng\u01b0\u1eddi truy c\u1eadp r\u1eb1ng UI (giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng) b\u1ecb \u0111\u01a1 (freeze).<\/p>\n\n\n<\/figure><\/div>\n\n\nB\u1ea1n c\u0169ng c\u00f3 th\u1ec3 s\u1eafp x\u1ebfp c\u00e1c t\u00e1c v\u1ee5 JavaScript theo th\u1eddi gian th\u1ef1c thi \u0111\u1ec3 x\u00e1c \u0111\u1ecbnh t\u00e0i nguy\u00ean b\u00ean th\u1ee9 ba n\u00e0o l\u00e0 ch\u1eadm nh\u1ea5t:<\/p>\n\n\nT\u1ea1i v\u1ecb tr\u00ed cu\u1ed1i c\u00f9ng c\u1ee7a panel Performance<\/strong>, click v\u00e0o tab Bottom-Up<\/strong>.<\/li>Trong danh s\u00e1ch x\u1ed5 xu\u1ed1ng \u0111\u00e3 \u0111\u01b0\u1ee3c nh\u00f3m l\u1ea1i, b\u1ea1n ch\u1ecdn Group by Product<\/strong> (nh\u00f3m theo s\u1ea3n ph\u1ea9m)<\/li><\/ol>\n\n\n<\/figure>\n\n\n\n\n\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 30 ph\u00fat<\/span><\/h2>\n\n\nChrome DevTools v\u1edbi t\u00ednh n\u0103ng ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng (network request blocking) cho ph\u00e9p b\u1ea1n quan s\u00e1t h\u00e0nh vi c\u1ee7a trang khi m\u1ed9t \u0111o\u1ea1n JavaScript, CSS ho\u1eb7c m\u1ed9t ngu\u1ed3n c\u1ee5 th\u1ec3 kh\u00e1c kh\u00f4ng \u0111\u01b0\u1ee3c t\u1ea3i v\u1ec1. Sau khi b\u1ea1n \u0111\u00e3 x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba m\u00e0 b\u1ea1n nghi ng\u1edd \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn hi\u1ec7u su\u1ea5t, b\u1ea1n c\u1ea7n ti\u1ebfn h\u00e0nh ki\u1ec3m tra xem th\u1eddi gian t\u1ea3i s\u1ebd thay \u0111\u1ed5i nh\u01b0 th\u1ebf n\u00e0o b\u1eb1ng c\u00e1ch ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u c\u1ee7a nh\u1eefng \u0111o\u1ea1n JavaScript \u0111\u00f3.<\/p>\n\n\n \u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng ch\u1eb7n y\u00eau c\u1ea7u (request blocking), h\u00e3y l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> ho\u1eb7c (Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Chu\u1ed9t ph\u1ea3i v\u00e0o b\u1ea5t c\u1ee9 y\u00eau c\u1ea7u n\u00e0o trong panel Network<\/strong>.<\/li>Ch\u1ecdn Block request URL<\/strong> (ch\u1eb7n URL y\u00eau c\u1ea7u).<\/li><\/ol>\n\n\n<\/figure><\/div>\n\n\nTab Request blocking<\/strong> s\u1ebd xu\u1ea5t hi\u1ec7n trong DevTools drawer. B\u1ea1n c\u00f3 th\u1ec3 qu\u1ea3n l\u00fd c\u00e1c y\u00eau c\u1ea7u \u0111\u00e3 b\u1ecb ch\u1eb7n \u1edf \u0111\u00f3.<\/p>\n\n\n\u0110\u1ec3 \u0111o \u0111\u1ea1c \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba:<\/p>\n\n\n\u0110o \u0111\u1ea1c l\u01b0\u1ee3ng th\u1eddi gian trang b\u1ea1n c\u1ea7n \u0111\u1ec3 t\u1ea3i v\u1ec1 b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng panel Network. \u0110\u1ec3 gi\u1ea3 l\u1eadp c\u00e1c \u0111i\u1ec1u ki\u1ec7n c\u1ee7a th\u1ebf gi\u1edbi th\u1ef1c, h\u00e3y b\u1eadt network throttling (\u0111i\u1ec1u ch\u1ec9nh m\u1ea1ng) v\u00e0 CPU throttling (\u0111i\u1ec1u ch\u1ec9nh CPU). Tr\u00ean c\u00e1c k\u1ebft n\u1ed1i nhanh v\u00e0 ph\u1ea7n c\u1ee9ng c\u1ee7a m\u00e1y b\u00e0n, \u1ea3nh h\u01b0\u1edfng c\u1ee7a c\u00e1c JavaScript n\u1eb7ng n\u1ec1 c\u00f3 th\u1ec3 ho\u00e0n to\u00e0n kh\u00e1c tr\u00ean thi\u1ebft b\u1ecb di \u0111\u1ed9ng.)<\/li>Ch\u1eb7n c\u00e1c URL ho\u1eb7c t\u00ean mi\u1ec1n \u0111\u1ea1i di\u1ec7n cho JavaScript c\u1ee7a b\u00ean th\u1ee9 b\u1ea1n m\u00e0 b\u1ea1n tin r\u1eb1ng n\u00f3 l\u00e0 v\u1ea5n \u0111\u1ec1.<\/li>T\u1ea3i l\u1ea1i trang v\u00e0 \u0111o \u0111\u1ea1c l\u1ea1i th\u1eddi gian n\u00f3 c\u1ea7n \u0111\u1ec3 t\u1ea3i m\u00e0 kh\u00f4ng c\u1ea7n c\u00e1c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba b\u1ecb ch\u1eb7n.<\/li><\/ol>\n\n\nB\u1ea1n ch\u1eafc h\u1eb3n hy v\u1ecdng th\u1ea5y t\u1ed1c \u0111\u1ed9 \u0111\u01b0\u1ee3c c\u1ea3i thi\u1ec7n, nh\u01b0ng thi tho\u1ea3ng vi\u1ec7c ch\u1eb7n t\u1ec7p l\u1ec7nh c\u1ee7a b\u00ean th\u1ee9 ba c\u00f3 th\u1ec3 kh\u00f4ng c\u00f3 \u0111\u01b0\u1ee3c \u1ea3nh h\u01b0\u1edfng nh\u01b0 b\u1ea1n mong ch\u1edd. N\u1ebfu b\u1ea1n r\u01a1i v\u00e0o tr\u01b0\u1eddng h\u1ee3p \u0111\u00f3, h\u00e3y gi\u1ea3m danh s\u00e1ch c\u00e1c URL b\u1ecb ch\u1eb7n cho \u0111\u1ebfn khi b\u1ea1n c\u00f4 l\u1eadp \u0111\u01b0\u1ee3c m\u1ed9t c\u00e1i l\u00e0 nguy\u00ean nh\u00e2n g\u00e2y ch\u1eadm ch\u1ea1p.<\/p>\n\n\nL\u01b0u \u00fd r\u1eb1ng b\u1ea1n c\u1ea7n th\u1ee9c hi\u1ec7n \u00edt nh\u1ea5t l\u00e0 ba l\u1ea7n ch\u1ea1y \u0111\u1ec3 \u0111o \u0111\u1ea1c v\u00e0 xem x\u00e9t gi\u00e1 tr\u1ecb trung b\u00ecnh, \u0111i\u1ec1u \u0111\u00f3 s\u1ebd cho ra gi\u00e1 tr\u1ecb \u1ed5n \u0111\u1ecbnh h\u01a1n. C\u00e1c n\u1ed9i dung c\u1ee7a b\u00ean th\u1ee9 ba th\u1ec9nh tho\u1ea3ng s\u1ebd k\u00e9o c\u00e1c t\u00e0i nguy\u00ean kh\u00e1c nhau m\u1ed7i khi t\u1ea3i trang, c\u00e1ch ti\u1ebfp c\u1eadn n\u00e0y cho ph\u00e9p b\u1ea1n c\u00f3 \u0111\u01b0\u1ee3c \u01b0\u1edbc t\u00ednh th\u1ef1c t\u1ebf h\u01a1n. DevTools gi\u1edd h\u1ed7 tr\u1ee3 c\u00f9ng l\u00fac nhi\u1ec1u b\u1ea3n ghi trong panel Performance<\/strong>, gi\u00fap b\u1ea1n l\u00e0m \u0111i\u1ec1u n\u00e0y d\u1ec5 d\u00e0ng h\u01a1n m\u1ed9t ch\u00fat.<\/p>\n\n\n(D\u1ecbch t\u1eeb b\u00e0i vi\u1ebft: Identify slow third-party JavaScript, t\u00e1c gi\u1ea3: Milica Mihajlija, trang web[.]dev)<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"Ghi ch\u00fa c\u1ee7a ng\u01b0\u1eddi d\u1ecbch: B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba. …<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[272],"tags":[],"yoast_head":"\nC\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng<\/title>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\t\n\t\n\t\n","yoast_head_json":{"title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_locale":"vi_VN","og_type":"article","og_title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","og_description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","og_url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_site_name":"Ki\u1ebfn c\u00e0ng","article_author":"https:\/\/www.facebook.com\/anhducnguyen87\/","article_published_time":"2020-03-19T08:39:51+00:00","og_image":[{"url":"https:\/\/kiencang.net\/wp-content\/uploads\/2020\/03\/audits-panel-767x1024.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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","isPartOf":{"@id":"https:\/\/kiencang.net\/#website"},"datePublished":"2020-03-19T08:39:51+00:00","dateModified":"2020-03-19T08:39:51+00:00","author":{"@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16"},"description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","breadcrumb":{"@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kiencang.net\/"},{"@type":"ListItem","position":2,"name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm 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\/16863"}],"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=16863"}],"version-history":[{"count":0,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/16863\/revisions"}],"wp:attachment":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media?parent=16863"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/categories?post=16863"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/tags?post=16863"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
Ki\u1ec3m tra c\u1ee7a Lighthouse ch\u1ec9 ph\u00e1t hi\u1ec7n c\u00e1c v\u1ea5n \u0111\u1ec1 nghi\u00eam tr\u1ecdng nh\u1ea5t v\u1ec1 t\u1ed1c \u0111\u1ed9, v\u00ec th\u1ebf b\u1ea1n c\u00f3 th\u1ec3 c\u00f3 nh\u1eefng c\u1ea3i ti\u1ebfn th\u00eam n\u1eefa ngay c\u1ea3 khi trang c\u1ee7a b\u1ea1n v\u01b0\u1ee3t qua t\u1ea5t c\u1ea3 c\u00e1c b\u00e0i ki\u1ec3m tra. C\u00e1c panel Chrome DevTools Network v\u00e0 Performance c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh c\u00e1c \u0111o\u1ea1n m\u00e3 g\u00e2y ch\u1eadm. <\/p>\n\n\n
DevTools c\u00f3 th\u1ec3 highlight (l\u00e0m n\u1ed5i b\u1eadt) c\u00e1c \u0111o\u1ea1n m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba theo t\u00ean c\u1ee7a nh\u00e0 cung c\u1ea5p trong panel Network<\/strong>. Ch\u1ee9c n\u0103ng n\u00e0y c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh m\u00e3 t\u1eeb b\u00ean th\u1ee9 ba n\u00e0o t\u1ea1o ra y\u00eau c\u1ea7u tr\u00ean trang v\u00e0 bi\u1ebft h\u1ecd \u0111ang l\u00e0m \u0111i\u1ec1u g\u00ec.<\/p>\n\n\n\u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng badge cho b\u00ean th\u1ee9 ba, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Nh\u1ea5n Control+Shift+P<\/em> (ho\u1eb7c Command+Shift+P<\/em> tr\u00ean Mac) \u0111\u1ec3 b\u1eadt menu Command<\/strong>.<\/li>Nh\u1eadp Show third party badges<\/em> v\u00e0o box<\/li><\/ol>\n\n\nGi\u1edd b\u1ea1n c\u00f3 th\u1ec3 th\u1ea5y badges c\u1ee7a b\u00ean th\u1ee9 ba tr\u00ean b\u1ea5t k\u1ef3 trang n\u00e0o b\u1ea1n gh\u00e9 th\u0103m. \u0110\u1ec3 ki\u1ec3m tra \u0111i\u1ec1u n\u00e0y, h\u00e3y th\u1eed truy c\u1eadp trang https:\/\/developers.google.com\/web\/<\/a><\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean Mac) \u0111\u1ec3 m\u1edf DevTools<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Ch\u1ecdn checkbok Disable cache<\/strong> (v\u00f4 hi\u1ec7u h\u00f3a cache).<\/li>T\u1ea3i l\u1ea1i trang.<\/li><\/ol>\n\n\nGi\u1edd b\u1ea1n s\u1ebd th\u1ea5y m\u1ed9t badge b\u00ean c\u1ea1nh t\u1eebng m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba. Click v\u00e0o badge \u0111\u1ec3 hi\u1ec3n th\u1ecb nhi\u1ec1u th\u00f4ng tin h\u01a1n v\u1ec1 \u0111o\u1ea1n m\u00e3 \u0111\u00f3.<\/p>\n\n\n<\/figure><\/div>\n\n\n\u0110\u1ec3 c\u00f3 th\u00eam th\u00f4ng tin v\u1ec1 \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba l\u00ean hi\u1ec7u su\u1ea5t, b\u1ea1n h\u00e3y truy c\u1eadp v\u00e0o trang: https:\/\/www.thirdpartyweb.today\/<\/a>. N\u00f3 s\u1eed d\u1ee5ng d\u1eef li\u1ec7u HTTP Archive<\/a> \u0111\u1ec3 \u0111\u01b0a ra c\u00e1i nh\u00ecn t\u1ed5ng quan v\u1ec1 c\u00e1c nh\u00e0 cung c\u1ea5p c\u1ee7a b\u00ean th\u1ee9 ba v\u00e0 \u1ea3nh h\u01b0\u1edfng c\u1ee7a ch\u00fang l\u00ean web.<\/p>\n\n\n\n\n\n<\/span>Panel hi\u1ec7u su\u1ea5t c\u1ee7a Chrome DevTools<\/span><\/h2>\n\n\nM\u1ed9t khi \u0111\u01b0\u1ee3c b\u1eadt, badge m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba c\u0169ng xu\u1ea5t hi\u1ec7n trong panel Performance<\/strong> DevTools. Panel Performance ghi l\u1ea1i m\u1ed9t b\u1ea3ng waterfall<\/a> \u0111\u1ea1i di\u1ec7n, cho bi\u1ebft trang c\u1ee7a b\u1ea1n \u0111ang ti\u00eau t\u1ed1n th\u1eddi gian \u1edf nh\u1eefng ph\u1ea7n n\u00e0o v\u00e0 c\u00e1ch gi\u00fap b\u1ea1n quan s\u00e1t hi\u1ec7u su\u1ea5t m\u1ed9t c\u00e1ch chi ti\u1ebft.<\/p>\n\n\n\u0110\u1ec3 ghi l\u1ea1i c\u00e1ch trang t\u1ea3i, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Performance<\/strong>.<\/li>Click v\u00e0o n\u00fat Start profiling and reload page<\/strong>.<\/li><\/ol>\n\n\n\u0110\u1ec3 xem c\u00e1c ho\u1ea1t \u0111\u1ed9ng xu\u1ea5t hi\u1ec7n trong lu\u1ed3ng ch\u00ednh c\u1ee7a trang<\/a>, b\u1ea1n h\u00e3y ki\u1ec3m tra khu v\u1ef1c Main<\/strong>. C\u00e1c t\u00e1c v\u1ee5 d\u00e0i (long task)<\/strong> \u0111\u01b0\u1ee3c g\u00e1n nh\u00e3n b\u1eb1ng c\u1ea3nh b\u00e1o c\u1edd m\u00e0u \u0111\u1ecf, \u0111\u1ec3 bi\u1ebft chi ti\u1ebft h\u01a1n v\u1ec1 th\u1eddi gian th\u1ef1c thi, b\u1ea1n h\u00e3y hover qua ch\u00fang.<\/p>\n\n\nThu\u1eadt ng\u1eef quan tr\u1ecdng<\/strong>: M\u1ed9t t\u00e1c v\u1ee5 d\u00e0i<\/a> l\u00e0 m\u1ed9t \u0111o\u1ea1n m\u00e3 JavaScript chi\u1ebfm lu\u1ed3ng ch\u00ednh t\u1eeb 50 ms tr\u1edf l\u00ean, \u0111i\u1ec1u n\u00e0y t\u00e1c \u0111\u1ed9ng l\u00ean nh\u1eadn th\u1ee9c c\u1ee7a ng\u01b0\u1eddi truy c\u1eadp r\u1eb1ng UI (giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng) b\u1ecb \u0111\u01a1 (freeze).<\/p>\n\n\n<\/figure><\/div>\n\n\nB\u1ea1n c\u0169ng c\u00f3 th\u1ec3 s\u1eafp x\u1ebfp c\u00e1c t\u00e1c v\u1ee5 JavaScript theo th\u1eddi gian th\u1ef1c thi \u0111\u1ec3 x\u00e1c \u0111\u1ecbnh t\u00e0i nguy\u00ean b\u00ean th\u1ee9 ba n\u00e0o l\u00e0 ch\u1eadm nh\u1ea5t:<\/p>\n\n\nT\u1ea1i v\u1ecb tr\u00ed cu\u1ed1i c\u00f9ng c\u1ee7a panel Performance<\/strong>, click v\u00e0o tab Bottom-Up<\/strong>.<\/li>Trong danh s\u00e1ch x\u1ed5 xu\u1ed1ng \u0111\u00e3 \u0111\u01b0\u1ee3c nh\u00f3m l\u1ea1i, b\u1ea1n ch\u1ecdn Group by Product<\/strong> (nh\u00f3m theo s\u1ea3n ph\u1ea9m)<\/li><\/ol>\n\n\n<\/figure>\n\n\n\n\n\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 30 ph\u00fat<\/span><\/h2>\n\n\nChrome DevTools v\u1edbi t\u00ednh n\u0103ng ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng (network request blocking) cho ph\u00e9p b\u1ea1n quan s\u00e1t h\u00e0nh vi c\u1ee7a trang khi m\u1ed9t \u0111o\u1ea1n JavaScript, CSS ho\u1eb7c m\u1ed9t ngu\u1ed3n c\u1ee5 th\u1ec3 kh\u00e1c kh\u00f4ng \u0111\u01b0\u1ee3c t\u1ea3i v\u1ec1. Sau khi b\u1ea1n \u0111\u00e3 x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba m\u00e0 b\u1ea1n nghi ng\u1edd \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn hi\u1ec7u su\u1ea5t, b\u1ea1n c\u1ea7n ti\u1ebfn h\u00e0nh ki\u1ec3m tra xem th\u1eddi gian t\u1ea3i s\u1ebd thay \u0111\u1ed5i nh\u01b0 th\u1ebf n\u00e0o b\u1eb1ng c\u00e1ch ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u c\u1ee7a nh\u1eefng \u0111o\u1ea1n JavaScript \u0111\u00f3.<\/p>\n\n\n \u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng ch\u1eb7n y\u00eau c\u1ea7u (request blocking), h\u00e3y l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> ho\u1eb7c (Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Chu\u1ed9t ph\u1ea3i v\u00e0o b\u1ea5t c\u1ee9 y\u00eau c\u1ea7u n\u00e0o trong panel Network<\/strong>.<\/li>Ch\u1ecdn Block request URL<\/strong> (ch\u1eb7n URL y\u00eau c\u1ea7u).<\/li><\/ol>\n\n\n<\/figure><\/div>\n\n\nTab Request blocking<\/strong> s\u1ebd xu\u1ea5t hi\u1ec7n trong DevTools drawer. B\u1ea1n c\u00f3 th\u1ec3 qu\u1ea3n l\u00fd c\u00e1c y\u00eau c\u1ea7u \u0111\u00e3 b\u1ecb ch\u1eb7n \u1edf \u0111\u00f3.<\/p>\n\n\n\u0110\u1ec3 \u0111o \u0111\u1ea1c \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba:<\/p>\n\n\n\u0110o \u0111\u1ea1c l\u01b0\u1ee3ng th\u1eddi gian trang b\u1ea1n c\u1ea7n \u0111\u1ec3 t\u1ea3i v\u1ec1 b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng panel Network. \u0110\u1ec3 gi\u1ea3 l\u1eadp c\u00e1c \u0111i\u1ec1u ki\u1ec7n c\u1ee7a th\u1ebf gi\u1edbi th\u1ef1c, h\u00e3y b\u1eadt network throttling (\u0111i\u1ec1u ch\u1ec9nh m\u1ea1ng) v\u00e0 CPU throttling (\u0111i\u1ec1u ch\u1ec9nh CPU). Tr\u00ean c\u00e1c k\u1ebft n\u1ed1i nhanh v\u00e0 ph\u1ea7n c\u1ee9ng c\u1ee7a m\u00e1y b\u00e0n, \u1ea3nh h\u01b0\u1edfng c\u1ee7a c\u00e1c JavaScript n\u1eb7ng n\u1ec1 c\u00f3 th\u1ec3 ho\u00e0n to\u00e0n kh\u00e1c tr\u00ean thi\u1ebft b\u1ecb di \u0111\u1ed9ng.)<\/li>Ch\u1eb7n c\u00e1c URL ho\u1eb7c t\u00ean mi\u1ec1n \u0111\u1ea1i di\u1ec7n cho JavaScript c\u1ee7a b\u00ean th\u1ee9 b\u1ea1n m\u00e0 b\u1ea1n tin r\u1eb1ng n\u00f3 l\u00e0 v\u1ea5n \u0111\u1ec1.<\/li>T\u1ea3i l\u1ea1i trang v\u00e0 \u0111o \u0111\u1ea1c l\u1ea1i th\u1eddi gian n\u00f3 c\u1ea7n \u0111\u1ec3 t\u1ea3i m\u00e0 kh\u00f4ng c\u1ea7n c\u00e1c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba b\u1ecb ch\u1eb7n.<\/li><\/ol>\n\n\nB\u1ea1n ch\u1eafc h\u1eb3n hy v\u1ecdng th\u1ea5y t\u1ed1c \u0111\u1ed9 \u0111\u01b0\u1ee3c c\u1ea3i thi\u1ec7n, nh\u01b0ng thi tho\u1ea3ng vi\u1ec7c ch\u1eb7n t\u1ec7p l\u1ec7nh c\u1ee7a b\u00ean th\u1ee9 ba c\u00f3 th\u1ec3 kh\u00f4ng c\u00f3 \u0111\u01b0\u1ee3c \u1ea3nh h\u01b0\u1edfng nh\u01b0 b\u1ea1n mong ch\u1edd. N\u1ebfu b\u1ea1n r\u01a1i v\u00e0o tr\u01b0\u1eddng h\u1ee3p \u0111\u00f3, h\u00e3y gi\u1ea3m danh s\u00e1ch c\u00e1c URL b\u1ecb ch\u1eb7n cho \u0111\u1ebfn khi b\u1ea1n c\u00f4 l\u1eadp \u0111\u01b0\u1ee3c m\u1ed9t c\u00e1i l\u00e0 nguy\u00ean nh\u00e2n g\u00e2y ch\u1eadm ch\u1ea1p.<\/p>\n\n\nL\u01b0u \u00fd r\u1eb1ng b\u1ea1n c\u1ea7n th\u1ee9c hi\u1ec7n \u00edt nh\u1ea5t l\u00e0 ba l\u1ea7n ch\u1ea1y \u0111\u1ec3 \u0111o \u0111\u1ea1c v\u00e0 xem x\u00e9t gi\u00e1 tr\u1ecb trung b\u00ecnh, \u0111i\u1ec1u \u0111\u00f3 s\u1ebd cho ra gi\u00e1 tr\u1ecb \u1ed5n \u0111\u1ecbnh h\u01a1n. C\u00e1c n\u1ed9i dung c\u1ee7a b\u00ean th\u1ee9 ba th\u1ec9nh tho\u1ea3ng s\u1ebd k\u00e9o c\u00e1c t\u00e0i nguy\u00ean kh\u00e1c nhau m\u1ed7i khi t\u1ea3i trang, c\u00e1ch ti\u1ebfp c\u1eadn n\u00e0y cho ph\u00e9p b\u1ea1n c\u00f3 \u0111\u01b0\u1ee3c \u01b0\u1edbc t\u00ednh th\u1ef1c t\u1ebf h\u01a1n. DevTools gi\u1edd h\u1ed7 tr\u1ee3 c\u00f9ng l\u00fac nhi\u1ec1u b\u1ea3n ghi trong panel Performance<\/strong>, gi\u00fap b\u1ea1n l\u00e0m \u0111i\u1ec1u n\u00e0y d\u1ec5 d\u00e0ng h\u01a1n m\u1ed9t ch\u00fat.<\/p>\n\n\n(D\u1ecbch t\u1eeb b\u00e0i vi\u1ebft: Identify slow third-party JavaScript, t\u00e1c gi\u1ea3: Milica Mihajlija, trang web[.]dev)<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"Ghi ch\u00fa c\u1ee7a ng\u01b0\u1eddi d\u1ecbch: B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba. …<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[272],"tags":[],"yoast_head":"\nC\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng<\/title>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\t\n\t\n\t\n","yoast_head_json":{"title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_locale":"vi_VN","og_type":"article","og_title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","og_description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","og_url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_site_name":"Ki\u1ebfn c\u00e0ng","article_author":"https:\/\/www.facebook.com\/anhducnguyen87\/","article_published_time":"2020-03-19T08:39:51+00:00","og_image":[{"url":"https:\/\/kiencang.net\/wp-content\/uploads\/2020\/03\/audits-panel-767x1024.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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","isPartOf":{"@id":"https:\/\/kiencang.net\/#website"},"datePublished":"2020-03-19T08:39:51+00:00","dateModified":"2020-03-19T08:39:51+00:00","author":{"@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16"},"description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","breadcrumb":{"@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kiencang.net\/"},{"@type":"ListItem","position":2,"name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm 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\/16863"}],"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=16863"}],"version-history":[{"count":0,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/16863\/revisions"}],"wp:attachment":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media?parent=16863"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/categories?post=16863"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/tags?post=16863"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
\u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng badge cho b\u00ean th\u1ee9 ba, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\n
Gi\u1edd b\u1ea1n c\u00f3 th\u1ec3 th\u1ea5y badges c\u1ee7a b\u00ean th\u1ee9 ba tr\u00ean b\u1ea5t k\u1ef3 trang n\u00e0o b\u1ea1n gh\u00e9 th\u0103m. \u0110\u1ec3 ki\u1ec3m tra \u0111i\u1ec1u n\u00e0y, h\u00e3y th\u1eed truy c\u1eadp trang https:\/\/developers.google.com\/web\/<\/a><\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean Mac) \u0111\u1ec3 m\u1edf DevTools<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Ch\u1ecdn checkbok Disable cache<\/strong> (v\u00f4 hi\u1ec7u h\u00f3a cache).<\/li>T\u1ea3i l\u1ea1i trang.<\/li><\/ol>\n\n\nGi\u1edd b\u1ea1n s\u1ebd th\u1ea5y m\u1ed9t badge b\u00ean c\u1ea1nh t\u1eebng m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba. Click v\u00e0o badge \u0111\u1ec3 hi\u1ec3n th\u1ecb nhi\u1ec1u th\u00f4ng tin h\u01a1n v\u1ec1 \u0111o\u1ea1n m\u00e3 \u0111\u00f3.<\/p>\n\n\n<\/figure><\/div>\n\n\n\u0110\u1ec3 c\u00f3 th\u00eam th\u00f4ng tin v\u1ec1 \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba l\u00ean hi\u1ec7u su\u1ea5t, b\u1ea1n h\u00e3y truy c\u1eadp v\u00e0o trang: https:\/\/www.thirdpartyweb.today\/<\/a>. N\u00f3 s\u1eed d\u1ee5ng d\u1eef li\u1ec7u HTTP Archive<\/a> \u0111\u1ec3 \u0111\u01b0a ra c\u00e1i nh\u00ecn t\u1ed5ng quan v\u1ec1 c\u00e1c nh\u00e0 cung c\u1ea5p c\u1ee7a b\u00ean th\u1ee9 ba v\u00e0 \u1ea3nh h\u01b0\u1edfng c\u1ee7a ch\u00fang l\u00ean web.<\/p>\n\n\n\n\n\n<\/span>Panel hi\u1ec7u su\u1ea5t c\u1ee7a Chrome DevTools<\/span><\/h2>\n\n\nM\u1ed9t khi \u0111\u01b0\u1ee3c b\u1eadt, badge m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba c\u0169ng xu\u1ea5t hi\u1ec7n trong panel Performance<\/strong> DevTools. Panel Performance ghi l\u1ea1i m\u1ed9t b\u1ea3ng waterfall<\/a> \u0111\u1ea1i di\u1ec7n, cho bi\u1ebft trang c\u1ee7a b\u1ea1n \u0111ang ti\u00eau t\u1ed1n th\u1eddi gian \u1edf nh\u1eefng ph\u1ea7n n\u00e0o v\u00e0 c\u00e1ch gi\u00fap b\u1ea1n quan s\u00e1t hi\u1ec7u su\u1ea5t m\u1ed9t c\u00e1ch chi ti\u1ebft.<\/p>\n\n\n\u0110\u1ec3 ghi l\u1ea1i c\u00e1ch trang t\u1ea3i, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Performance<\/strong>.<\/li>Click v\u00e0o n\u00fat Start profiling and reload page<\/strong>.<\/li><\/ol>\n\n\n\u0110\u1ec3 xem c\u00e1c ho\u1ea1t \u0111\u1ed9ng xu\u1ea5t hi\u1ec7n trong lu\u1ed3ng ch\u00ednh c\u1ee7a trang<\/a>, b\u1ea1n h\u00e3y ki\u1ec3m tra khu v\u1ef1c Main<\/strong>. C\u00e1c t\u00e1c v\u1ee5 d\u00e0i (long task)<\/strong> \u0111\u01b0\u1ee3c g\u00e1n nh\u00e3n b\u1eb1ng c\u1ea3nh b\u00e1o c\u1edd m\u00e0u \u0111\u1ecf, \u0111\u1ec3 bi\u1ebft chi ti\u1ebft h\u01a1n v\u1ec1 th\u1eddi gian th\u1ef1c thi, b\u1ea1n h\u00e3y hover qua ch\u00fang.<\/p>\n\n\nThu\u1eadt ng\u1eef quan tr\u1ecdng<\/strong>: M\u1ed9t t\u00e1c v\u1ee5 d\u00e0i<\/a> l\u00e0 m\u1ed9t \u0111o\u1ea1n m\u00e3 JavaScript chi\u1ebfm lu\u1ed3ng ch\u00ednh t\u1eeb 50 ms tr\u1edf l\u00ean, \u0111i\u1ec1u n\u00e0y t\u00e1c \u0111\u1ed9ng l\u00ean nh\u1eadn th\u1ee9c c\u1ee7a ng\u01b0\u1eddi truy c\u1eadp r\u1eb1ng UI (giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng) b\u1ecb \u0111\u01a1 (freeze).<\/p>\n\n\n<\/figure><\/div>\n\n\nB\u1ea1n c\u0169ng c\u00f3 th\u1ec3 s\u1eafp x\u1ebfp c\u00e1c t\u00e1c v\u1ee5 JavaScript theo th\u1eddi gian th\u1ef1c thi \u0111\u1ec3 x\u00e1c \u0111\u1ecbnh t\u00e0i nguy\u00ean b\u00ean th\u1ee9 ba n\u00e0o l\u00e0 ch\u1eadm nh\u1ea5t:<\/p>\n\n\nT\u1ea1i v\u1ecb tr\u00ed cu\u1ed1i c\u00f9ng c\u1ee7a panel Performance<\/strong>, click v\u00e0o tab Bottom-Up<\/strong>.<\/li>Trong danh s\u00e1ch x\u1ed5 xu\u1ed1ng \u0111\u00e3 \u0111\u01b0\u1ee3c nh\u00f3m l\u1ea1i, b\u1ea1n ch\u1ecdn Group by Product<\/strong> (nh\u00f3m theo s\u1ea3n ph\u1ea9m)<\/li><\/ol>\n\n\n<\/figure>\n\n\n\n\n\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 30 ph\u00fat<\/span><\/h2>\n\n\nChrome DevTools v\u1edbi t\u00ednh n\u0103ng ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng (network request blocking) cho ph\u00e9p b\u1ea1n quan s\u00e1t h\u00e0nh vi c\u1ee7a trang khi m\u1ed9t \u0111o\u1ea1n JavaScript, CSS ho\u1eb7c m\u1ed9t ngu\u1ed3n c\u1ee5 th\u1ec3 kh\u00e1c kh\u00f4ng \u0111\u01b0\u1ee3c t\u1ea3i v\u1ec1. Sau khi b\u1ea1n \u0111\u00e3 x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba m\u00e0 b\u1ea1n nghi ng\u1edd \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn hi\u1ec7u su\u1ea5t, b\u1ea1n c\u1ea7n ti\u1ebfn h\u00e0nh ki\u1ec3m tra xem th\u1eddi gian t\u1ea3i s\u1ebd thay \u0111\u1ed5i nh\u01b0 th\u1ebf n\u00e0o b\u1eb1ng c\u00e1ch ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u c\u1ee7a nh\u1eefng \u0111o\u1ea1n JavaScript \u0111\u00f3.<\/p>\n\n\n \u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng ch\u1eb7n y\u00eau c\u1ea7u (request blocking), h\u00e3y l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> ho\u1eb7c (Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Chu\u1ed9t ph\u1ea3i v\u00e0o b\u1ea5t c\u1ee9 y\u00eau c\u1ea7u n\u00e0o trong panel Network<\/strong>.<\/li>Ch\u1ecdn Block request URL<\/strong> (ch\u1eb7n URL y\u00eau c\u1ea7u).<\/li><\/ol>\n\n\n<\/figure><\/div>\n\n\nTab Request blocking<\/strong> s\u1ebd xu\u1ea5t hi\u1ec7n trong DevTools drawer. B\u1ea1n c\u00f3 th\u1ec3 qu\u1ea3n l\u00fd c\u00e1c y\u00eau c\u1ea7u \u0111\u00e3 b\u1ecb ch\u1eb7n \u1edf \u0111\u00f3.<\/p>\n\n\n\u0110\u1ec3 \u0111o \u0111\u1ea1c \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba:<\/p>\n\n\n\u0110o \u0111\u1ea1c l\u01b0\u1ee3ng th\u1eddi gian trang b\u1ea1n c\u1ea7n \u0111\u1ec3 t\u1ea3i v\u1ec1 b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng panel Network. \u0110\u1ec3 gi\u1ea3 l\u1eadp c\u00e1c \u0111i\u1ec1u ki\u1ec7n c\u1ee7a th\u1ebf gi\u1edbi th\u1ef1c, h\u00e3y b\u1eadt network throttling (\u0111i\u1ec1u ch\u1ec9nh m\u1ea1ng) v\u00e0 CPU throttling (\u0111i\u1ec1u ch\u1ec9nh CPU). Tr\u00ean c\u00e1c k\u1ebft n\u1ed1i nhanh v\u00e0 ph\u1ea7n c\u1ee9ng c\u1ee7a m\u00e1y b\u00e0n, \u1ea3nh h\u01b0\u1edfng c\u1ee7a c\u00e1c JavaScript n\u1eb7ng n\u1ec1 c\u00f3 th\u1ec3 ho\u00e0n to\u00e0n kh\u00e1c tr\u00ean thi\u1ebft b\u1ecb di \u0111\u1ed9ng.)<\/li>Ch\u1eb7n c\u00e1c URL ho\u1eb7c t\u00ean mi\u1ec1n \u0111\u1ea1i di\u1ec7n cho JavaScript c\u1ee7a b\u00ean th\u1ee9 b\u1ea1n m\u00e0 b\u1ea1n tin r\u1eb1ng n\u00f3 l\u00e0 v\u1ea5n \u0111\u1ec1.<\/li>T\u1ea3i l\u1ea1i trang v\u00e0 \u0111o \u0111\u1ea1c l\u1ea1i th\u1eddi gian n\u00f3 c\u1ea7n \u0111\u1ec3 t\u1ea3i m\u00e0 kh\u00f4ng c\u1ea7n c\u00e1c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba b\u1ecb ch\u1eb7n.<\/li><\/ol>\n\n\nB\u1ea1n ch\u1eafc h\u1eb3n hy v\u1ecdng th\u1ea5y t\u1ed1c \u0111\u1ed9 \u0111\u01b0\u1ee3c c\u1ea3i thi\u1ec7n, nh\u01b0ng thi tho\u1ea3ng vi\u1ec7c ch\u1eb7n t\u1ec7p l\u1ec7nh c\u1ee7a b\u00ean th\u1ee9 ba c\u00f3 th\u1ec3 kh\u00f4ng c\u00f3 \u0111\u01b0\u1ee3c \u1ea3nh h\u01b0\u1edfng nh\u01b0 b\u1ea1n mong ch\u1edd. N\u1ebfu b\u1ea1n r\u01a1i v\u00e0o tr\u01b0\u1eddng h\u1ee3p \u0111\u00f3, h\u00e3y gi\u1ea3m danh s\u00e1ch c\u00e1c URL b\u1ecb ch\u1eb7n cho \u0111\u1ebfn khi b\u1ea1n c\u00f4 l\u1eadp \u0111\u01b0\u1ee3c m\u1ed9t c\u00e1i l\u00e0 nguy\u00ean nh\u00e2n g\u00e2y ch\u1eadm ch\u1ea1p.<\/p>\n\n\nL\u01b0u \u00fd r\u1eb1ng b\u1ea1n c\u1ea7n th\u1ee9c hi\u1ec7n \u00edt nh\u1ea5t l\u00e0 ba l\u1ea7n ch\u1ea1y \u0111\u1ec3 \u0111o \u0111\u1ea1c v\u00e0 xem x\u00e9t gi\u00e1 tr\u1ecb trung b\u00ecnh, \u0111i\u1ec1u \u0111\u00f3 s\u1ebd cho ra gi\u00e1 tr\u1ecb \u1ed5n \u0111\u1ecbnh h\u01a1n. C\u00e1c n\u1ed9i dung c\u1ee7a b\u00ean th\u1ee9 ba th\u1ec9nh tho\u1ea3ng s\u1ebd k\u00e9o c\u00e1c t\u00e0i nguy\u00ean kh\u00e1c nhau m\u1ed7i khi t\u1ea3i trang, c\u00e1ch ti\u1ebfp c\u1eadn n\u00e0y cho ph\u00e9p b\u1ea1n c\u00f3 \u0111\u01b0\u1ee3c \u01b0\u1edbc t\u00ednh th\u1ef1c t\u1ebf h\u01a1n. DevTools gi\u1edd h\u1ed7 tr\u1ee3 c\u00f9ng l\u00fac nhi\u1ec1u b\u1ea3n ghi trong panel Performance<\/strong>, gi\u00fap b\u1ea1n l\u00e0m \u0111i\u1ec1u n\u00e0y d\u1ec5 d\u00e0ng h\u01a1n m\u1ed9t ch\u00fat.<\/p>\n\n\n(D\u1ecbch t\u1eeb b\u00e0i vi\u1ebft: Identify slow third-party JavaScript, t\u00e1c gi\u1ea3: Milica Mihajlija, trang web[.]dev)<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"Ghi ch\u00fa c\u1ee7a ng\u01b0\u1eddi d\u1ecbch: B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba. …<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[272],"tags":[],"yoast_head":"\nC\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng<\/title>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\t\n\t\n\t\n","yoast_head_json":{"title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_locale":"vi_VN","og_type":"article","og_title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","og_description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","og_url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_site_name":"Ki\u1ebfn c\u00e0ng","article_author":"https:\/\/www.facebook.com\/anhducnguyen87\/","article_published_time":"2020-03-19T08:39:51+00:00","og_image":[{"url":"https:\/\/kiencang.net\/wp-content\/uploads\/2020\/03\/audits-panel-767x1024.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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","isPartOf":{"@id":"https:\/\/kiencang.net\/#website"},"datePublished":"2020-03-19T08:39:51+00:00","dateModified":"2020-03-19T08:39:51+00:00","author":{"@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16"},"description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","breadcrumb":{"@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kiencang.net\/"},{"@type":"ListItem","position":2,"name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm 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\/16863"}],"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=16863"}],"version-history":[{"count":0,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/16863\/revisions"}],"wp:attachment":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media?parent=16863"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/categories?post=16863"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/tags?post=16863"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
Gi\u1edd b\u1ea1n s\u1ebd th\u1ea5y m\u1ed9t badge b\u00ean c\u1ea1nh t\u1eebng m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba. Click v\u00e0o badge \u0111\u1ec3 hi\u1ec3n th\u1ecb nhi\u1ec1u th\u00f4ng tin h\u01a1n v\u1ec1 \u0111o\u1ea1n m\u00e3 \u0111\u00f3.<\/p>\n\n\n
\u0110\u1ec3 c\u00f3 th\u00eam th\u00f4ng tin v\u1ec1 \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba l\u00ean hi\u1ec7u su\u1ea5t, b\u1ea1n h\u00e3y truy c\u1eadp v\u00e0o trang: https:\/\/www.thirdpartyweb.today\/<\/a>. N\u00f3 s\u1eed d\u1ee5ng d\u1eef li\u1ec7u HTTP Archive<\/a> \u0111\u1ec3 \u0111\u01b0a ra c\u00e1i nh\u00ecn t\u1ed5ng quan v\u1ec1 c\u00e1c nh\u00e0 cung c\u1ea5p c\u1ee7a b\u00ean th\u1ee9 ba v\u00e0 \u1ea3nh h\u01b0\u1edfng c\u1ee7a ch\u00fang l\u00ean web.<\/p>\n\n\n\n\n\n<\/span>Panel hi\u1ec7u su\u1ea5t c\u1ee7a Chrome DevTools<\/span><\/h2>\n\n\nM\u1ed9t khi \u0111\u01b0\u1ee3c b\u1eadt, badge m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba c\u0169ng xu\u1ea5t hi\u1ec7n trong panel Performance<\/strong> DevTools. Panel Performance ghi l\u1ea1i m\u1ed9t b\u1ea3ng waterfall<\/a> \u0111\u1ea1i di\u1ec7n, cho bi\u1ebft trang c\u1ee7a b\u1ea1n \u0111ang ti\u00eau t\u1ed1n th\u1eddi gian \u1edf nh\u1eefng ph\u1ea7n n\u00e0o v\u00e0 c\u00e1ch gi\u00fap b\u1ea1n quan s\u00e1t hi\u1ec7u su\u1ea5t m\u1ed9t c\u00e1ch chi ti\u1ebft.<\/p>\n\n\n\u0110\u1ec3 ghi l\u1ea1i c\u00e1ch trang t\u1ea3i, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Performance<\/strong>.<\/li>Click v\u00e0o n\u00fat Start profiling and reload page<\/strong>.<\/li><\/ol>\n\n\n\u0110\u1ec3 xem c\u00e1c ho\u1ea1t \u0111\u1ed9ng xu\u1ea5t hi\u1ec7n trong lu\u1ed3ng ch\u00ednh c\u1ee7a trang<\/a>, b\u1ea1n h\u00e3y ki\u1ec3m tra khu v\u1ef1c Main<\/strong>. C\u00e1c t\u00e1c v\u1ee5 d\u00e0i (long task)<\/strong> \u0111\u01b0\u1ee3c g\u00e1n nh\u00e3n b\u1eb1ng c\u1ea3nh b\u00e1o c\u1edd m\u00e0u \u0111\u1ecf, \u0111\u1ec3 bi\u1ebft chi ti\u1ebft h\u01a1n v\u1ec1 th\u1eddi gian th\u1ef1c thi, b\u1ea1n h\u00e3y hover qua ch\u00fang.<\/p>\n\n\nThu\u1eadt ng\u1eef quan tr\u1ecdng<\/strong>: M\u1ed9t t\u00e1c v\u1ee5 d\u00e0i<\/a> l\u00e0 m\u1ed9t \u0111o\u1ea1n m\u00e3 JavaScript chi\u1ebfm lu\u1ed3ng ch\u00ednh t\u1eeb 50 ms tr\u1edf l\u00ean, \u0111i\u1ec1u n\u00e0y t\u00e1c \u0111\u1ed9ng l\u00ean nh\u1eadn th\u1ee9c c\u1ee7a ng\u01b0\u1eddi truy c\u1eadp r\u1eb1ng UI (giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng) b\u1ecb \u0111\u01a1 (freeze).<\/p>\n\n\n<\/figure><\/div>\n\n\nB\u1ea1n c\u0169ng c\u00f3 th\u1ec3 s\u1eafp x\u1ebfp c\u00e1c t\u00e1c v\u1ee5 JavaScript theo th\u1eddi gian th\u1ef1c thi \u0111\u1ec3 x\u00e1c \u0111\u1ecbnh t\u00e0i nguy\u00ean b\u00ean th\u1ee9 ba n\u00e0o l\u00e0 ch\u1eadm nh\u1ea5t:<\/p>\n\n\nT\u1ea1i v\u1ecb tr\u00ed cu\u1ed1i c\u00f9ng c\u1ee7a panel Performance<\/strong>, click v\u00e0o tab Bottom-Up<\/strong>.<\/li>Trong danh s\u00e1ch x\u1ed5 xu\u1ed1ng \u0111\u00e3 \u0111\u01b0\u1ee3c nh\u00f3m l\u1ea1i, b\u1ea1n ch\u1ecdn Group by Product<\/strong> (nh\u00f3m theo s\u1ea3n ph\u1ea9m)<\/li><\/ol>\n\n\n<\/figure>\n\n\n\n\n\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 30 ph\u00fat<\/span><\/h2>\n\n\nChrome DevTools v\u1edbi t\u00ednh n\u0103ng ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng (network request blocking) cho ph\u00e9p b\u1ea1n quan s\u00e1t h\u00e0nh vi c\u1ee7a trang khi m\u1ed9t \u0111o\u1ea1n JavaScript, CSS ho\u1eb7c m\u1ed9t ngu\u1ed3n c\u1ee5 th\u1ec3 kh\u00e1c kh\u00f4ng \u0111\u01b0\u1ee3c t\u1ea3i v\u1ec1. Sau khi b\u1ea1n \u0111\u00e3 x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba m\u00e0 b\u1ea1n nghi ng\u1edd \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn hi\u1ec7u su\u1ea5t, b\u1ea1n c\u1ea7n ti\u1ebfn h\u00e0nh ki\u1ec3m tra xem th\u1eddi gian t\u1ea3i s\u1ebd thay \u0111\u1ed5i nh\u01b0 th\u1ebf n\u00e0o b\u1eb1ng c\u00e1ch ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u c\u1ee7a nh\u1eefng \u0111o\u1ea1n JavaScript \u0111\u00f3.<\/p>\n\n\n \u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng ch\u1eb7n y\u00eau c\u1ea7u (request blocking), h\u00e3y l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> ho\u1eb7c (Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Chu\u1ed9t ph\u1ea3i v\u00e0o b\u1ea5t c\u1ee9 y\u00eau c\u1ea7u n\u00e0o trong panel Network<\/strong>.<\/li>Ch\u1ecdn Block request URL<\/strong> (ch\u1eb7n URL y\u00eau c\u1ea7u).<\/li><\/ol>\n\n\n<\/figure><\/div>\n\n\nTab Request blocking<\/strong> s\u1ebd xu\u1ea5t hi\u1ec7n trong DevTools drawer. B\u1ea1n c\u00f3 th\u1ec3 qu\u1ea3n l\u00fd c\u00e1c y\u00eau c\u1ea7u \u0111\u00e3 b\u1ecb ch\u1eb7n \u1edf \u0111\u00f3.<\/p>\n\n\n\u0110\u1ec3 \u0111o \u0111\u1ea1c \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba:<\/p>\n\n\n\u0110o \u0111\u1ea1c l\u01b0\u1ee3ng th\u1eddi gian trang b\u1ea1n c\u1ea7n \u0111\u1ec3 t\u1ea3i v\u1ec1 b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng panel Network. \u0110\u1ec3 gi\u1ea3 l\u1eadp c\u00e1c \u0111i\u1ec1u ki\u1ec7n c\u1ee7a th\u1ebf gi\u1edbi th\u1ef1c, h\u00e3y b\u1eadt network throttling (\u0111i\u1ec1u ch\u1ec9nh m\u1ea1ng) v\u00e0 CPU throttling (\u0111i\u1ec1u ch\u1ec9nh CPU). Tr\u00ean c\u00e1c k\u1ebft n\u1ed1i nhanh v\u00e0 ph\u1ea7n c\u1ee9ng c\u1ee7a m\u00e1y b\u00e0n, \u1ea3nh h\u01b0\u1edfng c\u1ee7a c\u00e1c JavaScript n\u1eb7ng n\u1ec1 c\u00f3 th\u1ec3 ho\u00e0n to\u00e0n kh\u00e1c tr\u00ean thi\u1ebft b\u1ecb di \u0111\u1ed9ng.)<\/li>Ch\u1eb7n c\u00e1c URL ho\u1eb7c t\u00ean mi\u1ec1n \u0111\u1ea1i di\u1ec7n cho JavaScript c\u1ee7a b\u00ean th\u1ee9 b\u1ea1n m\u00e0 b\u1ea1n tin r\u1eb1ng n\u00f3 l\u00e0 v\u1ea5n \u0111\u1ec1.<\/li>T\u1ea3i l\u1ea1i trang v\u00e0 \u0111o \u0111\u1ea1c l\u1ea1i th\u1eddi gian n\u00f3 c\u1ea7n \u0111\u1ec3 t\u1ea3i m\u00e0 kh\u00f4ng c\u1ea7n c\u00e1c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba b\u1ecb ch\u1eb7n.<\/li><\/ol>\n\n\nB\u1ea1n ch\u1eafc h\u1eb3n hy v\u1ecdng th\u1ea5y t\u1ed1c \u0111\u1ed9 \u0111\u01b0\u1ee3c c\u1ea3i thi\u1ec7n, nh\u01b0ng thi tho\u1ea3ng vi\u1ec7c ch\u1eb7n t\u1ec7p l\u1ec7nh c\u1ee7a b\u00ean th\u1ee9 ba c\u00f3 th\u1ec3 kh\u00f4ng c\u00f3 \u0111\u01b0\u1ee3c \u1ea3nh h\u01b0\u1edfng nh\u01b0 b\u1ea1n mong ch\u1edd. N\u1ebfu b\u1ea1n r\u01a1i v\u00e0o tr\u01b0\u1eddng h\u1ee3p \u0111\u00f3, h\u00e3y gi\u1ea3m danh s\u00e1ch c\u00e1c URL b\u1ecb ch\u1eb7n cho \u0111\u1ebfn khi b\u1ea1n c\u00f4 l\u1eadp \u0111\u01b0\u1ee3c m\u1ed9t c\u00e1i l\u00e0 nguy\u00ean nh\u00e2n g\u00e2y ch\u1eadm ch\u1ea1p.<\/p>\n\n\nL\u01b0u \u00fd r\u1eb1ng b\u1ea1n c\u1ea7n th\u1ee9c hi\u1ec7n \u00edt nh\u1ea5t l\u00e0 ba l\u1ea7n ch\u1ea1y \u0111\u1ec3 \u0111o \u0111\u1ea1c v\u00e0 xem x\u00e9t gi\u00e1 tr\u1ecb trung b\u00ecnh, \u0111i\u1ec1u \u0111\u00f3 s\u1ebd cho ra gi\u00e1 tr\u1ecb \u1ed5n \u0111\u1ecbnh h\u01a1n. C\u00e1c n\u1ed9i dung c\u1ee7a b\u00ean th\u1ee9 ba th\u1ec9nh tho\u1ea3ng s\u1ebd k\u00e9o c\u00e1c t\u00e0i nguy\u00ean kh\u00e1c nhau m\u1ed7i khi t\u1ea3i trang, c\u00e1ch ti\u1ebfp c\u1eadn n\u00e0y cho ph\u00e9p b\u1ea1n c\u00f3 \u0111\u01b0\u1ee3c \u01b0\u1edbc t\u00ednh th\u1ef1c t\u1ebf h\u01a1n. DevTools gi\u1edd h\u1ed7 tr\u1ee3 c\u00f9ng l\u00fac nhi\u1ec1u b\u1ea3n ghi trong panel Performance<\/strong>, gi\u00fap b\u1ea1n l\u00e0m \u0111i\u1ec1u n\u00e0y d\u1ec5 d\u00e0ng h\u01a1n m\u1ed9t ch\u00fat.<\/p>\n\n\n(D\u1ecbch t\u1eeb b\u00e0i vi\u1ebft: Identify slow third-party JavaScript, t\u00e1c gi\u1ea3: Milica Mihajlija, trang web[.]dev)<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"Ghi ch\u00fa c\u1ee7a ng\u01b0\u1eddi d\u1ecbch: B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba. …<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[272],"tags":[],"yoast_head":"\nC\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng<\/title>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\t\n\t\n\t\n","yoast_head_json":{"title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_locale":"vi_VN","og_type":"article","og_title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","og_description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","og_url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_site_name":"Ki\u1ebfn c\u00e0ng","article_author":"https:\/\/www.facebook.com\/anhducnguyen87\/","article_published_time":"2020-03-19T08:39:51+00:00","og_image":[{"url":"https:\/\/kiencang.net\/wp-content\/uploads\/2020\/03\/audits-panel-767x1024.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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","isPartOf":{"@id":"https:\/\/kiencang.net\/#website"},"datePublished":"2020-03-19T08:39:51+00:00","dateModified":"2020-03-19T08:39:51+00:00","author":{"@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16"},"description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","breadcrumb":{"@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kiencang.net\/"},{"@type":"ListItem","position":2,"name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm 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\/16863"}],"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=16863"}],"version-history":[{"count":0,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/16863\/revisions"}],"wp:attachment":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media?parent=16863"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/categories?post=16863"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/tags?post=16863"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
M\u1ed9t khi \u0111\u01b0\u1ee3c b\u1eadt, badge m\u00e3 c\u1ee7a b\u00ean th\u1ee9 ba c\u0169ng xu\u1ea5t hi\u1ec7n trong panel Performance<\/strong> DevTools. Panel Performance ghi l\u1ea1i m\u1ed9t b\u1ea3ng waterfall<\/a> \u0111\u1ea1i di\u1ec7n, cho bi\u1ebft trang c\u1ee7a b\u1ea1n \u0111ang ti\u00eau t\u1ed1n th\u1eddi gian \u1edf nh\u1eefng ph\u1ea7n n\u00e0o v\u00e0 c\u00e1ch gi\u00fap b\u1ea1n quan s\u00e1t hi\u1ec7u su\u1ea5t m\u1ed9t c\u00e1ch chi ti\u1ebft.<\/p>\n\n\n\u0110\u1ec3 ghi l\u1ea1i c\u00e1ch trang t\u1ea3i, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> (ho\u1eb7c Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Performance<\/strong>.<\/li>Click v\u00e0o n\u00fat Start profiling and reload page<\/strong>.<\/li><\/ol>\n\n\n\u0110\u1ec3 xem c\u00e1c ho\u1ea1t \u0111\u1ed9ng xu\u1ea5t hi\u1ec7n trong lu\u1ed3ng ch\u00ednh c\u1ee7a trang<\/a>, b\u1ea1n h\u00e3y ki\u1ec3m tra khu v\u1ef1c Main<\/strong>. C\u00e1c t\u00e1c v\u1ee5 d\u00e0i (long task)<\/strong> \u0111\u01b0\u1ee3c g\u00e1n nh\u00e3n b\u1eb1ng c\u1ea3nh b\u00e1o c\u1edd m\u00e0u \u0111\u1ecf, \u0111\u1ec3 bi\u1ebft chi ti\u1ebft h\u01a1n v\u1ec1 th\u1eddi gian th\u1ef1c thi, b\u1ea1n h\u00e3y hover qua ch\u00fang.<\/p>\n\n\nThu\u1eadt ng\u1eef quan tr\u1ecdng<\/strong>: M\u1ed9t t\u00e1c v\u1ee5 d\u00e0i<\/a> l\u00e0 m\u1ed9t \u0111o\u1ea1n m\u00e3 JavaScript chi\u1ebfm lu\u1ed3ng ch\u00ednh t\u1eeb 50 ms tr\u1edf l\u00ean, \u0111i\u1ec1u n\u00e0y t\u00e1c \u0111\u1ed9ng l\u00ean nh\u1eadn th\u1ee9c c\u1ee7a ng\u01b0\u1eddi truy c\u1eadp r\u1eb1ng UI (giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng) b\u1ecb \u0111\u01a1 (freeze).<\/p>\n\n\n<\/figure><\/div>\n\n\nB\u1ea1n c\u0169ng c\u00f3 th\u1ec3 s\u1eafp x\u1ebfp c\u00e1c t\u00e1c v\u1ee5 JavaScript theo th\u1eddi gian th\u1ef1c thi \u0111\u1ec3 x\u00e1c \u0111\u1ecbnh t\u00e0i nguy\u00ean b\u00ean th\u1ee9 ba n\u00e0o l\u00e0 ch\u1eadm nh\u1ea5t:<\/p>\n\n\nT\u1ea1i v\u1ecb tr\u00ed cu\u1ed1i c\u00f9ng c\u1ee7a panel Performance<\/strong>, click v\u00e0o tab Bottom-Up<\/strong>.<\/li>Trong danh s\u00e1ch x\u1ed5 xu\u1ed1ng \u0111\u00e3 \u0111\u01b0\u1ee3c nh\u00f3m l\u1ea1i, b\u1ea1n ch\u1ecdn Group by Product<\/strong> (nh\u00f3m theo s\u1ea3n ph\u1ea9m)<\/li><\/ol>\n\n\n<\/figure>\n\n\n\n\n\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 30 ph\u00fat<\/span><\/h2>\n\n\nChrome DevTools v\u1edbi t\u00ednh n\u0103ng ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng (network request blocking) cho ph\u00e9p b\u1ea1n quan s\u00e1t h\u00e0nh vi c\u1ee7a trang khi m\u1ed9t \u0111o\u1ea1n JavaScript, CSS ho\u1eb7c m\u1ed9t ngu\u1ed3n c\u1ee5 th\u1ec3 kh\u00e1c kh\u00f4ng \u0111\u01b0\u1ee3c t\u1ea3i v\u1ec1. Sau khi b\u1ea1n \u0111\u00e3 x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba m\u00e0 b\u1ea1n nghi ng\u1edd \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn hi\u1ec7u su\u1ea5t, b\u1ea1n c\u1ea7n ti\u1ebfn h\u00e0nh ki\u1ec3m tra xem th\u1eddi gian t\u1ea3i s\u1ebd thay \u0111\u1ed5i nh\u01b0 th\u1ebf n\u00e0o b\u1eb1ng c\u00e1ch ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u c\u1ee7a nh\u1eefng \u0111o\u1ea1n JavaScript \u0111\u00f3.<\/p>\n\n\n \u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng ch\u1eb7n y\u00eau c\u1ea7u (request blocking), h\u00e3y l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> ho\u1eb7c (Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Chu\u1ed9t ph\u1ea3i v\u00e0o b\u1ea5t c\u1ee9 y\u00eau c\u1ea7u n\u00e0o trong panel Network<\/strong>.<\/li>Ch\u1ecdn Block request URL<\/strong> (ch\u1eb7n URL y\u00eau c\u1ea7u).<\/li><\/ol>\n\n\n<\/figure><\/div>\n\n\nTab Request blocking<\/strong> s\u1ebd xu\u1ea5t hi\u1ec7n trong DevTools drawer. B\u1ea1n c\u00f3 th\u1ec3 qu\u1ea3n l\u00fd c\u00e1c y\u00eau c\u1ea7u \u0111\u00e3 b\u1ecb ch\u1eb7n \u1edf \u0111\u00f3.<\/p>\n\n\n\u0110\u1ec3 \u0111o \u0111\u1ea1c \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba:<\/p>\n\n\n\u0110o \u0111\u1ea1c l\u01b0\u1ee3ng th\u1eddi gian trang b\u1ea1n c\u1ea7n \u0111\u1ec3 t\u1ea3i v\u1ec1 b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng panel Network. \u0110\u1ec3 gi\u1ea3 l\u1eadp c\u00e1c \u0111i\u1ec1u ki\u1ec7n c\u1ee7a th\u1ebf gi\u1edbi th\u1ef1c, h\u00e3y b\u1eadt network throttling (\u0111i\u1ec1u ch\u1ec9nh m\u1ea1ng) v\u00e0 CPU throttling (\u0111i\u1ec1u ch\u1ec9nh CPU). Tr\u00ean c\u00e1c k\u1ebft n\u1ed1i nhanh v\u00e0 ph\u1ea7n c\u1ee9ng c\u1ee7a m\u00e1y b\u00e0n, \u1ea3nh h\u01b0\u1edfng c\u1ee7a c\u00e1c JavaScript n\u1eb7ng n\u1ec1 c\u00f3 th\u1ec3 ho\u00e0n to\u00e0n kh\u00e1c tr\u00ean thi\u1ebft b\u1ecb di \u0111\u1ed9ng.)<\/li>Ch\u1eb7n c\u00e1c URL ho\u1eb7c t\u00ean mi\u1ec1n \u0111\u1ea1i di\u1ec7n cho JavaScript c\u1ee7a b\u00ean th\u1ee9 b\u1ea1n m\u00e0 b\u1ea1n tin r\u1eb1ng n\u00f3 l\u00e0 v\u1ea5n \u0111\u1ec1.<\/li>T\u1ea3i l\u1ea1i trang v\u00e0 \u0111o \u0111\u1ea1c l\u1ea1i th\u1eddi gian n\u00f3 c\u1ea7n \u0111\u1ec3 t\u1ea3i m\u00e0 kh\u00f4ng c\u1ea7n c\u00e1c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba b\u1ecb ch\u1eb7n.<\/li><\/ol>\n\n\nB\u1ea1n ch\u1eafc h\u1eb3n hy v\u1ecdng th\u1ea5y t\u1ed1c \u0111\u1ed9 \u0111\u01b0\u1ee3c c\u1ea3i thi\u1ec7n, nh\u01b0ng thi tho\u1ea3ng vi\u1ec7c ch\u1eb7n t\u1ec7p l\u1ec7nh c\u1ee7a b\u00ean th\u1ee9 ba c\u00f3 th\u1ec3 kh\u00f4ng c\u00f3 \u0111\u01b0\u1ee3c \u1ea3nh h\u01b0\u1edfng nh\u01b0 b\u1ea1n mong ch\u1edd. N\u1ebfu b\u1ea1n r\u01a1i v\u00e0o tr\u01b0\u1eddng h\u1ee3p \u0111\u00f3, h\u00e3y gi\u1ea3m danh s\u00e1ch c\u00e1c URL b\u1ecb ch\u1eb7n cho \u0111\u1ebfn khi b\u1ea1n c\u00f4 l\u1eadp \u0111\u01b0\u1ee3c m\u1ed9t c\u00e1i l\u00e0 nguy\u00ean nh\u00e2n g\u00e2y ch\u1eadm ch\u1ea1p.<\/p>\n\n\nL\u01b0u \u00fd r\u1eb1ng b\u1ea1n c\u1ea7n th\u1ee9c hi\u1ec7n \u00edt nh\u1ea5t l\u00e0 ba l\u1ea7n ch\u1ea1y \u0111\u1ec3 \u0111o \u0111\u1ea1c v\u00e0 xem x\u00e9t gi\u00e1 tr\u1ecb trung b\u00ecnh, \u0111i\u1ec1u \u0111\u00f3 s\u1ebd cho ra gi\u00e1 tr\u1ecb \u1ed5n \u0111\u1ecbnh h\u01a1n. C\u00e1c n\u1ed9i dung c\u1ee7a b\u00ean th\u1ee9 ba th\u1ec9nh tho\u1ea3ng s\u1ebd k\u00e9o c\u00e1c t\u00e0i nguy\u00ean kh\u00e1c nhau m\u1ed7i khi t\u1ea3i trang, c\u00e1ch ti\u1ebfp c\u1eadn n\u00e0y cho ph\u00e9p b\u1ea1n c\u00f3 \u0111\u01b0\u1ee3c \u01b0\u1edbc t\u00ednh th\u1ef1c t\u1ebf h\u01a1n. DevTools gi\u1edd h\u1ed7 tr\u1ee3 c\u00f9ng l\u00fac nhi\u1ec1u b\u1ea3n ghi trong panel Performance<\/strong>, gi\u00fap b\u1ea1n l\u00e0m \u0111i\u1ec1u n\u00e0y d\u1ec5 d\u00e0ng h\u01a1n m\u1ed9t ch\u00fat.<\/p>\n\n\n(D\u1ecbch t\u1eeb b\u00e0i vi\u1ebft: Identify slow third-party JavaScript, t\u00e1c gi\u1ea3: Milica Mihajlija, trang web[.]dev)<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"Ghi ch\u00fa c\u1ee7a ng\u01b0\u1eddi d\u1ecbch: B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba. …<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[272],"tags":[],"yoast_head":"\nC\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng<\/title>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\t\n\t\n\t\n","yoast_head_json":{"title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_locale":"vi_VN","og_type":"article","og_title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","og_description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","og_url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_site_name":"Ki\u1ebfn c\u00e0ng","article_author":"https:\/\/www.facebook.com\/anhducnguyen87\/","article_published_time":"2020-03-19T08:39:51+00:00","og_image":[{"url":"https:\/\/kiencang.net\/wp-content\/uploads\/2020\/03\/audits-panel-767x1024.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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","isPartOf":{"@id":"https:\/\/kiencang.net\/#website"},"datePublished":"2020-03-19T08:39:51+00:00","dateModified":"2020-03-19T08:39:51+00:00","author":{"@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16"},"description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","breadcrumb":{"@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kiencang.net\/"},{"@type":"ListItem","position":2,"name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm 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\/16863"}],"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=16863"}],"version-history":[{"count":0,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/16863\/revisions"}],"wp:attachment":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media?parent=16863"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/categories?post=16863"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/tags?post=16863"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
\u0110\u1ec3 ghi l\u1ea1i c\u00e1ch trang t\u1ea3i, b\u1ea1n l\u00e0m nh\u01b0 sau:<\/p>\n\n\n
\u0110\u1ec3 xem c\u00e1c ho\u1ea1t \u0111\u1ed9ng xu\u1ea5t hi\u1ec7n trong lu\u1ed3ng ch\u00ednh c\u1ee7a trang<\/a>, b\u1ea1n h\u00e3y ki\u1ec3m tra khu v\u1ef1c Main<\/strong>. C\u00e1c t\u00e1c v\u1ee5 d\u00e0i (long task)<\/strong> \u0111\u01b0\u1ee3c g\u00e1n nh\u00e3n b\u1eb1ng c\u1ea3nh b\u00e1o c\u1edd m\u00e0u \u0111\u1ecf, \u0111\u1ec3 bi\u1ebft chi ti\u1ebft h\u01a1n v\u1ec1 th\u1eddi gian th\u1ef1c thi, b\u1ea1n h\u00e3y hover qua ch\u00fang.<\/p>\n\n\nThu\u1eadt ng\u1eef quan tr\u1ecdng<\/strong>: M\u1ed9t t\u00e1c v\u1ee5 d\u00e0i<\/a> l\u00e0 m\u1ed9t \u0111o\u1ea1n m\u00e3 JavaScript chi\u1ebfm lu\u1ed3ng ch\u00ednh t\u1eeb 50 ms tr\u1edf l\u00ean, \u0111i\u1ec1u n\u00e0y t\u00e1c \u0111\u1ed9ng l\u00ean nh\u1eadn th\u1ee9c c\u1ee7a ng\u01b0\u1eddi truy c\u1eadp r\u1eb1ng UI (giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng) b\u1ecb \u0111\u01a1 (freeze).<\/p>\n\n\n<\/figure><\/div>\n\n\nB\u1ea1n c\u0169ng c\u00f3 th\u1ec3 s\u1eafp x\u1ebfp c\u00e1c t\u00e1c v\u1ee5 JavaScript theo th\u1eddi gian th\u1ef1c thi \u0111\u1ec3 x\u00e1c \u0111\u1ecbnh t\u00e0i nguy\u00ean b\u00ean th\u1ee9 ba n\u00e0o l\u00e0 ch\u1eadm nh\u1ea5t:<\/p>\n\n\nT\u1ea1i v\u1ecb tr\u00ed cu\u1ed1i c\u00f9ng c\u1ee7a panel Performance<\/strong>, click v\u00e0o tab Bottom-Up<\/strong>.<\/li>Trong danh s\u00e1ch x\u1ed5 xu\u1ed1ng \u0111\u00e3 \u0111\u01b0\u1ee3c nh\u00f3m l\u1ea1i, b\u1ea1n ch\u1ecdn Group by Product<\/strong> (nh\u00f3m theo s\u1ea3n ph\u1ea9m)<\/li><\/ol>\n\n\n<\/figure>\n\n\n\n\n\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 30 ph\u00fat<\/span><\/h2>\n\n\nChrome DevTools v\u1edbi t\u00ednh n\u0103ng ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng (network request blocking) cho ph\u00e9p b\u1ea1n quan s\u00e1t h\u00e0nh vi c\u1ee7a trang khi m\u1ed9t \u0111o\u1ea1n JavaScript, CSS ho\u1eb7c m\u1ed9t ngu\u1ed3n c\u1ee5 th\u1ec3 kh\u00e1c kh\u00f4ng \u0111\u01b0\u1ee3c t\u1ea3i v\u1ec1. Sau khi b\u1ea1n \u0111\u00e3 x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba m\u00e0 b\u1ea1n nghi ng\u1edd \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn hi\u1ec7u su\u1ea5t, b\u1ea1n c\u1ea7n ti\u1ebfn h\u00e0nh ki\u1ec3m tra xem th\u1eddi gian t\u1ea3i s\u1ebd thay \u0111\u1ed5i nh\u01b0 th\u1ebf n\u00e0o b\u1eb1ng c\u00e1ch ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u c\u1ee7a nh\u1eefng \u0111o\u1ea1n JavaScript \u0111\u00f3.<\/p>\n\n\n \u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng ch\u1eb7n y\u00eau c\u1ea7u (request blocking), h\u00e3y l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> ho\u1eb7c (Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Chu\u1ed9t ph\u1ea3i v\u00e0o b\u1ea5t c\u1ee9 y\u00eau c\u1ea7u n\u00e0o trong panel Network<\/strong>.<\/li>Ch\u1ecdn Block request URL<\/strong> (ch\u1eb7n URL y\u00eau c\u1ea7u).<\/li><\/ol>\n\n\n<\/figure><\/div>\n\n\nTab Request blocking<\/strong> s\u1ebd xu\u1ea5t hi\u1ec7n trong DevTools drawer. B\u1ea1n c\u00f3 th\u1ec3 qu\u1ea3n l\u00fd c\u00e1c y\u00eau c\u1ea7u \u0111\u00e3 b\u1ecb ch\u1eb7n \u1edf \u0111\u00f3.<\/p>\n\n\n\u0110\u1ec3 \u0111o \u0111\u1ea1c \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba:<\/p>\n\n\n\u0110o \u0111\u1ea1c l\u01b0\u1ee3ng th\u1eddi gian trang b\u1ea1n c\u1ea7n \u0111\u1ec3 t\u1ea3i v\u1ec1 b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng panel Network. \u0110\u1ec3 gi\u1ea3 l\u1eadp c\u00e1c \u0111i\u1ec1u ki\u1ec7n c\u1ee7a th\u1ebf gi\u1edbi th\u1ef1c, h\u00e3y b\u1eadt network throttling (\u0111i\u1ec1u ch\u1ec9nh m\u1ea1ng) v\u00e0 CPU throttling (\u0111i\u1ec1u ch\u1ec9nh CPU). Tr\u00ean c\u00e1c k\u1ebft n\u1ed1i nhanh v\u00e0 ph\u1ea7n c\u1ee9ng c\u1ee7a m\u00e1y b\u00e0n, \u1ea3nh h\u01b0\u1edfng c\u1ee7a c\u00e1c JavaScript n\u1eb7ng n\u1ec1 c\u00f3 th\u1ec3 ho\u00e0n to\u00e0n kh\u00e1c tr\u00ean thi\u1ebft b\u1ecb di \u0111\u1ed9ng.)<\/li>Ch\u1eb7n c\u00e1c URL ho\u1eb7c t\u00ean mi\u1ec1n \u0111\u1ea1i di\u1ec7n cho JavaScript c\u1ee7a b\u00ean th\u1ee9 b\u1ea1n m\u00e0 b\u1ea1n tin r\u1eb1ng n\u00f3 l\u00e0 v\u1ea5n \u0111\u1ec1.<\/li>T\u1ea3i l\u1ea1i trang v\u00e0 \u0111o \u0111\u1ea1c l\u1ea1i th\u1eddi gian n\u00f3 c\u1ea7n \u0111\u1ec3 t\u1ea3i m\u00e0 kh\u00f4ng c\u1ea7n c\u00e1c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba b\u1ecb ch\u1eb7n.<\/li><\/ol>\n\n\nB\u1ea1n ch\u1eafc h\u1eb3n hy v\u1ecdng th\u1ea5y t\u1ed1c \u0111\u1ed9 \u0111\u01b0\u1ee3c c\u1ea3i thi\u1ec7n, nh\u01b0ng thi tho\u1ea3ng vi\u1ec7c ch\u1eb7n t\u1ec7p l\u1ec7nh c\u1ee7a b\u00ean th\u1ee9 ba c\u00f3 th\u1ec3 kh\u00f4ng c\u00f3 \u0111\u01b0\u1ee3c \u1ea3nh h\u01b0\u1edfng nh\u01b0 b\u1ea1n mong ch\u1edd. N\u1ebfu b\u1ea1n r\u01a1i v\u00e0o tr\u01b0\u1eddng h\u1ee3p \u0111\u00f3, h\u00e3y gi\u1ea3m danh s\u00e1ch c\u00e1c URL b\u1ecb ch\u1eb7n cho \u0111\u1ebfn khi b\u1ea1n c\u00f4 l\u1eadp \u0111\u01b0\u1ee3c m\u1ed9t c\u00e1i l\u00e0 nguy\u00ean nh\u00e2n g\u00e2y ch\u1eadm ch\u1ea1p.<\/p>\n\n\nL\u01b0u \u00fd r\u1eb1ng b\u1ea1n c\u1ea7n th\u1ee9c hi\u1ec7n \u00edt nh\u1ea5t l\u00e0 ba l\u1ea7n ch\u1ea1y \u0111\u1ec3 \u0111o \u0111\u1ea1c v\u00e0 xem x\u00e9t gi\u00e1 tr\u1ecb trung b\u00ecnh, \u0111i\u1ec1u \u0111\u00f3 s\u1ebd cho ra gi\u00e1 tr\u1ecb \u1ed5n \u0111\u1ecbnh h\u01a1n. C\u00e1c n\u1ed9i dung c\u1ee7a b\u00ean th\u1ee9 ba th\u1ec9nh tho\u1ea3ng s\u1ebd k\u00e9o c\u00e1c t\u00e0i nguy\u00ean kh\u00e1c nhau m\u1ed7i khi t\u1ea3i trang, c\u00e1ch ti\u1ebfp c\u1eadn n\u00e0y cho ph\u00e9p b\u1ea1n c\u00f3 \u0111\u01b0\u1ee3c \u01b0\u1edbc t\u00ednh th\u1ef1c t\u1ebf h\u01a1n. DevTools gi\u1edd h\u1ed7 tr\u1ee3 c\u00f9ng l\u00fac nhi\u1ec1u b\u1ea3n ghi trong panel Performance<\/strong>, gi\u00fap b\u1ea1n l\u00e0m \u0111i\u1ec1u n\u00e0y d\u1ec5 d\u00e0ng h\u01a1n m\u1ed9t ch\u00fat.<\/p>\n\n\n(D\u1ecbch t\u1eeb b\u00e0i vi\u1ebft: Identify slow third-party JavaScript, t\u00e1c gi\u1ea3: Milica Mihajlija, trang web[.]dev)<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"Ghi ch\u00fa c\u1ee7a ng\u01b0\u1eddi d\u1ecbch: B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba. …<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[272],"tags":[],"yoast_head":"\nC\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng<\/title>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\t\n\t\n\t\n","yoast_head_json":{"title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_locale":"vi_VN","og_type":"article","og_title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","og_description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","og_url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_site_name":"Ki\u1ebfn c\u00e0ng","article_author":"https:\/\/www.facebook.com\/anhducnguyen87\/","article_published_time":"2020-03-19T08:39:51+00:00","og_image":[{"url":"https:\/\/kiencang.net\/wp-content\/uploads\/2020\/03\/audits-panel-767x1024.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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","isPartOf":{"@id":"https:\/\/kiencang.net\/#website"},"datePublished":"2020-03-19T08:39:51+00:00","dateModified":"2020-03-19T08:39:51+00:00","author":{"@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16"},"description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","breadcrumb":{"@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kiencang.net\/"},{"@type":"ListItem","position":2,"name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm 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\/16863"}],"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=16863"}],"version-history":[{"count":0,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/16863\/revisions"}],"wp:attachment":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media?parent=16863"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/categories?post=16863"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/tags?post=16863"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
Thu\u1eadt ng\u1eef quan tr\u1ecdng<\/strong>: M\u1ed9t t\u00e1c v\u1ee5 d\u00e0i<\/a> l\u00e0 m\u1ed9t \u0111o\u1ea1n m\u00e3 JavaScript chi\u1ebfm lu\u1ed3ng ch\u00ednh t\u1eeb 50 ms tr\u1edf l\u00ean, \u0111i\u1ec1u n\u00e0y t\u00e1c \u0111\u1ed9ng l\u00ean nh\u1eadn th\u1ee9c c\u1ee7a ng\u01b0\u1eddi truy c\u1eadp r\u1eb1ng UI (giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng) b\u1ecb \u0111\u01a1 (freeze).<\/p>\n\n\n<\/figure><\/div>\n\n\nB\u1ea1n c\u0169ng c\u00f3 th\u1ec3 s\u1eafp x\u1ebfp c\u00e1c t\u00e1c v\u1ee5 JavaScript theo th\u1eddi gian th\u1ef1c thi \u0111\u1ec3 x\u00e1c \u0111\u1ecbnh t\u00e0i nguy\u00ean b\u00ean th\u1ee9 ba n\u00e0o l\u00e0 ch\u1eadm nh\u1ea5t:<\/p>\n\n\nT\u1ea1i v\u1ecb tr\u00ed cu\u1ed1i c\u00f9ng c\u1ee7a panel Performance<\/strong>, click v\u00e0o tab Bottom-Up<\/strong>.<\/li>Trong danh s\u00e1ch x\u1ed5 xu\u1ed1ng \u0111\u00e3 \u0111\u01b0\u1ee3c nh\u00f3m l\u1ea1i, b\u1ea1n ch\u1ecdn Group by Product<\/strong> (nh\u00f3m theo s\u1ea3n ph\u1ea9m)<\/li><\/ol>\n\n\n<\/figure>\n\n\n\n\n\n<\/span>N\u1ebfu b\u1ea1n ch\u1ec9 c\u00f3 30 ph\u00fat<\/span><\/h2>\n\n\nChrome DevTools v\u1edbi t\u00ednh n\u0103ng ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng (network request blocking) cho ph\u00e9p b\u1ea1n quan s\u00e1t h\u00e0nh vi c\u1ee7a trang khi m\u1ed9t \u0111o\u1ea1n JavaScript, CSS ho\u1eb7c m\u1ed9t ngu\u1ed3n c\u1ee5 th\u1ec3 kh\u00e1c kh\u00f4ng \u0111\u01b0\u1ee3c t\u1ea3i v\u1ec1. Sau khi b\u1ea1n \u0111\u00e3 x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba m\u00e0 b\u1ea1n nghi ng\u1edd \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn hi\u1ec7u su\u1ea5t, b\u1ea1n c\u1ea7n ti\u1ebfn h\u00e0nh ki\u1ec3m tra xem th\u1eddi gian t\u1ea3i s\u1ebd thay \u0111\u1ed5i nh\u01b0 th\u1ebf n\u00e0o b\u1eb1ng c\u00e1ch ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u c\u1ee7a nh\u1eefng \u0111o\u1ea1n JavaScript \u0111\u00f3.<\/p>\n\n\n \u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng ch\u1eb7n y\u00eau c\u1ea7u (request blocking), h\u00e3y l\u00e0m nh\u01b0 sau:<\/p>\n\n\nNh\u1ea5n Control+Shift+J<\/em> ho\u1eb7c (Command+Option+J<\/em> tr\u00ean m\u00e1y Mac) \u0111\u1ec3 m\u1edf DevTools.<\/li>Click v\u00e0o tab Network<\/strong>.<\/li>Chu\u1ed9t ph\u1ea3i v\u00e0o b\u1ea5t c\u1ee9 y\u00eau c\u1ea7u n\u00e0o trong panel Network<\/strong>.<\/li>Ch\u1ecdn Block request URL<\/strong> (ch\u1eb7n URL y\u00eau c\u1ea7u).<\/li><\/ol>\n\n\n<\/figure><\/div>\n\n\nTab Request blocking<\/strong> s\u1ebd xu\u1ea5t hi\u1ec7n trong DevTools drawer. B\u1ea1n c\u00f3 th\u1ec3 qu\u1ea3n l\u00fd c\u00e1c y\u00eau c\u1ea7u \u0111\u00e3 b\u1ecb ch\u1eb7n \u1edf \u0111\u00f3.<\/p>\n\n\n\u0110\u1ec3 \u0111o \u0111\u1ea1c \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba:<\/p>\n\n\n\u0110o \u0111\u1ea1c l\u01b0\u1ee3ng th\u1eddi gian trang b\u1ea1n c\u1ea7n \u0111\u1ec3 t\u1ea3i v\u1ec1 b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng panel Network. \u0110\u1ec3 gi\u1ea3 l\u1eadp c\u00e1c \u0111i\u1ec1u ki\u1ec7n c\u1ee7a th\u1ebf gi\u1edbi th\u1ef1c, h\u00e3y b\u1eadt network throttling (\u0111i\u1ec1u ch\u1ec9nh m\u1ea1ng) v\u00e0 CPU throttling (\u0111i\u1ec1u ch\u1ec9nh CPU). Tr\u00ean c\u00e1c k\u1ebft n\u1ed1i nhanh v\u00e0 ph\u1ea7n c\u1ee9ng c\u1ee7a m\u00e1y b\u00e0n, \u1ea3nh h\u01b0\u1edfng c\u1ee7a c\u00e1c JavaScript n\u1eb7ng n\u1ec1 c\u00f3 th\u1ec3 ho\u00e0n to\u00e0n kh\u00e1c tr\u00ean thi\u1ebft b\u1ecb di \u0111\u1ed9ng.)<\/li>Ch\u1eb7n c\u00e1c URL ho\u1eb7c t\u00ean mi\u1ec1n \u0111\u1ea1i di\u1ec7n cho JavaScript c\u1ee7a b\u00ean th\u1ee9 b\u1ea1n m\u00e0 b\u1ea1n tin r\u1eb1ng n\u00f3 l\u00e0 v\u1ea5n \u0111\u1ec1.<\/li>T\u1ea3i l\u1ea1i trang v\u00e0 \u0111o \u0111\u1ea1c l\u1ea1i th\u1eddi gian n\u00f3 c\u1ea7n \u0111\u1ec3 t\u1ea3i m\u00e0 kh\u00f4ng c\u1ea7n c\u00e1c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba b\u1ecb ch\u1eb7n.<\/li><\/ol>\n\n\nB\u1ea1n ch\u1eafc h\u1eb3n hy v\u1ecdng th\u1ea5y t\u1ed1c \u0111\u1ed9 \u0111\u01b0\u1ee3c c\u1ea3i thi\u1ec7n, nh\u01b0ng thi tho\u1ea3ng vi\u1ec7c ch\u1eb7n t\u1ec7p l\u1ec7nh c\u1ee7a b\u00ean th\u1ee9 ba c\u00f3 th\u1ec3 kh\u00f4ng c\u00f3 \u0111\u01b0\u1ee3c \u1ea3nh h\u01b0\u1edfng nh\u01b0 b\u1ea1n mong ch\u1edd. N\u1ebfu b\u1ea1n r\u01a1i v\u00e0o tr\u01b0\u1eddng h\u1ee3p \u0111\u00f3, h\u00e3y gi\u1ea3m danh s\u00e1ch c\u00e1c URL b\u1ecb ch\u1eb7n cho \u0111\u1ebfn khi b\u1ea1n c\u00f4 l\u1eadp \u0111\u01b0\u1ee3c m\u1ed9t c\u00e1i l\u00e0 nguy\u00ean nh\u00e2n g\u00e2y ch\u1eadm ch\u1ea1p.<\/p>\n\n\nL\u01b0u \u00fd r\u1eb1ng b\u1ea1n c\u1ea7n th\u1ee9c hi\u1ec7n \u00edt nh\u1ea5t l\u00e0 ba l\u1ea7n ch\u1ea1y \u0111\u1ec3 \u0111o \u0111\u1ea1c v\u00e0 xem x\u00e9t gi\u00e1 tr\u1ecb trung b\u00ecnh, \u0111i\u1ec1u \u0111\u00f3 s\u1ebd cho ra gi\u00e1 tr\u1ecb \u1ed5n \u0111\u1ecbnh h\u01a1n. C\u00e1c n\u1ed9i dung c\u1ee7a b\u00ean th\u1ee9 ba th\u1ec9nh tho\u1ea3ng s\u1ebd k\u00e9o c\u00e1c t\u00e0i nguy\u00ean kh\u00e1c nhau m\u1ed7i khi t\u1ea3i trang, c\u00e1ch ti\u1ebfp c\u1eadn n\u00e0y cho ph\u00e9p b\u1ea1n c\u00f3 \u0111\u01b0\u1ee3c \u01b0\u1edbc t\u00ednh th\u1ef1c t\u1ebf h\u01a1n. DevTools gi\u1edd h\u1ed7 tr\u1ee3 c\u00f9ng l\u00fac nhi\u1ec1u b\u1ea3n ghi trong panel Performance<\/strong>, gi\u00fap b\u1ea1n l\u00e0m \u0111i\u1ec1u n\u00e0y d\u1ec5 d\u00e0ng h\u01a1n m\u1ed9t ch\u00fat.<\/p>\n\n\n(D\u1ecbch t\u1eeb b\u00e0i vi\u1ebft: Identify slow third-party JavaScript, t\u00e1c gi\u1ea3: Milica Mihajlija, trang web[.]dev)<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"Ghi ch\u00fa c\u1ee7a ng\u01b0\u1eddi d\u1ecbch: B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba. …<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[272],"tags":[],"yoast_head":"\nC\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng<\/title>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\t\n\t\n\t\n","yoast_head_json":{"title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_locale":"vi_VN","og_type":"article","og_title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","og_description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","og_url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_site_name":"Ki\u1ebfn c\u00e0ng","article_author":"https:\/\/www.facebook.com\/anhducnguyen87\/","article_published_time":"2020-03-19T08:39:51+00:00","og_image":[{"url":"https:\/\/kiencang.net\/wp-content\/uploads\/2020\/03\/audits-panel-767x1024.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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","isPartOf":{"@id":"https:\/\/kiencang.net\/#website"},"datePublished":"2020-03-19T08:39:51+00:00","dateModified":"2020-03-19T08:39:51+00:00","author":{"@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16"},"description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","breadcrumb":{"@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kiencang.net\/"},{"@type":"ListItem","position":2,"name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm 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\/16863"}],"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=16863"}],"version-history":[{"count":0,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/16863\/revisions"}],"wp:attachment":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media?parent=16863"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/categories?post=16863"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/tags?post=16863"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
B\u1ea1n c\u0169ng c\u00f3 th\u1ec3 s\u1eafp x\u1ebfp c\u00e1c t\u00e1c v\u1ee5 JavaScript theo th\u1eddi gian th\u1ef1c thi \u0111\u1ec3 x\u00e1c \u0111\u1ecbnh t\u00e0i nguy\u00ean b\u00ean th\u1ee9 ba n\u00e0o l\u00e0 ch\u1eadm nh\u1ea5t:<\/p>\n\n\n
Chrome DevTools v\u1edbi t\u00ednh n\u0103ng ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u m\u1ea1ng (network request blocking) cho ph\u00e9p b\u1ea1n quan s\u00e1t h\u00e0nh vi c\u1ee7a trang khi m\u1ed9t \u0111o\u1ea1n JavaScript, CSS ho\u1eb7c m\u1ed9t ngu\u1ed3n c\u1ee5 th\u1ec3 kh\u00e1c kh\u00f4ng \u0111\u01b0\u1ee3c t\u1ea3i v\u1ec1. Sau khi b\u1ea1n \u0111\u00e3 x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba m\u00e0 b\u1ea1n nghi ng\u1edd \u1ea3nh h\u01b0\u1edfng \u0111\u1ebfn hi\u1ec7u su\u1ea5t, b\u1ea1n c\u1ea7n ti\u1ebfn h\u00e0nh ki\u1ec3m tra xem th\u1eddi gian t\u1ea3i s\u1ebd thay \u0111\u1ed5i nh\u01b0 th\u1ebf n\u00e0o b\u1eb1ng c\u00e1ch ch\u1eb7n c\u00e1c y\u00eau c\u1ea7u c\u1ee7a nh\u1eefng \u0111o\u1ea1n JavaScript \u0111\u00f3.<\/p>\n\n\n
\u0110\u1ec3 b\u1eadt t\u00ednh n\u0103ng ch\u1eb7n y\u00eau c\u1ea7u (request blocking), h\u00e3y l\u00e0m nh\u01b0 sau:<\/p>\n\n\n
Tab Request blocking<\/strong> s\u1ebd xu\u1ea5t hi\u1ec7n trong DevTools drawer. B\u1ea1n c\u00f3 th\u1ec3 qu\u1ea3n l\u00fd c\u00e1c y\u00eau c\u1ea7u \u0111\u00e3 b\u1ecb ch\u1eb7n \u1edf \u0111\u00f3.<\/p>\n\n\n\u0110\u1ec3 \u0111o \u0111\u1ea1c \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba:<\/p>\n\n\n\u0110o \u0111\u1ea1c l\u01b0\u1ee3ng th\u1eddi gian trang b\u1ea1n c\u1ea7n \u0111\u1ec3 t\u1ea3i v\u1ec1 b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng panel Network. \u0110\u1ec3 gi\u1ea3 l\u1eadp c\u00e1c \u0111i\u1ec1u ki\u1ec7n c\u1ee7a th\u1ebf gi\u1edbi th\u1ef1c, h\u00e3y b\u1eadt network throttling (\u0111i\u1ec1u ch\u1ec9nh m\u1ea1ng) v\u00e0 CPU throttling (\u0111i\u1ec1u ch\u1ec9nh CPU). Tr\u00ean c\u00e1c k\u1ebft n\u1ed1i nhanh v\u00e0 ph\u1ea7n c\u1ee9ng c\u1ee7a m\u00e1y b\u00e0n, \u1ea3nh h\u01b0\u1edfng c\u1ee7a c\u00e1c JavaScript n\u1eb7ng n\u1ec1 c\u00f3 th\u1ec3 ho\u00e0n to\u00e0n kh\u00e1c tr\u00ean thi\u1ebft b\u1ecb di \u0111\u1ed9ng.)<\/li>Ch\u1eb7n c\u00e1c URL ho\u1eb7c t\u00ean mi\u1ec1n \u0111\u1ea1i di\u1ec7n cho JavaScript c\u1ee7a b\u00ean th\u1ee9 b\u1ea1n m\u00e0 b\u1ea1n tin r\u1eb1ng n\u00f3 l\u00e0 v\u1ea5n \u0111\u1ec1.<\/li>T\u1ea3i l\u1ea1i trang v\u00e0 \u0111o \u0111\u1ea1c l\u1ea1i th\u1eddi gian n\u00f3 c\u1ea7n \u0111\u1ec3 t\u1ea3i m\u00e0 kh\u00f4ng c\u1ea7n c\u00e1c JavaScript c\u1ee7a b\u00ean th\u1ee9 ba b\u1ecb ch\u1eb7n.<\/li><\/ol>\n\n\nB\u1ea1n ch\u1eafc h\u1eb3n hy v\u1ecdng th\u1ea5y t\u1ed1c \u0111\u1ed9 \u0111\u01b0\u1ee3c c\u1ea3i thi\u1ec7n, nh\u01b0ng thi tho\u1ea3ng vi\u1ec7c ch\u1eb7n t\u1ec7p l\u1ec7nh c\u1ee7a b\u00ean th\u1ee9 ba c\u00f3 th\u1ec3 kh\u00f4ng c\u00f3 \u0111\u01b0\u1ee3c \u1ea3nh h\u01b0\u1edfng nh\u01b0 b\u1ea1n mong ch\u1edd. N\u1ebfu b\u1ea1n r\u01a1i v\u00e0o tr\u01b0\u1eddng h\u1ee3p \u0111\u00f3, h\u00e3y gi\u1ea3m danh s\u00e1ch c\u00e1c URL b\u1ecb ch\u1eb7n cho \u0111\u1ebfn khi b\u1ea1n c\u00f4 l\u1eadp \u0111\u01b0\u1ee3c m\u1ed9t c\u00e1i l\u00e0 nguy\u00ean nh\u00e2n g\u00e2y ch\u1eadm ch\u1ea1p.<\/p>\n\n\nL\u01b0u \u00fd r\u1eb1ng b\u1ea1n c\u1ea7n th\u1ee9c hi\u1ec7n \u00edt nh\u1ea5t l\u00e0 ba l\u1ea7n ch\u1ea1y \u0111\u1ec3 \u0111o \u0111\u1ea1c v\u00e0 xem x\u00e9t gi\u00e1 tr\u1ecb trung b\u00ecnh, \u0111i\u1ec1u \u0111\u00f3 s\u1ebd cho ra gi\u00e1 tr\u1ecb \u1ed5n \u0111\u1ecbnh h\u01a1n. C\u00e1c n\u1ed9i dung c\u1ee7a b\u00ean th\u1ee9 ba th\u1ec9nh tho\u1ea3ng s\u1ebd k\u00e9o c\u00e1c t\u00e0i nguy\u00ean kh\u00e1c nhau m\u1ed7i khi t\u1ea3i trang, c\u00e1ch ti\u1ebfp c\u1eadn n\u00e0y cho ph\u00e9p b\u1ea1n c\u00f3 \u0111\u01b0\u1ee3c \u01b0\u1edbc t\u00ednh th\u1ef1c t\u1ebf h\u01a1n. DevTools gi\u1edd h\u1ed7 tr\u1ee3 c\u00f9ng l\u00fac nhi\u1ec1u b\u1ea3n ghi trong panel Performance<\/strong>, gi\u00fap b\u1ea1n l\u00e0m \u0111i\u1ec1u n\u00e0y d\u1ec5 d\u00e0ng h\u01a1n m\u1ed9t ch\u00fat.<\/p>\n\n\n(D\u1ecbch t\u1eeb b\u00e0i vi\u1ebft: Identify slow third-party JavaScript, t\u00e1c gi\u1ea3: Milica Mihajlija, trang web[.]dev)<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"Ghi ch\u00fa c\u1ee7a ng\u01b0\u1eddi d\u1ecbch: B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba. …<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[272],"tags":[],"yoast_head":"\nC\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng<\/title>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\t\n\t\n\t\n","yoast_head_json":{"title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_locale":"vi_VN","og_type":"article","og_title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","og_description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","og_url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_site_name":"Ki\u1ebfn c\u00e0ng","article_author":"https:\/\/www.facebook.com\/anhducnguyen87\/","article_published_time":"2020-03-19T08:39:51+00:00","og_image":[{"url":"https:\/\/kiencang.net\/wp-content\/uploads\/2020\/03\/audits-panel-767x1024.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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","isPartOf":{"@id":"https:\/\/kiencang.net\/#website"},"datePublished":"2020-03-19T08:39:51+00:00","dateModified":"2020-03-19T08:39:51+00:00","author":{"@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16"},"description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","breadcrumb":{"@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kiencang.net\/"},{"@type":"ListItem","position":2,"name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm 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\/16863"}],"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=16863"}],"version-history":[{"count":0,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/16863\/revisions"}],"wp:attachment":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media?parent=16863"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/categories?post=16863"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/tags?post=16863"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
\u0110\u1ec3 \u0111o \u0111\u1ea1c \u1ea3nh h\u01b0\u1edfng c\u1ee7a JavaScript b\u00ean th\u1ee9 ba:<\/p>\n\n\n
B\u1ea1n ch\u1eafc h\u1eb3n hy v\u1ecdng th\u1ea5y t\u1ed1c \u0111\u1ed9 \u0111\u01b0\u1ee3c c\u1ea3i thi\u1ec7n, nh\u01b0ng thi tho\u1ea3ng vi\u1ec7c ch\u1eb7n t\u1ec7p l\u1ec7nh c\u1ee7a b\u00ean th\u1ee9 ba c\u00f3 th\u1ec3 kh\u00f4ng c\u00f3 \u0111\u01b0\u1ee3c \u1ea3nh h\u01b0\u1edfng nh\u01b0 b\u1ea1n mong ch\u1edd. N\u1ebfu b\u1ea1n r\u01a1i v\u00e0o tr\u01b0\u1eddng h\u1ee3p \u0111\u00f3, h\u00e3y gi\u1ea3m danh s\u00e1ch c\u00e1c URL b\u1ecb ch\u1eb7n cho \u0111\u1ebfn khi b\u1ea1n c\u00f4 l\u1eadp \u0111\u01b0\u1ee3c m\u1ed9t c\u00e1i l\u00e0 nguy\u00ean nh\u00e2n g\u00e2y ch\u1eadm ch\u1ea1p.<\/p>\n\n\n
L\u01b0u \u00fd r\u1eb1ng b\u1ea1n c\u1ea7n th\u1ee9c hi\u1ec7n \u00edt nh\u1ea5t l\u00e0 ba l\u1ea7n ch\u1ea1y \u0111\u1ec3 \u0111o \u0111\u1ea1c v\u00e0 xem x\u00e9t gi\u00e1 tr\u1ecb trung b\u00ecnh, \u0111i\u1ec1u \u0111\u00f3 s\u1ebd cho ra gi\u00e1 tr\u1ecb \u1ed5n \u0111\u1ecbnh h\u01a1n. C\u00e1c n\u1ed9i dung c\u1ee7a b\u00ean th\u1ee9 ba th\u1ec9nh tho\u1ea3ng s\u1ebd k\u00e9o c\u00e1c t\u00e0i nguy\u00ean kh\u00e1c nhau m\u1ed7i khi t\u1ea3i trang, c\u00e1ch ti\u1ebfp c\u1eadn n\u00e0y cho ph\u00e9p b\u1ea1n c\u00f3 \u0111\u01b0\u1ee3c \u01b0\u1edbc t\u00ednh th\u1ef1c t\u1ebf h\u01a1n. DevTools gi\u1edd h\u1ed7 tr\u1ee3 c\u00f9ng l\u00fac nhi\u1ec1u b\u1ea3n ghi trong panel Performance<\/strong>, gi\u00fap b\u1ea1n l\u00e0m \u0111i\u1ec1u n\u00e0y d\u1ec5 d\u00e0ng h\u01a1n m\u1ed9t ch\u00fat.<\/p>\n\n\n(D\u1ecbch t\u1eeb b\u00e0i vi\u1ebft: Identify slow third-party JavaScript, t\u00e1c gi\u1ea3: Milica Mihajlija, trang web[.]dev)<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"Ghi ch\u00fa c\u1ee7a ng\u01b0\u1eddi d\u1ecbch: B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba. …<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[272],"tags":[],"yoast_head":"\nC\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng<\/title>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\t\n\t\n\t\n","yoast_head_json":{"title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_locale":"vi_VN","og_type":"article","og_title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","og_description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","og_url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_site_name":"Ki\u1ebfn c\u00e0ng","article_author":"https:\/\/www.facebook.com\/anhducnguyen87\/","article_published_time":"2020-03-19T08:39:51+00:00","og_image":[{"url":"https:\/\/kiencang.net\/wp-content\/uploads\/2020\/03\/audits-panel-767x1024.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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","isPartOf":{"@id":"https:\/\/kiencang.net\/#website"},"datePublished":"2020-03-19T08:39:51+00:00","dateModified":"2020-03-19T08:39:51+00:00","author":{"@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16"},"description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","breadcrumb":{"@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kiencang.net\/"},{"@type":"ListItem","position":2,"name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm 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\/16863"}],"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=16863"}],"version-history":[{"count":0,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/16863\/revisions"}],"wp:attachment":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media?parent=16863"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/categories?post=16863"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/tags?post=16863"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
(D\u1ecbch t\u1eeb b\u00e0i vi\u1ebft: Identify slow third-party JavaScript, t\u00e1c gi\u1ea3: Milica Mihajlija, trang web[.]dev)<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"Ghi ch\u00fa c\u1ee7a ng\u01b0\u1eddi d\u1ecbch: B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba. …<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[272],"tags":[],"yoast_head":"\nC\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng<\/title>\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\t\n\t\n\t\n","yoast_head_json":{"title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_locale":"vi_VN","og_type":"article","og_title":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","og_description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","og_url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","og_site_name":"Ki\u1ebfn c\u00e0ng","article_author":"https:\/\/www.facebook.com\/anhducnguyen87\/","article_published_time":"2020-03-19T08:39:51+00:00","og_image":[{"url":"https:\/\/kiencang.net\/wp-content\/uploads\/2020\/03\/audits-panel-767x1024.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\/xac-dinh-javascript-ben-thu-ba-cham-website\/","url":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/","name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm website • Ki\u1ebfn c\u00e0ng","isPartOf":{"@id":"https:\/\/kiencang.net\/#website"},"datePublished":"2020-03-19T08:39:51+00:00","dateModified":"2020-03-19T08:39:51+00:00","author":{"@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16"},"description":"B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba.","breadcrumb":{"@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kiencang.net\/xac-dinh-javascript-ben-thu-ba-cham-website\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kiencang.net\/"},{"@type":"ListItem","position":2,"name":"C\u00e1ch x\u00e1c \u0111\u1ecbnh JavaScript c\u1ee7a b\u00ean th\u1ee9 ba l\u00e0m ch\u1eadm 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\/16863"}],"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=16863"}],"version-history":[{"count":0,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/16863\/revisions"}],"wp:attachment":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media?parent=16863"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/categories?post=16863"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/tags?post=16863"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
Ghi ch\u00fa c\u1ee7a ng\u01b0\u1eddi d\u1ecbch: B\u00e0i vi\u1ebft n\u00e0y l\u00e0 m\u1ed9t h\u01b0\u1edbng d\u1eabn th\u1ef1c h\u00e0nh quan tr\u1ecdng gi\u00fap b\u1ea1n x\u00e1c \u0111\u1ecbnh \u0111\u01b0\u1ee3c JavaScript c\u1ee5 th\u1ec3 n\u00e0o \u0111ang l\u00e0m trang t\u1ea3i ch\u1eadm. Sau m\u1ed9t t\u00e1 l\u00fd thuy\u1ebft v\u1ec1 c\u00e1ch c\u1ea3i thi\u1ec7n t\u1ed1c \u0111\u1ed9 website th\u00ec r\u00fat c\u1ee5c b\u1ea1n c\u0169ng ph\u1ea3i \u0111i \u0111\u1ebfn c\u00f4ng vi\u1ec7c tr\u00ean th\u1ef1c \u0111\u1ecba. …<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[272],"tags":[],"yoast_head":"\n