Görselden Base64'e Çevirici
Görseli data URI'ye çevir, CSS ve HTML kodunu hazır al.
Görseli buraya bırak veya
Hiçbir dosya yüklenmez — her şey tarayıcınızda kalır.
Tamamen tarayıcınızda çalışır. Girdiğiniz hiçbir veri sunucuya gönderilmez, kaydedilmez veya saklanmaz.
Nasıl kullanılır
- Bir görsel dosyası seç.
- Çıktı biçimini seç: data URI, CSS, HTML veya düz Base64.
- Kodu doğrudan projene kopyala.
Ne yapar?
Görselini okuyup Base64 data URI'si üretir; yanında hazır CSS ve HTML kodu verir. Araç ayrıca kodlanmış sürümün ne kadar büyüdüğünü bildirir — satır içine gömmenin iyi bir fikir olup olmadığına karar veren sayı budur.
Gömmek gerçekten ne zaman işe yarar?
Base64 veriyi yaklaşık %33 büyütür; yani ancak bir HTTP isteğinden kurtulmanın maliyeti fazladan baytlardan yüksek olduğunda kazanç sağlar. Bu, çok küçük varlıklar için doğrudur: 1×1 izleme pikseli, küçük bir SVG ikon, e-postaya uygun bir logo. Fotoğraflar için yanlıştır; ağırlığın üçte birini eklersiniz, işlemeyi bloke edersiniz ve görseli ayrı önbelleğe alma imkânını kaybedersiniz.
Sık sorulan sorular
- Görsellerim bir sunucuya yükleniyor mu?
- Hayır. Buradaki her araç dosyanı tarayıcının kendi Canvas API'leriyle çözümleyip yeniden kodlar. Görsel cihazından hiç çıkmaz; bu yüzden sayfa bir kez yüklendikten sonra çevrimdışı bile çalışır.
- Base64 sürümü dosyamdan neden büyük?
- Base64 üç baytı dört ASCII karaktere kodlar, dolayısıyla çıktı tasarım gereği yaklaşık %33 daha büyüktür. Bu, aracın kusuru değil kodlamanın doğasıdır.
- Performans için görselleri Base64 olarak gömmeli miyim?
- Yalnızca çok küçük olanları. Gömülü görseller ayrı önbelleğe alınamaz, işlemeyi bloke eden HTML veya CSS'i şişirir ve üçte bir fazla bayt maliyeti getirir. Birkaç kilobaytın altında kazanç olabilir; ötesinde genelde kayıptır.