Base64 Resim Başlıkları ve Altbilgileri ile Dosya Boyutunu Azaltın
Büyük çok sayfalı bir PDF üzerinde bir başlığa veya alt bilgiye Base64 resmi eklemek, çıktı dosyasını büyük ölçüde artırabilir. Çözüm, sayfa başına metinlerin {page} gibi normal şekilde render edilmesine izin verirken resmi her sayfada bir kez gömmektir.
Şişkinlik, render işleyicisinin birleştirilmiş parçayı nasıl yönettiğinden ötürü meydana gelir. Tek bir parça hem resmi hem de {page} gibi dinamik içeriği tuttuğunda, motor tüm HTML'i dinamik olarak değerlendirir ve Base64 resmi her sayfada yeniden ekler. İşi iki geçişe ayırmak resmi statik tutar ve sayfa numarası katmanını küçük tutar.
Çözüm
1. Başlığı veya Alt Bilgiyi İki Parçaya Ayırın
İçeriği statik bir parça ve dinamik bir parça olarak ayırın. Resmi ve asla değişmeyen metni statik parçaya yerleştirin. {page} gibi sayfa başına içeriği dinamik parçaya koyun. Dinamik metnin statik katmanın üzerine doğru şekilde oturması için her iki parçaya da aynı tablo düzenini ve hücre genişliklerini verin.
2. Önce Statik Parçayı Ekleyin
AddHtmlHeadersAndFooters sadece statik parça ile çağırın. Base64 resmi render edilir ve tek seferde gömülür.
3. İkinci Geçişte Dinamik Parçayı Ekleyin
AddHtmlHeadersAndFooters tekrar sadece dinamik parça ile çağırın. Bu geçiş resim taşımadığı için sayfa başına içerik küçük kalır.
using IronPdf;
var pdf = PdfDocument.FromFile("input.pdf");
// Static layer: holds the Base64 image. The page-number cell is left empty.
string staticFooter = @"
<table style='width:100%; table-layout:fixed;'>
<tr>
<td style='width:20%;'>
<img src='data:image/png;base64,iVBORw0KGg...' style='width:150px;' />
</td>
<td style='width:80%; text-align:right;'></td>
</tr>
</table>";
// Dynamic layer: holds only {page}. Same layout, but no image.
string dynamicFooter = $@"
<table style='width:100%; table-layout:fixed;'>
<tr>
<td style='width:20%;'></td>
<td style='width:80%; text-align:right; font-size:10px;'>Page {{page}} of {pdf.PageCount}</td>
</tr>
</table>";
// Pass 1: add the static image footer (image embedded once).
pdf.AddHtmlHeadersAndFooters(new ChromePdfRenderOptions
{
HtmlFooter = new HtmlHeaderFooter { HtmlFragment = staticFooter, MaxHeight = 40 }
});
// Pass 2: add the dynamic page-number footer (no image, stays small).
pdf.AddHtmlHeadersAndFooters(new ChromePdfRenderOptions
{
HtmlFooter = new HtmlHeaderFooter { HtmlFragment = dynamicFooter, MaxHeight = 40 }
});
pdf.SaveAs("output.pdf");İki table-layout:fixed parçası aynı hücre genişliklerini paylaştığı için ikinci geçişteki sayfa numarası, ilk geçişteki boş hücrenin tam olduğu yere oturur. Aynı teknik başlıklar için de geçerlidir: resmi statik geçişte tutun ve herhangi bir dinamik başlık metnini ikinci geçişte yerleştirin.
Seçenek: Harici Bir Görüntü veya SVG'ye Referans Verin
Resmin Base64 olarak gömülmesine gerek yoksa, <img> harici bir dosyaya yönlendirme yapmak veya bir SVG kullanmak, Base64 stringden daha fazla çıktıyı küçültebilir.
Curtis Chau holds a Bachelor’s degree in Computer Science (Carleton University) and specializes in front-end development with expertise in Node.js, TypeScript, JavaScript, and React. Passionate about crafting intuitive and aesthetically pleasing user interfaces, Curtis enjoys working with modern frameworks and creating well-structured, visually appealing manuals.
