4 cấp độ tối ưu hóa ảnh trong WordPress

Tối ưu hóa ảnh rất quan trọng trong việc cải thiện tốc độ website WordPress, hôm nay chúng ta sẽ đi vào chi tiết từng cấp độ. Tại sao bạn cần tối ưu hóa ảnh? Tôi hy vọng bức hình trên cung cấp cho bạn một vài cảm nhận. Khi công nghệ phát triển, chất lượng thiết bị chụp hình đã được cải thiện rất nhiều. Thậm chí các dòng điện thoại mới như iPhone, OnePlus có khả năng chụp ảnh ở độ phân giải lên tới 4032 x 3024 pixel, và kèm với đó là kích cỡ vài MB. …

Đọc thêm

Tại sao việc “tối ưu hóa” hình ảnh trên website của bạn với định dạng Base64 hầu như luôn là một ý tưởng tồi

Thật không may, ngay cả cho đến thời điểm này, một số plugin và blog chuyên về mảng tối ưu hóa vẫn đề xuất “tối ưu” hình ảnh của bạn bằng cách mã hóa chúng thành dạng Base64 và đưa thẳng đoạn mã đó vào HTML. Trong bài đăng này, tôi muốn giải đáp thắc mắc: Tại sao trong thời đại ngày nay, đây gần như luôn là một ý tưởng tồi đã được mang vác từ nhiều năm trước rồi.  Ngày xưa, các trình duyệt web bị giới hạn nghiêm trọng về số lượng kết nối đồng thời mà …

Đọc thêm

Hình ảnh mã hóa Base64 trong tăng tốc website

Cập nhật: hiện mã hóa ảnh bằng base64 không còn là biện pháp tối ưu tốt trong nhiều trường hợp. Nhiều người không biết rằng ảnh có thể được nội tuyến vào mã HTML, phương thức để làm điều đó là thực hiện mã hóa base64. Ảnh được mã hóa base64 trở thành một phần của HTML và được hiển thị mà không cần phải tải ảnh từ file bên ngoài nữa. Base64 là gì? Đây là một trong những cách cổ xưa nhất để mã hóa thứ gì đó để đưa vào HTML (được đề xuất lần đầu tiên …

Đọc thêm

Cách inline ảnh sử dụng Base64/SVG trong WordPress

Một trong các mục tiêu chính của tôi trong việc tối ưu hóa tốc độ website là cải thiện First Contentful Paint và First Meaningful Paint, làm cho nội dung thuộc màn hình đầu tiên hiển thị nhanh nhất có thể. Lý tưởng nhất, trình duyệt nên có khả năng render và style nội dung thuộc màn hình đầu tiên (above fold content) với số lượng ít nhất các yêu cầu HTTP. Tạo critical CSS, cộng với trì hoãn tải JavaScript và CSS rất có ích trong chuyện này. Một trong các kỹ thuật tương tự mà tôi dùng để …

Đọc thêm