{"id":11715,"date":"2019-02-13T14:34:57","date_gmt":"2019-02-13T14:34:57","guid":{"rendered":"https:\/\/www.ducanhplus.com\/?p=11715"},"modified":"2019-02-13T14:34:57","modified_gmt":"2019-02-13T14:34:57","slug":"tri-hoan-tai-anh","status":"publish","type":"post","link":"https:\/\/kiencang.net\/tri-hoan-tai-anh\/","title":{"rendered":"C\u00e1ch tr\u00ec ho\u00e3n t\u1ea3i \u1ea3nh gi\u00fap t\u0103ng t\u1ed1c \u0111\u1ed9 website"},"content":{"rendered":"\n<p>\u1ea2nh tr\u00ec ho\u00e3n (deferred image) l\u00e0 \u1ea3nh ch\u1ec9 \u0111\u01b0\u1ee3c t\u1ea3i xu\u1ed1ng sau khi <a href=\"https:\/\/kiencang.net\/uu-tien-noi-dung-hien-thi\/\" target=\"_blank\" rel=\"noreferrer noopener\">n\u1ed9i dung thu\u1ed9c m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean<\/a> (initial page) t\u1ea3i xong.<\/p>\n\n\n<p>C\u00e1c h\u00ecnh \u1ea3nh kh\u00f4ng n\u1eb1m trong m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean (below the fold) c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c tr\u00ec ho\u00e3n, \u0111i\u1ec1u \u0111\u00f3 cho ph\u00e9p <a href=\"https:\/\/kiencang.net\/tang-toc-wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\">n\u1ed9i dung website c\u1ee7a b\u1ea1n t\u1ea3i nhanh h\u01a1n<\/a>.<\/p>\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_60 counter-hierarchy ez-toc-counter ez-toc-light-blue ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title \" >M\u1ee5c l\u1ee5c<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\" role=\"button\"><label for=\"item-6577d6c442140\" ><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/label><input aria-label=\"Toggle\" aria-label=\"item-6577d6c442140\"  type=\"checkbox\" id=\"item-6577d6c442140\"><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/kiencang.net\/tri-hoan-tai-anh\/#Tri_hoan_tai_hinh_anh_giup_trang_tai_nhanh_hon\" title=\"Tr\u00ec ho\u00e3n t\u1ea3i h\u00ecnh \u1ea3nh gi\u00fap trang t\u1ea3i nhanh h\u01a1n\">Tr\u00ec ho\u00e3n t\u1ea3i h\u00ecnh \u1ea3nh gi\u00fap trang t\u1ea3i nhanh h\u01a1n<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/kiencang.net\/tri-hoan-tai-anh\/#Day_la_van_de_da_duoc_biet_den_lau_roi\" title=\"\u0110\u00e2y l\u00e0 v\u1ea5n \u0111\u1ec1 \u0111\u00e3 \u0111\u01b0\u1ee3c bi\u1ebft \u0111\u1ebfn l\u00e2u r\u1ed3i!\">\u0110\u00e2y l\u00e0 v\u1ea5n \u0111\u1ec1 \u0111\u00e3 \u0111\u01b0\u1ee3c bi\u1ebft \u0111\u1ebfn l\u00e2u r\u1ed3i!<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/kiencang.net\/tri-hoan-tai-anh\/#Tri_hoan_tai_anh_ma_khong_can_lazy_loading_hoac_jQuery\" title=\"Tr\u00ec ho\u00e3n t\u1ea3i \u1ea3nh m\u00e0 kh\u00f4ng c\u1ea7n lazy loading ho\u1eb7c jQuery\">Tr\u00ec ho\u00e3n t\u1ea3i \u1ea3nh m\u00e0 kh\u00f4ng c\u1ea7n lazy loading ho\u1eb7c jQuery<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/kiencang.net\/tri-hoan-tai-anh\/#Chung_ta_hay_thao_luan_ve_phan_tri_hoan_anh\" title=\"Ch\u00fang ta h\u00e3y th\u1ea3o lu\u1eadn v\u1ec1 ph\u1ea7n tr\u00ec ho\u00e3n \u1ea3nh\">Ch\u00fang ta h\u00e3y th\u1ea3o lu\u1eadn v\u1ec1 ph\u1ea7n tr\u00ec ho\u00e3n \u1ea3nh<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/kiencang.net\/tri-hoan-tai-anh\/#Hieu_cach_trang_web_tai_xuong\" title=\"Hi\u1ec3u c\u00e1ch trang web t\u1ea3i xu\u1ed1ng\">Hi\u1ec3u c\u00e1ch trang web t\u1ea3i xu\u1ed1ng<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/kiencang.net\/tri-hoan-tai-anh\/#Lieu_lazy_loading_co_lam_dieu_nay_cho_toi_khong\" title=\"Li\u1ec7u lazy loading c\u00f3 l\u00e0m \u0111i\u1ec1u n\u00e0y cho t\u00f4i kh\u00f4ng?\">Li\u1ec7u lazy loading c\u00f3 l\u00e0m \u0111i\u1ec1u n\u00e0y cho t\u00f4i kh\u00f4ng?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/kiencang.net\/tri-hoan-tai-anh\/#Giao_dien_mot_trang_One_page_templates\" title=\"Giao di\u1ec7n m\u1ed9t trang \/ One page templates\">Giao di\u1ec7n m\u1ed9t trang \/ One page templates<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/kiencang.net\/tri-hoan-tai-anh\/#Day_la_luc_chung_ta_thuc_hien_viec_tri_hoan_tai_anh_thay_vi_tai_luoi_bieng\" title=\"\u0110\u00e2y l\u00e0 l\u00fac ch\u00fang ta th\u1ef1c hi\u1ec7n vi\u1ec7c tr\u00ec ho\u00e3n t\u1ea3i \u1ea3nh thay v\u00ec t\u1ea3i l\u01b0\u1eddi bi\u1ebfng\">\u0110\u00e2y l\u00e0 l\u00fac ch\u00fang ta th\u1ef1c hi\u1ec7n vi\u1ec7c tr\u00ec ho\u00e3n t\u1ea3i \u1ea3nh thay v\u00ec t\u1ea3i l\u01b0\u1eddi bi\u1ebfng<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/kiencang.net\/tri-hoan-tai-anh\/#Lam_no_the_nao_day\" title=\"L\u00e0m n\u00f3 th\u1ebf n\u00e0o \u0111\u00e2y?\">L\u00e0m n\u00f3 th\u1ebf n\u00e0o \u0111\u00e2y?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/kiencang.net\/tri-hoan-tai-anh\/#Su_dung\" title=\"S\u1eed d\u1ee5ng\">S\u1eed d\u1ee5ng<\/a><\/li><\/ul><\/nav><\/div>\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Tri_hoan_tai_hinh_anh_giup_trang_tai_nhanh_hon\"><\/span>Tr\u00ec ho\u00e3n t\u1ea3i h\u00ecnh \u1ea3nh gi\u00fap trang t\u1ea3i nhanh h\u01a1n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<p>B\u00e0i vi\u1ebft n\u00e0y s\u1ebd h\u01b0\u1edbng d\u1eabn b\u1ea1n c\u00e1ch \u0111\u01a1n gi\u1ea3n \u0111\u1ec3 \u00e1p d\u1ee5ng tr\u00ec ho\u00e3n t\u1ea3i \u1ea3nh m\u00e0 kh\u00f4ng c\u1ea7n \u0111\u1ebfn jQuery ho\u1eb7c <a href=\"https:\/\/kiencang.net\/lazy-load-anh-va-video\/\" target=\"_blank\" rel=\"noreferrer noopener\">lazy loading (t\u1ea3i l\u01b0\u1eddi bi\u1ebfng)<\/a>.<\/p>\n\n\n<p>M\u1ed9t trong nh\u1eefng l\u00fd do ch\u00ednh khi\u1ebfn trang web b\u1ecb t\u1ea3i ch\u1eadm l\u00e0 do trang c\u00f3 nhi\u1ec1u \u1ea3nh. Ng\u01b0\u1eddi d\u00f9ng \u1edf kh\u1eafp n\u01a1i tr\u00ean th\u1ebf gi\u1edbi \u0111\u1ec1u th\u1ea5y m\u1ed9t hi\u1ec7n t\u01b0\u1ee3ng ph\u1ed5 bi\u1ebfn l\u00e0 c\u00e1c \u1ea3nh \u0111\u01b0\u1ee3c t\u1ea3i xu\u1ed1ng ch\u1eadm ch\u1ea1p t\u1eeb tr\u00ean xu\u1ed1ng d\u01b0\u1edbi.<\/p>\n\n\n<p>Th\u1eadm ch\u00ed ngay c\u1ea3 khi ng\u01b0\u1eddi d\u00f9ng th\u1ea5y c\u00e1c \u1ea3nh \u0111\u01b0\u1ee3c t\u1ea3i ch\u1eadm t\u1eeb t\u1eeb, th\u01b0\u1eddng v\u1eabn c\u00f3 nhi\u1ec1u \u1ea3nh \u1edf s\u00e2u b\u00ean d\u01b0\u1edbi trang kh\u00f4ng c\u1ea7n hi\u1ec3n th\u1ecb cho ng\u01b0\u1eddi d\u00f9ng ngay l\u00fac \u0111\u00f3, trong khi ch\u00fang c\u0169ng v\u1eabn \u0111ang \u0111\u01b0\u1ee3c t\u1ea3i ngay khi ng\u01b0\u1eddi d\u00f9ng truy c\u1eadp web.<\/p>\n\n\n<p>T\u1ea5t c\u1ea3 nh\u1eefng \u1ea3nh n\u00e0y <em>c\u1ea1nh tranh v\u1edbi nhau cho l\u01b0\u1ee3ng b\u0103ng th\u00f4ng gi\u1edbi h\u1ea1n<\/em> c\u0169ng nh\u01b0 c\u1ea1nh tranh v\u1edbi c\u00e1c ngu\u1ed3n t\u00e0i nguy\u00ean kh\u00e1c ch\u1eb3ng h\u1ea1n nh\u01b0 CSS v\u00e0 JavaScript. \u0110i\u1ec1u \u0111\u00f3 ngh\u0129a l\u00e0, c\u00e1c \u1ea3nh \u0111ang c\u1ea3n tr\u1edf vi\u1ec7c hi\u1ec3n th\u1ecb ph\u1ea7n n\u1ed9i dung thu\u1ed9c m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean c\u1ee7a trang web cho ng\u01b0\u1eddi d\u00f9ng trong kh\u1ea3 n\u0103ng nhanh nh\u1ea5t c\u00f3 th\u1ec3 c\u1ee7a n\u00f3.<\/p>\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Day_la_van_de_da_duoc_biet_den_lau_roi\"><\/span>\u0110\u00e2y l\u00e0 v\u1ea5n \u0111\u1ec1 \u0111\u00e3 \u0111\u01b0\u1ee3c bi\u1ebft \u0111\u1ebfn l\u00e2u r\u1ed3i!<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<p>C\u00e1ch ch\u00ednh m\u00e0 nh\u00e0 ph\u00e1t tri\u1ec3n v\u00e0 ng\u01b0\u1eddi qu\u1ea3n tr\u1ecb web gi\u1ea3i quy\u1ebft v\u1ea5n \u0111\u1ec1 n\u00e0y l\u00e0 th\u00f4ng qua m\u1ed9t ph\u01b0\u01a1ng th\u1ee9c g\u1ecdi l\u00e0 lazy loading (t\u1ea3i l\u01b0\u1eddi bi\u1ebfng).<\/p>\n\n\n<p>C\u00e1c \u1ea3nh t\u1ea3i l\u01b0\u1eddi l\u00e0 m\u1ed9t gi\u1ea3i ph\u00e1p trong \u0111\u00f3 khi ng\u01b0\u1eddi d\u00f9ng cu\u1ed9n chu\u1ed9t xu\u1ed1ng b\u00ean d\u01b0\u1edbi, c\u00e1c \u1ea3nh trong khung nh\u00ecn m\u1edbi \u0111\u01b0\u1ee3c t\u1ea3i, c\u00e1c \u1ea3nh b\u00ean d\u01b0\u1edbi th\u00ec kh\u00f4ng (t\u1ea3i \u1ea3nh theo nhu c\u1ea7u c\u1ee7a ng\u01b0\u1eddi d\u00f9ng). C\u00f3 r\u1ea5t nhi\u1ec1u \u0111i\u1ec1u th\u00fa v\u1ecb v\u1ec1 ph\u01b0\u01a1ng th\u1ee9c t\u1ea3i l\u01b0\u1eddi v\u00e0 t\u00f4i s\u1eed d\u1ee5ng n\u00f3 th\u01b0\u1eddng xuy\u00ean, nh\u01b0ng n\u00f3 c\u00f3 m\u1ed9t s\u1ed1 v\u1ea5n \u0111\u1ec1&#8230;<\/p>\n\n\n<ul><li>Lazy loading c\u00f3 th\u1ec3 l\u00e0 nguy\u00ean nh\u00e2n g\u00e2y ra v\u1ea5n \u0111\u1ec1 v\u1ec1 hi\u1ec7u su\u1ea5t, t\u1ed1c \u0111\u1ed9.<\/li><li>Lazy loading kh\u00f4ng ph\u1ea3i l\u00e0 m\u1ed9t gi\u1ea3i ph\u00e1p kh\u1ea3 thi cho m\u1ed9t s\u1ed1 trang web.<\/li><li><a href=\"https:\/\/kiencang.net\/khong-nen-su-dung-lazy-load-anh-tren-thiet-bi-di-dong\/\" target=\"_blank\" rel=\"noreferrer noopener\">Lazy loading kh\u00f4ng ph\u1ea3i l\u00e0 \u00fd t\u01b0\u1edfng hay \u0111\u1ec3 gi\u1ea3i quy\u1ebft v\u1ea5n \u0111\u1ec1 v\u1ec1 hi\u1ec7u su\u1ea5t, t\u1ed1c \u0111\u1ed9 tr\u00ean di \u0111\u1ed9ng<\/a>.<\/li><\/ul>\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Tri_hoan_tai_anh_ma_khong_can_lazy_loading_hoac_jQuery\"><\/span>Tr\u00ec ho\u00e3n t\u1ea3i \u1ea3nh m\u00e0 kh\u00f4ng c\u1ea7n lazy loading ho\u1eb7c jQuery<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<p>S\u1ef1 th\u1eadt th\u00ec lazy loading \u1ea3nh l\u00e0 c\u00e1ch th\u1ee9c ph\u1ee9c t\u1ea1p h\u01a1n c\u1ee7a ph\u01b0\u01a1ng th\u1ee9c tr\u00ec ho\u00e3n t\u1ea3i \u1ea3nh m\u00e0 th\u00f4i.<\/p>\n\n\n<p>\u0110\u1ec3 quay l\u1ea1i v\u1ea5n \u0111\u1ec1 c\u01a1 b\u1ea3n, ch\u00fang ta s\u1ebd th\u1ea3o lu\u1eadn v\u1ec1 tr\u00ec ho\u00e3n t\u1ea3i \u1ea3nh m\u00e0 kh\u00f4ng c\u00f3 lazy loading. Nh\u01b0ng tr\u01b0\u1edbc h\u1ebft h\u00e3y xem nh\u1eefng vi\u1ec7c m\u00e0 lazy loading th\u1ef1c s\u1ef1 l\u00e0m l\u00e0 g\u00ec \u0111\u00e3:<\/p>\n\n\n<ol><li>Quan s\u00e1t (Observing) v\u1ecb tr\u00ed cu\u1ed9n chu\u1ed9t;<\/li><li>Gi\u00e1m s\u00e1t (Monitoring) v\u1ecb tr\u00ed cu\u1ed9n chu\u1ed9t;<\/li><li>Ph\u1ea3n \u1ee9ng (Reacting) v\u1edbi v\u1ecb tr\u00ed cu\u1ed9n;<\/li><li>Tr\u00ec ho\u00e3n (Deferring) t\u1ea3i \u1ea3nh;<\/li><\/ol>\n\n\n<p>Trong b\u1ed1n b\u01b0\u1edbc k\u1ec3 tr\u00ean, ch\u1ec9 c\u00f3 m\u1ed9t c\u00e1i trong s\u1ed1 ch\u00fang l\u00e0 tr\u00ec ho\u00e3n t\u1ea3i \u1ea3nh.<\/p>\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Chung_ta_hay_thao_luan_ve_phan_tri_hoan_anh\"><\/span>Ch\u00fang ta h\u00e3y th\u1ea3o lu\u1eadn v\u1ec1 ph\u1ea7n tr\u00ec ho\u00e3n \u1ea3nh<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<p><a href=\"https:\/\/kiencang.net\/cach-trang-web-tai-va-hien-thi\/\" target=\"_blank\" rel=\"noreferrer noopener\">Khi m\u1ed9t trang web \u0111\u01b0\u1ee3c render (hi\u1ec3n th\u1ecb) tr\u00ean tr\u00ecnh duy\u1ec7t<\/a>, tr\u00ecnh duy\u1ec7t s\u1ebd c\u1ed1 g\u1eafng t\u1ea3i t\u1ea5t c\u1ea3 \u1ea3nh n\u00f3 c\u00f3 th\u1ec3 t\u00ecm th\u1ea5y tr\u00ean trang. N\u1ebfu c\u00f3 hai \u1ea3nh tr\u00ean trang, n\u00f3 s\u1ebd t\u1ea3i c\u1ea3 hai \u1ea3nh. N\u1ebfu c\u00f3 m\u1ed9t tr\u0103m \u1ea3nh tr\u00ean trang, n\u00f3 s\u1ebd t\u1ea3i c\u1ea3 m\u1ed9t tr\u0103m \u1ea3nh.<\/p>\n\n\n<p>\u0110\u1ea5y l\u00e0 h\u00e0nh vi m\u1eb7c \u0111\u1ecbnh c\u1ee7a tr\u00ecnh duy\u1ec7t. N\u00f3 ph\u1ea3i y\u00eau c\u1ea7u v\u00e0 t\u1ea3i v\u1ec1 t\u1ea5t c\u1ea3 c\u00e1c \u1ea3nh.<\/p>\n\n\n<p>C\u00e1ch \u0111\u00e1ng tin c\u1eady nh\u1ea5t quanh v\u1ea5n \u0111\u1ec1 n\u00e0y (v\u1edbi t\u1ea5t c\u1ea3 c\u00e1c tr\u00ecnh duy\u1ec7t) l\u00e0 \u0111\u00e1nh l\u1eeba tr\u00ecnh duy\u1ec7t \u0111\u1ec3 n\u00f3 ngh\u0129 r\u1eb1ng nh\u1eefng \u1ea3nh n\u00e0y kh\u00f4ng c\u00f3 \u1edf \u0111\u00f3.<\/p>\n\n\n<p>C\u00e1ch th\u1ee9c n\u00e0y \u0111\u01b0\u1ee3c th\u1ef1c hi\u1ec7n trong lazy loading, c\u0169ng nh\u01b0 b\u1ea5t c\u1ee9 v\u1ecb tr\u00ed n\u00e0o kh\u00e1c nh\u1eb1m cung c\u1ea5p m\u1ed9t \u1ea3nh nh\u1ecf m\u1eb7c \u0111\u1ecbnh trong m\u00e3 HTML c\u1ee7a ch\u00fang ta, v\u00e0 sau \u0111\u00f3 chuy\u1ec3n \u1ea3nh m\u1eb7c \u0111\u1ecbnh sang \u1ea3nh ch\u00fang ta th\u1ef1c s\u1ef1 mu\u1ed1n hi\u1ec3n th\u1ecb th\u00f4ng qua JavaScript.<\/p>\n\n\n<p>\u0110i\u1ec1u n\u00e0y c\u00f3 ngh\u0129a l\u00e0 c\u00e1c \u1ea3nh s\u1ebd \u0111\u01b0\u1ee3c \u0111\u00e1nh d\u1ea5u trong m\u00e3 gi\u1ed1ng nh\u01b0 d\u01b0\u1edbi \u0111\u00e2y&#8230;<\/p>\n\n\n<pre class=\"wp-block-preformatted\"><code>&lt;img src=\"anh-gia.png\" data-src=\"anh-that.png\"<\/code><\/pre>\n\n\n<p>Khi trang \u0111\u00e3 th\u1ef1c hi\u1ec7n t\u1ea3i n\u1ed9i dung thu\u1ed9c m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean r\u1ed3i, tr\u00ecnh duy\u1ec7t s\u1ebd nh\u1eadn \u0111\u01b0\u1ee3c &#8220;\u1ea3nh gi\u1ea3&#8221; v\u00e0 \u0111i\u1ec1u \u0111\u00f3 ch\u1ec9 c\u00f3 tr\u00ecnh duy\u1ec7t nh\u1eadn th\u1ea5y m\u00e0 th\u00f4i, v\u00ec th\u1ebf cho d\u00f9 b\u1ea1n c\u00f3 m\u1ed9t \u1ea3nh hay m\u1ed9t tr\u0103m \u1ea3nh c\u0169ng ch\u1eb3ng th\u00e0nh v\u1ea5n \u0111\u1ec1, b\u1edfi v\u00ec tr\u00ecnh duy\u1ec7t \u0111\u00e3 t\u1ea3i c\u00e1c \u1ea3nh gi\u1ea3 r\u1ed3i.<\/p>\n\n\n<p>Sau \u0111\u00f3 th\u00f4ng qua JavaScript, ch\u00fang ta tr\u00e1o \u0111\u1ed5i \u1ea3nh gi\u1ea3 t\u01b0\u01a1ng \u1ee9ng b\u1eb1ng \u1ea3nh th\u1eadt.<\/p>\n\n\n<p>Khi tr\u00ecnh duy\u1ec7t th\u1ea5y r\u1eb1ng c\u00f3 m\u1ed9t \u1ea3nh m\u1edbi (\u1ea3nh th\u1eadt) trong HTML, n\u00f3 s\u1ebd t\u1ea3i \u1ea3nh \u0111\u00f3 ngay l\u00fac \u1ea5y.<\/p>\n\n\n<p>B\u01b0\u1edbc t\u01b0\u01a1ng \u0111\u1ed1i \u0111\u01a1n gi\u1ea3n n\u00e0y c\u00f3 th\u1ec3 t\u1ea1o ra \u0111\u01b0\u1ee3c k\u1ebft qu\u1ea3 r\u1ea5t tuy\u1ec7t v\u1eddi. V\u1eeba m\u1edbi \u0111\u00e2y th\u00f4i, t\u00f4i \u0111\u00e3 bi\u1ebfn m\u1ed9t trang ph\u1ea3i m\u1ea5t t\u00e1m gi\u00e2y \u0111\u1ec3 t\u1ea3i th\u00e0nh ch\u01b0a \u0111\u1ebfn m\u1ed9t gi\u00e2y ch\u1ec9 nh\u1edd ph\u01b0\u01a1ng ph\u00e1p \u0111\u00f3 (ch\u00fang ta s\u1ebd m\u00f4 t\u1ea3 ph\u01b0\u01a1ng ph\u00e1p n\u00e0y \u0111\u1ea7y \u0111\u1ee7 ngay b\u00ean d\u01b0\u1edbi v\u1edbi c\u00e1c code m\u1eabu \u0111\u1ec3 c\u00e1c b\u1ea1n tham kh\u1ea3o).<\/p>\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Hieu_cach_trang_web_tai_xuong\"><\/span>Hi\u1ec3u c\u00e1ch trang web t\u1ea3i xu\u1ed1ng<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<p>\u0110\u1ec3 hi\u1ec3u \u0111\u01b0\u1ee3c c\u00e1ch th\u1ee9c, th\u1eddi \u0111i\u1ec3m v\u00e0 ph\u01b0\u01a1ng th\u1ee9c tr\u00ec ho\u00e3n \u0111\u01b0\u1ee3c d\u00f9ng, ch\u00fang ta c\u1ea7n ph\u1ea3i hi\u1ec3u <a href=\"https:\/\/kiencang.net\/cach-trang-web-tai-va-hien-thi\/\" target=\"_blank\" rel=\"noreferrer noopener\">c\u00e1ch t\u1ea3i trang di\u1ec5n ra nh\u01b0 th\u1ebf n\u00e0o<\/a>. \u0110\u00e2y l\u00e0 ki\u1ebfn th\u1ee9c quan tr\u1ecdng c\u1ea7n bi\u1ebft v\u00e0 n\u00f3 ch\u1ec9 khi\u1ebfn b\u1ea1n t\u1ed1n m\u1ed9t ho\u1eb7c hai ph\u00fat t\u00ecm hi\u1ec3u m\u00e0 th\u00f4i.<\/p>\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/kiencang.net\/wp-content\/uploads\/2019\/02\/cach-tai-trang.png\" alt=\"c\u00e1ch t\u1ea3i trang\" class=\"wp-image-11718\"\/><\/figure><\/div>\n\n\n<p>\u1ea2nh tr\u00ean cho th\u1ea5y m\u1ed9t trang web nh\u1ecf t\u1ea3i ra sao. Trang c\u00f3 m\u1ed9t \u1ea3nh ch\u00ednh, m\u1ed9t v\u00e0i \u1ea3nh kh\u00e1c, m\u1ed9t file CSS v\u00e0 m\u1ed9t file JavaScript.<\/p>\n\n\n<p>Trong trang kh\u00e1 \u0111i\u1ec3n h\u00ecnh n\u00e0y, m\u1ed7i ngu\u1ed3n t\u00e0i nguy\u00ean ph\u1ea3i c\u1ea1nh tranh v\u1edbi nhau \u0111\u1ec3 \u0111\u01b0\u1ee3c t\u1ea3i v\u1ec1.<\/p>\n\n\n<p>S\u1ef1 th\u1eadt l\u00e0 ch\u1ec9 m\u1ed9t s\u1ed1 th\u1ee9 c\u1ea7n t\u1ea3i ngay xu\u1ed1ng l\u00fac ban \u0111\u1ea7u, \u0111\u00f3 l\u00e0 c\u00e1c ph\u1ea7n \u1edf b\u00ean tr\u00ean \u0111\u01b0\u1eddng ch\u1ea5m ch\u1ea5m ngang (- &#8211; &#8211; &#8211; &#8211; -).<\/p>\n\n\n<p>\u0110\u00e2y l\u00e0 ph\u1ea7n \u0111\u01b0\u1ee3c g\u1ecdi l\u00e0 &#8220;trong m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean&#8221; ho\u1eb7c ph\u1ea7n n\u1ed9i dung \u0111\u1ea7u ti\u00ean \u0111\u01b0\u1ee3c nh\u00ecn th\u1ea5y c\u1ee7a trang web.<\/p>\n\n\n<p>\u0110i\u1ec1u n\u00e0y ngh\u0129a l\u00e0 v\u1edbi ng\u01b0\u1eddi d\u00f9ng mu\u1ed1n th\u1ea5y n\u1ed9i dung m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean nhanh nh\u1ea5t c\u00f3 th\u1ec3, ch\u00fang ta ch\u1ec9 c\u1ea7n t\u1ea3i HTML, CSS, JavaScript v\u00e0 \u1ea3nh ch\u00ednh l\u00e0 \u0111\u1ee7.<\/p>\n\n\n<p>H\u00e3y xem c\u00e1ch ch\u00fang ta c\u00f3 th\u1ec3 l\u00e0m trang n\u00e0y t\u1ea3i nhanh h\u01a1n g\u1ea5p \u0111\u00f4i (th\u1eadm ch\u00ed c\u00f2n h\u01a1n) nh\u01b0 th\u1ebf n\u00e0o nh\u00e9. Ch\u00fang ta c\u1ea7n&#8230;<\/p>\n\n\n<ul><li>Ch\u1ec9 t\u1ea3i \u1ea3nh ch\u00ednh th\u00f4i<\/li><li>Tr\u00ec ho\u00e3n t\u1ea3i c\u00e1c \u1ea3nh c\u00f2n l\u1ea1i<\/li><\/ul>\n\n\n<p>Khi ch\u00fang ta l\u00e0m \u0111i\u1ec1u \u0111\u00f3, ch\u00fang ta s\u1ebd th\u1ea5y r\u1eb1ng trang s\u1ebd t\u1ea3i nhanh h\u01a1n nhi\u1ec1u, ng\u01b0\u1eddi d\u00f9ng s\u1ebd th\u1ea5y n\u1ed9i dung s\u1edbm h\u01a1n (\u0111\u00e2y l\u00e0 m\u1ed9t trong c\u00e1c y\u1ebfu t\u1ed1 d\u00f9ng \u0111\u1ec3 \u0111\u00e1nh gi\u00e1 t\u1ed1c \u0111\u1ed9 trang trong Google PageSpeed Insights, n\u00f3 g\u1ecdi l\u00e0 First Contentful Paint\/FCP).<\/p>\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/kiencang.net\/wp-content\/uploads\/2019\/02\/chi-tai-cai-can-tai.png\" alt=\"\u0111\u1ec3 t\u0103ng t\u1ed1c trang, b\u1ea1n ch\u1ec9 c\u1ea7n t\u1ea3i c\u00e1i c\u1ea7n t\u1ea3i\" class=\"wp-image-11719\"\/><\/figure><\/div>\n\n\n<p>Gi\u1edd ch\u00fang ta \u0111\u00e3 c\u1eaft gi\u1ea3m t\u1eeb m\u1ed9t trang ph\u1ea3i y\u00eau c\u1ea7u t\u1ea3i \u0111\u1ebfn 12 t\u00e0i nguy\u00ean m\u1edbi \u0111\u01b0\u1ee3c ph\u00e9p hi\u1ec3n th\u1ecb xu\u1ed1ng trang ch\u1ec9 c\u1ea7n t\u1ea3i 4 t\u00e0i nguy\u00ean th\u00f4i c\u0169ng \u0111\u00e3 \u0111\u1ee7 cho ng\u01b0\u1eddi d\u00f9ng th\u1ea5y n\u1ed9i dung r\u1ed3i.<\/p>\n\n\n<p>T\u00f4i th\u00edch \u0111i\u1ec1u n\u00e0y.<\/p>\n\n\n<p>N\u00f3 c\u00f3 ngh\u0129a l\u00e0 qu\u1ea3ng c\u00e1o Adsense c\u00f3 th\u1ec3 hi\u1ec3n th\u1ecb nhanh h\u01a1n, ng\u01b0\u1eddi d\u00f9ng c\u1ee7a t\u00f4i c\u00f3 th\u1ec3 mua h\u00e0ng s\u1edbm h\u01a1n, v\u00e0 <a href=\"https:\/\/kiencang.net\/yeu-to-xep-hang-cua-google\/\" target=\"_blank\" rel=\"noreferrer noopener\">Google \u0111\u00e1nh gi\u00e1 cao website c\u1ee7a t\u00f4i<\/a>.<\/p>\n\n\n<p>Trung th\u1ef1c h\u01a1n th\u00ec b\u1ea1n v\u00e0 t\u00f4i \u0111\u1ec1u bi\u1ebft r\u1eb1ng c\u00e1c trang c\u1ee7a ch\u00fang ta c\u00f3 h\u00e0ng t\u00e1 \u1ea3nh, kh\u00f4ng ch\u1ec9 c\u00f3 v\u00e0i b\u1ee9c nh\u01b0 trong minh h\u1ecda tr\u00ean. \u0110\u1eebng m\u1eafc sai l\u1ea7m. Ph\u01b0\u01a1ng th\u1ee9c n\u00e0y c\u00f3 th\u1ec3 l\u00e0m trang c\u1ee7a b\u1ea1n t\u1ea3i nhanh h\u01a1n r\u1ea5t nhi\u1ec1u. B\u1ea1n c\u00e0ng c\u00f3 nhi\u1ec1u \u1ea3nh tr\u00ean trang, b\u1ea1n c\u00e0ng ti\u1ebft ki\u1ec7m \u0111\u01b0\u1ee3c nhi\u1ec1u th\u1eddi gian v\u1edbi ph\u01b0\u01a1ng th\u1ee9c n\u00e0y.<\/p>\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Lieu_lazy_loading_co_lam_dieu_nay_cho_toi_khong\"><\/span>Li\u1ec7u lazy loading c\u00f3 l\u00e0m \u0111i\u1ec1u n\u00e0y cho t\u00f4i kh\u00f4ng?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<p>N\u00f3 c\u00f3 ch\u1ee9, nh\u01b0ng c\u00f3 nhi\u1ec1u t\u00ecnh hu\u1ed1ng m\u00e0 lazy loading kh\u00f4ng ph\u1ea3i l\u00e0 bi\u1ec7n ph\u00e1p l\u00fd t\u01b0\u1edfng.<\/p>\n\n\n<p>L\u00fd do ph\u1ed5 bi\u1ebfn nh\u1ea5t l\u00e0 m\u1ecdi ng\u01b0\u1eddi c\u00f3 th\u1ec3 ch\u1ecdn kh\u00f4ng tr\u00ec ho\u00e3n t\u1ea3i h\u00ecnh \u1ea3nh th\u00f4ng qua t\u1ea3i l\u01b0\u1eddi bi\u1ebfng, v\u00e0 \u0111\u00e2y c\u00f3 th\u1ec3 l\u00e0 xu h\u01b0\u1edbng ph\u1ed5 bi\u1ebfn m\u1edbi trong vi\u1ec7c t\u1ea1o c\u00e1c giao di\u1ec7n m\u1ed9t trang.<\/p>\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Giao_dien_mot_trang_One_page_templates\"><\/span>Giao di\u1ec7n m\u1ed9t trang \/ One page templates<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<p>N\u1ebfu b\u1ea1n c\u00f3 giao di\u1ec7n m\u1ed9t trang (\u0111i\u1ec1u n\u00e0y c\u00f3 ngh\u0129a l\u00e0 thanh \u0111i\u1ec1u h\u01b0\u1edbng ch\u00ednh c\u1ee7a b\u1ea1n kh\u00f4ng \u0111\u01b0a b\u1ea1n t\u1edbi c\u00e1c trang kh\u00e1c m\u00e0 l\u00e0 \u0111\u01b0a b\u1ea1n \u0111\u1ebfn c\u00e1c ph\u1ea7n kh\u00e1c nhau c\u1ee7a c\u00f9ng m\u1ed9t trang) v\u00e0 n\u1ebfu b\u1ea1n ch\u1ecdn t\u1ea3i l\u01b0\u1eddi bi\u1ebfng (lazy loading), m\u1ed9t r\u1eafc r\u1ed1i kh\u00f4ng h\u1ec1 nh\u1ecf s\u1ebd n\u1ed5i l\u00ean.<\/p>\n\n\n<p>Khi trang b\u1ea1n t\u1ea3i, ng\u01b0\u1eddi d\u00f9ng th\u1ea5y thanh \u0111i\u1ec1u h\u01b0\u1edbng ch\u00ednh c\u1ee7a b\u1ea1n, v\u00e0 n\u1ebfu h\u1ecd click, h\u1ecd \u0111\u01b0\u1ee3c \u0111\u01b0a \u0111\u1ebfn ph\u1ea7n kh\u00e1c c\u1ee7a trang m\u00e0 hi\u1ec7n kh\u00f4ng c\u00f3 \u1ea3nh n\u00e0o \u0111\u01b0\u1ee3c t\u1ea3i s\u1eb5n l\u00fac \u1ea5y.<\/p>\n\n\n<p>Ch\u1eb9p, t\u00f4i ch\u1eb3ng th\u00edch \u0111i\u1ec1u n\u00e0y \u0111\u00e2u.<\/p>\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter\"><img decoding=\"async\" src=\"https:\/\/kiencang.net\/wp-content\/uploads\/2019\/02\/giao-dien-mot-trang.png\" alt=\"giao di\u1ec7n m\u1ed9t trang\" class=\"wp-image-11720\"\/><\/figure><\/div>\n\n\n<p>Trong tr\u01b0\u1eddng h\u1ee3p n\u00e0y cho d\u00f9 ng\u01b0\u1eddi d\u00f9ng ch\u1ec9 s\u1eed d\u1ee5ng \u0111i\u1ec1u h\u01b0\u1edbng c\u1ee7a b\u1ea1n, h\u1ecd v\u1eabn b\u1ecb \u0111\u01b0a \u0111\u1ebfn c\u00e1c v\u1ecb tr\u00ed m\u00e0 h\u1ecd ph\u1ea3i ch\u1edd \u0111\u1ee3i \u0111\u1ec3 \u1ea3nh t\u1ea3i xong.<\/p>\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Day_la_luc_chung_ta_thuc_hien_viec_tri_hoan_tai_anh_thay_vi_tai_luoi_bieng\"><\/span>\u0110\u00e2y l\u00e0 l\u00fac ch\u00fang ta th\u1ef1c hi\u1ec7n vi\u1ec7c tr\u00ec ho\u00e3n t\u1ea3i \u1ea3nh thay v\u00ec t\u1ea3i l\u01b0\u1eddi bi\u1ebfng<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<p>Trong k\u1ecbch b\u1ea3n giao di\u1ec7n m\u1ed9t trang (one page template), kh\u00f4ng c\u00f3 l\u00fd do n\u00e0o \u0111\u1ec3 b\u1ea1n ph\u1ea3i thi\u1ebft l\u1eadp t\u1ea5t c\u1ea3 m\u1ecdi th\u1ee9 t\u1ea3i l\u01b0\u1eddi bi\u1ebfng (quan s\u00e1t, theo d\u00f5i v\u00e0 ph\u1ea3n \u1ee9ng th\u00edch h\u1ee3p v\u1edbi v\u1ecb tr\u00ed cu\u1ed9n chu\u1ed9t).<\/p>\n\n\n<p>T\u1ea1i sao ch\u00fang ta kh\u00f4ng tr\u00ec ho\u00e3n t\u1ea3i \u1ea3nh v\u00e0 gi\u00fap \u1ea3nh \u0111\u01b0\u1ee3c t\u1ea3i ngay l\u1eadp t\u1ee9c sau khi trang t\u1ea3i xong.<\/p>\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Lam_no_the_nao_day\"><\/span>L\u00e0m n\u00f3 th\u1ebf n\u00e0o \u0111\u00e2y?<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<p>\u0110\u1ec3 l\u00e0m \u0111i\u1ec1u \u0111\u00f3 ch\u00fang ta c\u1ea7n \u0111\u00e1nh d\u1ea5u \u1ea3nh c\u1ee7a m\u00ecnh v\u00e0 th\u00eam m\u1ed9t \u0111o\u1ea1n JavaScript r\u1ea5t nh\u1ecf v\u00e0 c\u1ef1c k\u1ef3 \u0111\u01a1n gi\u1ea3n. T\u00f4i s\u1ebd cho b\u1ea1n th\u1ea5y ph\u01b0\u01a1ng th\u1ee9c m\u00e0 t\u00f4i s\u1eed d\u1ee5ng trong th\u1ef1c t\u1ebf cho trang n\u00e0y v\u00e0 c\u00e1c trang kh\u00e1c. N\u00f3 s\u1eed d\u1ee5ng <a href=\"https:\/\/kiencang.net\/hinh-anh-ma-hoa-base64\/\" target=\"_blank\" rel=\"noreferrer noopener\">\u1ea3nh base 64<\/a>, nh\u01b0ng \u0111\u1eebng \u0111\u1ec3 kh\u00e1i ni\u1ec7m m\u1edbi n\u00e0y l\u00e0m b\u1ea1n lo l\u1eafng.<\/p>\n\n\n<p>M\u00e3 HTML:<\/p>\n\n\n<pre class=\"wp-block-preformatted\"><code>&lt;img src=\"data:image\/png;base64,R0lGODlhAQABAAD\/ACwAAAAAAQABAAACADs=\" data-src=\"anh-that-cua-ban-o-day\"><\/code><\/pre>\n\n\n<p>V\u00e0 JavaScript:<\/p>\n\n\n<pre class=\"wp-block-preformatted\"><code>&lt;script>\nfunction init() {\nvar imgDefer = document.getElementsByTagName('img');\nfor (var i=0; i&lt;imgDefer.length; i++) {\nif(imgDefer[i].getAttribute('data-src')) {\nimgDefer[i].setAttribute('src',imgDefer[i].getAttribute('data-src'));\n} } }\nwindow.onload = init;\n&lt;\/script><\/code><\/pre>\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n<h2 class=\"wp-block-heading\"><span class=\"ez-toc-section\" id=\"Su_dung\"><\/span>S\u1eed d\u1ee5ng<span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n<p>V\u1edbi h\u1ea7u h\u1ebft c\u00e1c trang b\u1ea1n c\u00f3 th\u1ec3 \u0111\u01a1n gi\u1ea3n th\u00eam m\u00e3 n\u00e0y ngay tr\u01b0\u1edbc th\u1ebb \u0111\u00f3ng &lt;\/body&gt; trong m\u00e3 HTML v\u00e0 thay th\u1ebf &#8220;anh-that-cua-ban-o-day&#8221; b\u1eb1ng \u0111\u01b0\u1eddng d\u1eabn h\u00ecnh \u1ea3nh th\u1ef1c t\u1ebf c\u1ee7a b\u1ea1n.<\/p>\n\n\n<p><em>(D\u1ecbch t\u1eeb b\u00e0i vi\u1ebft: How to defer images &#8211; T\u00e1c gi\u1ea3: Patrick Sexton \u2013 Website: Varvy)<\/em><\/p>\n\n\n<hr class=\"wp-block-separator\"\/>\n\n\n<p>V\u00e0i l\u1eddi c\u1ee7a ng\u01b0\u1eddi d\u1ecbch:<\/p>\n\n\n<ul><li>Tr\u00ec ho\u00e3n t\u1ea3i \u1ea3nh hay h\u01a1n lazy load \u1ea3nh \u1edf ch\u1ed7 n\u00f3 l\u00e0m vi\u1ec7c quan tr\u1ecdng tr\u01b0\u1edbc, sau khi ho\u00e0n th\u00e0nh xong n\u00f3 ngay l\u1eadp t\u1ee9c l\u00e0m vi\u1ec7c kh\u00f4ng quan tr\u1ecdng, trong khi lazy load th\u00ec ph\u1ea3i ch\u1edd ng\u01b0\u1eddi d\u00f9ng cu\u1ed9n chu\u1ed9t \u0111\u1ebfn g\u1ea7n m\u1edbi t\u1ea3i (ki\u1ec3u n\u01b0\u1edbc \u0111\u1ebfn ch\u00e2n m\u1edbi nh\u1ea3y).<\/li><li>Tuy v\u1eady kh\u00f4ng c\u00f3 plugin n\u00e0o m\u00e0 t\u00f4i bi\u1ebft hi\u1ec7n h\u1ed7 tr\u1ee3 ph\u01b0\u01a1ng th\u1ee9c tr\u00ec ho\u00e3n t\u1ea3i \u1ea3nh, trong khi c\u00e1c plugin lazy load \u1ea3nh c\u00f3 r\u1ea5t nhi\u1ec1u, v\u00ed d\u1ee5 nh\u01b0 <a rel=\"noreferrer noopener\" href=\"https:\/\/kiencang.net\/plugin-flying-images\/\" target=\"_blank\">Flying Images<\/a> &amp; <a href=\"https:\/\/kiencang.net\/gioi-thieu-plugin-a3-lazy-load\/\" target=\"_blank\" rel=\"noreferrer noopener\">a3 lazy load<\/a>.<\/li><li>S\u1ef1 xu\u1ea5t hi\u1ec7n c\u1ee7a ki\u1ec3u <a href=\"https:\/\/kiencang.net\/native-lazy-loading-cho-web\/\" target=\"_blank\" rel=\"noreferrer noopener\">lazy load c\u1ea5p \u0111\u1ed9 tr\u00ecnh duy\u1ec7t (native lazy-loading)<\/a> tr\u00ean Chrome v\u00e0 kh\u1ea3 n\u0103ng \u0111i\u1ec1u ch\u1ec9nh ng\u01b0\u1ee1ng c\u00e1ch m\u00e0n h\u00ecnh k\u00edch ho\u1ea1t t\u1ea3i \u1ea3nh gi\u00fap lazy load kh\u1eafc ph\u1ee5c \u0111\u01b0\u1ee3c nh\u01b0\u1ee3c \u0111i\u1ec3m \u0111\u1ed9 tr\u1ec5- v\u1ed1n l\u00e0 c\u00e1i \u0111\u00e1ng s\u1ee3 nh\u1ea5t trong lazy load.<\/li><\/ul>\n","protected":false},"excerpt":{"rendered":"<p>\u1ea2nh tr\u00ec ho\u00e3n (deferred image) l\u00e0 \u1ea3nh ch\u1ec9 \u0111\u01b0\u1ee3c t\u1ea3i xu\u1ed1ng sau khi n\u1ed9i dung thu\u1ed9c m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean (initial page) t\u1ea3i xong. C\u00e1c h\u00ecnh \u1ea3nh kh\u00f4ng n\u1eb1m trong m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean (below the fold) c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c tr\u00ec ho\u00e3n, \u0111i\u1ec1u \u0111\u00f3 cho ph\u00e9p n\u1ed9i dung website c\u1ee7a b\u1ea1n t\u1ea3i nhanh h\u01a1n. Tr\u00ec &hellip;<\/p>\n","protected":false},"author":1,"featured_media":13065,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[274],"tags":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v21.6 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>C\u00e1ch tr\u00ec ho\u00e3n t\u1ea3i \u1ea3nh gi\u00fap t\u0103ng t\u1ed1c \u0111\u1ed9 website &#8226; Ki\u1ebfn c\u00e0ng<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/kiencang.net\/tri-hoan-tai-anh\/\" \/>\n<meta property=\"og:locale\" content=\"vi_VN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"C\u00e1ch tr\u00ec ho\u00e3n t\u1ea3i \u1ea3nh gi\u00fap t\u0103ng t\u1ed1c \u0111\u1ed9 website &#8226; Ki\u1ebfn c\u00e0ng\" \/>\n<meta property=\"og:description\" content=\"\u1ea2nh tr\u00ec ho\u00e3n (deferred image) l\u00e0 \u1ea3nh ch\u1ec9 \u0111\u01b0\u1ee3c t\u1ea3i xu\u1ed1ng sau khi n\u1ed9i dung thu\u1ed9c m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean (initial page) t\u1ea3i xong. C\u00e1c h\u00ecnh \u1ea3nh kh\u00f4ng n\u1eb1m trong m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean (below the fold) c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c tr\u00ec ho\u00e3n, \u0111i\u1ec1u \u0111\u00f3 cho ph\u00e9p n\u1ed9i dung website c\u1ee7a b\u1ea1n t\u1ea3i nhanh h\u01a1n. Tr\u00ec &hellip;\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kiencang.net\/tri-hoan-tai-anh\/\" \/>\n<meta property=\"og:site_name\" content=\"Ki\u1ebfn c\u00e0ng\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/anhducnguyen87\/\" \/>\n<meta property=\"article:published_time\" content=\"2019-02-13T14:34:57+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/kiencang.net\/wp-content\/uploads\/2019\/02\/tri-hoan-tai-anh.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1194\" \/>\n\t<meta property=\"og:image:height\" content=\"624\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Nguy\u1ec5n \u0110\u1ee9c Anh\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u0110\u01b0\u1ee3c vi\u1ebft b\u1edfi\" \/>\n\t<meta name=\"twitter:data1\" content=\"Nguy\u1ec5n \u0110\u1ee9c Anh\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u01af\u1edbc t\u00ednh th\u1eddi gian \u0111\u1ecdc\" \/>\n\t<meta name=\"twitter:data2\" content=\"9 ph\u00fat\" \/>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"C\u00e1ch tr\u00ec ho\u00e3n t\u1ea3i \u1ea3nh gi\u00fap t\u0103ng t\u1ed1c \u0111\u1ed9 website &#8226; Ki\u1ebfn c\u00e0ng","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/kiencang.net\/tri-hoan-tai-anh\/","og_locale":"vi_VN","og_type":"article","og_title":"C\u00e1ch tr\u00ec ho\u00e3n t\u1ea3i \u1ea3nh gi\u00fap t\u0103ng t\u1ed1c \u0111\u1ed9 website &#8226; Ki\u1ebfn c\u00e0ng","og_description":"\u1ea2nh tr\u00ec ho\u00e3n (deferred image) l\u00e0 \u1ea3nh ch\u1ec9 \u0111\u01b0\u1ee3c t\u1ea3i xu\u1ed1ng sau khi n\u1ed9i dung thu\u1ed9c m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean (initial page) t\u1ea3i xong. C\u00e1c h\u00ecnh \u1ea3nh kh\u00f4ng n\u1eb1m trong m\u00e0n h\u00ecnh \u0111\u1ea7u ti\u00ean (below the fold) c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c tr\u00ec ho\u00e3n, \u0111i\u1ec1u \u0111\u00f3 cho ph\u00e9p n\u1ed9i dung website c\u1ee7a b\u1ea1n t\u1ea3i nhanh h\u01a1n. Tr\u00ec &hellip;","og_url":"https:\/\/kiencang.net\/tri-hoan-tai-anh\/","og_site_name":"Ki\u1ebfn c\u00e0ng","article_author":"https:\/\/www.facebook.com\/anhducnguyen87\/","article_published_time":"2019-02-13T14:34:57+00:00","og_image":[{"width":1194,"height":624,"url":"https:\/\/kiencang.net\/wp-content\/uploads\/2019\/02\/tri-hoan-tai-anh.png","type":"image\/png"}],"author":"Nguy\u1ec5n \u0110\u1ee9c Anh","twitter_card":"summary_large_image","twitter_misc":{"\u0110\u01b0\u1ee3c vi\u1ebft b\u1edfi":"Nguy\u1ec5n \u0110\u1ee9c Anh","\u01af\u1edbc t\u00ednh th\u1eddi gian \u0111\u1ecdc":"9 ph\u00fat"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/kiencang.net\/tri-hoan-tai-anh\/","url":"https:\/\/kiencang.net\/tri-hoan-tai-anh\/","name":"C\u00e1ch tr\u00ec ho\u00e3n t\u1ea3i \u1ea3nh gi\u00fap t\u0103ng t\u1ed1c \u0111\u1ed9 website &#8226; Ki\u1ebfn c\u00e0ng","isPartOf":{"@id":"https:\/\/kiencang.net\/#website"},"datePublished":"2019-02-13T14:34:57+00:00","dateModified":"2019-02-13T14:34:57+00:00","author":{"@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16"},"breadcrumb":{"@id":"https:\/\/kiencang.net\/tri-hoan-tai-anh\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kiencang.net\/tri-hoan-tai-anh\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/kiencang.net\/tri-hoan-tai-anh\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kiencang.net\/"},{"@type":"ListItem","position":2,"name":"C\u00e1ch tr\u00ec ho\u00e3n t\u1ea3i \u1ea3nh gi\u00fap t\u0103ng t\u1ed1c \u0111\u1ed9 website"}]},{"@type":"WebSite","@id":"https:\/\/kiencang.net\/#website","url":"https:\/\/kiencang.net\/","name":"Ki\u1ebfn c\u00e0ng","description":"\u00d4m l\u00fd thuy\u1ebft, h\u00f4n th\u1ef1c h\u00e0nh","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/kiencang.net\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"vi"},{"@type":"Person","@id":"https:\/\/kiencang.net\/#\/schema\/person\/5e7e1a04d8d1218ad8c421ba43d25c16","name":"Nguy\u1ec5n \u0110\u1ee9c Anh","image":{"@type":"ImageObject","inLanguage":"vi","@id":"https:\/\/kiencang.net\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/6d71f9b89393952a8382e30dad26c1ec?s=96&d=monsterid&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/6d71f9b89393952a8382e30dad26c1ec?s=96&d=monsterid&r=g","caption":"Nguy\u1ec5n \u0110\u1ee9c Anh"},"description":"Sinh n\u0103m 1987, t\u1ed1t nghi\u1ec7p Cao \u0111\u1eb3ng th\u1ef1c h\u00e0nh FPT qu\u00e3ng 2014, chuy\u00ean ng\u00e0nh Thi\u1ebft k\u1ebf website. T\u00f4i th\u00edch Content, SEO, Ads, T\u0103ng t\u1ed1c website v\u00e0 Th\u01b0\u01a1ng m\u1ea1i \u0111i\u1ec7n t\u1eed. B\u00ean c\u1ea1nh b\u00e0i t\u1ef1 vi\u1ebft, t\u00f4i c\u0169ng d\u1ecbch nhi\u1ec1u n\u1ed9i dung th\u00fa v\u1ecb c\u1ee7a c\u00e1c t\u00e1c gi\u1ea3 kh\u00e1c nhau. FB c\u00e1 nh\u00e2n: facebook.com\/anhducnguyen87. Email li\u00ean h\u1ec7: guiemailchotoi@gmail.com","sameAs":["https:\/\/www.facebook.com\/anhducnguyen87\/"],"url":"https:\/\/kiencang.net\/author\/admin\/"}]}},"_links":{"self":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/11715"}],"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=11715"}],"version-history":[{"count":0,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/posts\/11715\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media\/13065"}],"wp:attachment":[{"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/media?parent=11715"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/categories?post=11715"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kiencang.net\/wp-json\/wp\/v2\/tags?post=11715"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}