Apakah Saiz Optimum untuk Imej URI Data Telus Minimalis?

URI Data Minimalis untuk Imej Telus

Bayangkan menggunakan imej lutsinar 1x1 bersama imej latar belakang dalam CSS. Ini membolehkan penggunaan sprite sambil masih menyediakan teks alternatif untuk ikon tertentu.

Untuk mengoptimumkan prestasi, pertimbangkan untuk menggunakan URI data untuk imej. Walau bagaimanapun, apakah saiz optimum untuk mencipta imej lutsinar menggunakan pendekatan ini?

Respons Ringkas

Melalui percubaan meluas dengan GIF lutsinar, imej tertentu menunjukkan ketidakstabilan dan menyebabkan gangguan dalam CSS. Sebagai contoh, percubaan untuk menambah imej latar belakang pada GIF lutsinar menggunakan dimensi terkecil mungkin boleh menghalang kefungsiannya. Anehnya, GIF tertentu, seperti yang di bawah, boleh menyekat latar belakang CSS dalam sesetengah penyemak imbas.

Lebih pendek tetapi Tidak Stabil (74 bait)

data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==

Stabil tetapi Lebih Panjang Sedikit (78 bait)

data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7

Tambahan pertimbangan adalah untuk mengelak daripada meninggalkan "imej/gif" sebagai cadangan yang sering dijumpai dalam ulasan. Peninggalan ini boleh menyebabkan kerosakan dalam berbilang penyemak imbas.

Atas ialah kandungan terperinci Apakah Saiz Optimum untuk Imej URI Data Telus Minimalis?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!