Nếu bạn chưa biết thì trong phiên bản 4.2.6 của theme Paradise được phát hành ngày 24/02/2017 vừa rồi, chúng tôi đã loại bỏ code async (tải không đồng bộ) JavaScript (JS) và thay vào đó là code chuyển toàn bộ JavaScript xuống footer. Sở dĩ chúng tôi làm như vậy là vì việc async JS có thể gây ra lỗi tải thiếu JS trong một số trường hợp, làm cho tính năng cũng nhưng giao diện của blog/ website hiển thị không đầy đủ, đặc biệt là khi sử dụng plugin tạo cache.
Tăng tốc WordPress
Tổng hợp các thủ thuật và plugins tối ưu tốc độ load, giúp bạn tăng tốc WordPress một cách đơn giản và nhanh chóng mà không gây lỗi.
Tải có điều kiện các file JS và CSS của plugin WooCommerce
WooCommerce là một trong những plugin hỗ trợ xây dựng shop bán hàng online trên nền tảng WordPress phổ biến nhất và tốt nhất hiện nay. Theo mặc định, nếu blog/ website WordPress của bạn có cài đặt WooCommerce thì tất cả các trang đều sẽ tải file JS và CSS của plugin này. Điều đó vô tình khiến cho page-size cũng như lượng request của mỗi trang đều tăng lên đáng kể, làm blog/ website của bạn tải chậm hơn, khách hàng phải đợi lâu hơn và nguy cơ mất khách cũng tăng rõ rệt.
Ngăn JS và CSS tải trên những trang nhất định của WordPress
Thông thường, các file JS và CSS của theme hoặc plugin mà bạn đã cài đặt, active sẽ mặc định được tải trên tất cả các trang trong blog/ website WordPress, kể cả khi chúng không đóng bất cứ vai trò gì đối với giao diện cũng như chức năng của trang. Ví dụ như plugin kk Star Ratings, mặc dù bạn chỉ thiết lập hiển thị đánh giá 5 sao trên bài viết và trang đơn, nhưng file JS và CSS của nó xuất hiện cả trên trang chủ và các trang archives.
Tải không đồng bộ JavaScript trong WordPress mà không dùng plugin
Nếu bạn đã từng kiểm tra thử tốc độ load blog/ website của mình với công cụ Google PageSpeed Insights thì chắc hẳn đã ít nhất một lần nhìn thấy cảnh báo “Eliminate render-blocking JavaScript and CSS in above-the-fold content” (Loại bỏ JavaScript và CSS chặn hiển thị trong nội dung trong màn hình đầu tiên) rồi phải không nào? Điều này có nghĩa là trình duyệt web sẽ tải các file .js và .css (dùng để hiển thị giao diện) trước khi hoàn tất việc tải phần text (chữ). Nó làm cho quá trình hiển thị phần text bị chậm đi.
Cache Gravatar giúp blog/ website WordPress load nhanh hơn
Nếu bạn chưa biết thì Gravatar trong phần bình luận của blog/ website WordPress sẽ được tải từ server của Gravatar.com chứ không phải từ host của bạn. Do đó, ngay cả khi site của bạn được lưu trữ trên server tại Việt Nam thì nó vẫn bị ảnh hưởng bởi sự cố cáp quang biển, nhất là trong trường hợp bài viết có nhiều bình luận. Vậy làm sao để giải quyết vấn đề này nhằm tăng tốc độ load cho blog/ website WordPress của bạn?
Sử dụng định dạng WebP cho hình ảnh trong WordPress
Nếu bạn chưa biết thì WebP chính là một trong những chìa khóa quan trọng giúp WP Căn bản có được tốc độ load “thần sầu” như ngày hôm nay, bên cạnh những bí quyết đã được bật mí trước đó. Với WebP, các bạn có thể giảm page-size đi đáng kể nhờ dung lượng của ảnh ở định dạng WebP thấp hơn rất nhiều so với PNG hay JPG/JPEG truyền thống. Việc sử dụng WebP trong WordPress hiện tại cũng đã trở nên rất dễ dàng nhờ sự trợ giúp của một số plugin chuyên dụng.
MinWP – Plugin tối ưu CSS và JS cho WordPress giá chỉ 200k
Ngoài hình ảnh thì CSS và JS là một trong những thành phần quan trọng nhất quyết định tốc độ load của một blog/ website WordPress. Nếu blog/ website của bạn sử dụng quá nhiều tập tin CSS, JS và chúng không được tối ưu đúng cách, chắc chắn tốc độ load thực tế cũng như điểm test bằng các công cụ như Google PageSpeed Insights, GTMetrix, Pingdom… không thể cao được. Tốc độ load chậm không những ảnh hưởng tới trải nghiệm người dùng, tăng tỉ lệ thoát mà còn khiến blog/ website của bạn “mất điểm” trong mắt Google.
Nén Emoji giúp blog/ website WordPress load nhanh hơn
Trong bài viết hôm trước tôi đã từng hướng dẫn các bạn cách loại bỏ Emoji ra khỏi những trang không sử dụng hoặc hiếm khi sử dụng các biểu tượng cảm xúc (thường gọi là icon mặt cười) rồi phải không nào? Việc này sẽ giúp làm gọn HTML và khiến blog/ website của bạn load nhanh hơn. Nhưng sẽ như thế nào nếu Emoji là một phần thiết yếu đối với blog của bạn? Đừng lo lắng, ngay sau đây là một giải pháp tuyệt vời để tối ưu Emoji mà không cần phải loại bỏ nó.
Lưu trữ hình ảnh trên subdomain trong WordPress
Nếu để ý, chắc bạn sẽ thấy tất cả link hình ảnh trên blog WP Căn bản đều có dạng static.wpcanban.com phải không nào? Nhiều độc giả thắc mắc liệu có phải chúng tôi đang sử dụng CDN hay không? Câu trả lời là không nhé. Thực ra, tôi đã chuyển thư mục uploads WordPress lên lưu trữ trên subdomain. Do đó, link của các tập tin được upload (trong đó có cả link hình ảnh) sẽ có dạng subdomain thay vì domain chính.
Bình luận mới nhất