Ghi chú từ đội ngũ về tay nghề, định dạng và những quyết định nhỏ đằng sau một kết quả tốt.
Vì sao AVIF thắng PNG dứt khoát về dung lượng
AVIF được xây trên định dạng hình ảnh hiện đại, thiết kế cho hiệu quả theo cảm nhận chứ không vì độ trung thực không mất dữ liệu. PNG dùng DEFLATE trên dữ liệu điểm ảnh thô, vốn không mất dữ liệu nhưng để nguyên lượng dư thừa khổng lồ trong nội dung ảnh chụp. AVIF thay phần dư thừa đó bằng dự đoán theo khối mượn từ video, loại bỏ thông tin mà hệ thị giác con người không nhận ra. Kết quả rất mạnh. Một ảnh 116 kilobyte chuyển còn khoảng 16 kilobyte ở chất lượng 85, và một PNG trong suốt thường nhỏ hơn 30 đến 50 phần trăm so với WebP tương đương. Khoảng cách nới rộng với ảnh chụp độ phân giải cao và thu hẹp với đồ họa đơn giản. Với bất kỳ trang nào phục vụ ảnh trong suốt cho khán giả hiện đại, băng thông tiết kiệm được dịch thẳng thành tải nhanh hơn và chi phí truyền dữ liệu thấp hơn.
Câu chuyện kênh alpha chi tiết
Cả PNG và AVIF đều lưu độ trong suốt thành một mặt phẳng alpha riêng nằm cạnh dữ liệu màu. Khi cặp này xử lý PNG của bạn, bộ giải mã tách riêng các điểm ảnh màu và lớp mặt nạ alpha. Sau đó phần xử lý ghi một tệp mới với rãnh alpha riêng, dùng nén hiện đại để nén cả hai mặt phẳng ở chất lượng 85. Lớp alpha không bị nướng vào màu và không bị thay bằng nền tô. Bóng đổ mềm, viền mờ và dải chuyển bán trong suốt đều được ghi lại trung thực. Cái giá duy nhất AVIF thêm vào là nén có mất dữ liệu trên chính mặt phẳng alpha, có thể tạo viền nhạt khó thấy quanh các cạnh rất cứng khi phóng to cực đại. Ở kích thước hiển thị thường và chất lượng 85, khác biệt không thấy được. Với biểu tượng cần chuẩn từng điểm ảnh ở kích thước nhỏ, hãy giữ PNG.
Tốc độ chuyển thực tế theo từng trình duyệt
Phần xử lý nạp một lần mỗi phiên trình duyệt, khoảng 800 mili giây để lấy về cộng 300 để khởi tạo, nên lần chuyển đầu tiên mang theo khoảng một giây khởi động. Các lần đã khởi động bỏ qua hẳn phần này. Trên Chrome máy tính, 0.12 megapixel mất khoảng 40 mili giây, 1 megapixel khoảng 250 mili giây, và 8 megapixel khoảng 2.8 giây. Firefox là ngoại lệ, chạy cùng phần xử lý chậm hơn khoảng bốn lần, nên một ảnh 4K ở đó có thể mất 30 giây trở lên. WebKit trên Safari nằm giữa hai bên, gần Chrome hơn. Trên phần cứng di động tầm trung, các con số tệ hơn ba đến năm lần so với Chrome máy tính. Nếu bạn hay chuyển tệp lớn, Chrome trên máy tính cho thông lượng tốt nhất.
Khi nào nên giữ PNG thay vì chuyển
PNG vẫn là lựa chọn đúng trong vài trường hợp ngay cả khi dung lượng quan trọng. Thứ nhất, đồ họa có chữ sắc ở kích thước nhỏ, như nhãn, huy hiệu hay biểu tượng cỡ favicon, có thể lộ lỗi trong AVIF mà ở khoảng nhìn thông thường là khó chấp nhận. Thứ hai, tệp nguồn gốc dùng để chỉnh sửa tiếp nên giữ PNG, vì mỗi lần qua một định dạng có mất dữ liệu là chất lượng lại hao thêm. Thứ ba, các môi trường từ chối AVIF, gồm một số trình soạn thảo tài liệu, công cụ thiết kế đời cũ và phần mềm email, cần PNG để tương thích. Cuối cùng, hoạt ảnh quá khung đầu tiên không được giữ, vì cặp này xử lý một khung. Với mọi thứ còn lại, ảnh chụp và đồ họa trong suốt gửi tới web hiện đại, PNG sang AVIF là lựa chọn đúng.
Core Web Vitals và lập luận băng thông
Largest Contentful Paint, chỉ số tải chính, chịu ảnh hưởng trực tiếp từ kích thước ảnh lớn nhất trên trang. Giảm ảnh đó từ 116 kilobyte còn 16 kilobyte, như đo trên một ảnh 4K khi phát triển, cắt thời gian truyền trên đường truyền 10 Mbps từ khoảng 93 mili giây xuống khoảng 13 cho riêng phần tử đó. Nhân điều này lên một lưới sản phẩm, một băng chuyền ảnh chính hay một giao diện đầy biểu tượng trong suốt, mức tiết kiệm cộng dồn đẩy LCP xuống thấp hơn hẳn ngưỡng 2.5 giây mà Google coi là tốt. AVIF được áp dụng nhanh chính vì lập luận có thể đưa ra bằng con số cứng. Ở mức phủ khoảng 94.3 phần trăm trình duyệt, trường hợp lùi về đủ nhỏ để cái lợi băng thông vượt phần đánh dấu picture thêm vào.
Khác biệt so với một công cụ chuyển đổi trực tuyến thông thường
Hầu hết công cụ chuyển AVIF trực tuyến tải PNG của bạn lên các máy bạn không kiểm soát, xử lý tại đó, và giữ nó theo chính sách lưu giữ do nhà cung cấp đó đặt ra, thường mơ hồ. RoundCut thẳng thắn về quy trình của mình. Vì AVIF nặng, việc chuyển đổi chạy trên máy chủ của chúng tôi để có kết quả tốt nhất, với một bộ mã hóa trong trình duyệt làm phương án dự phòng tự động khi máy chủ không khả dụng. Khi tệp của bạn được gửi tới chúng tôi, nó được chuyển đổi rồi gỡ đi trong khoảng 2 giờ, không lưu trữ hay chia sẻ. Không có lưu trữ vĩnh viễn và không chia sẻ ảnh của bạn. Với những người làm việc với tài liệu khách hàng, ảnh sản phẩm riêng hoặc nội dung người dùng, phiên bản trung thực của giao dịch là thế này: tệp có thể đi qua máy chủ của chúng tôi, được xử lý chỉ để tạo AVIF cho bạn, và không ở lại đó.