PDF 檔案是一種普遍存在的文件共用格式，但它們有時可能會很大，導致載入時間變慢並增加儲存需求。優化 PDF 檔案對於確保無縫的使用者體驗至關重要，尤其是在 Web 應用程式中。因此，在這篇文章中，我們將探討如何使用 JavaScript 優化 PDF 檔案。
用於優化 PDF 的 JavaScript 程式庫
對於 JavaScript 應用程式中的 PDF 最佳化，我們將使用 Aspose.PDF for JavaScript。它是一個功能強大的程式庫，允許開發人員使用 JavaScript 處理、操作和優化 PDF 文件。因此，讓我們先安裝該庫。
下載 該程式庫並按照此處提供的安裝說明進行操作：如何安裝 Aspose.PDF for JavaScript。
在 JavaScript 中優化 PDF
在深入研究 PDF 優化過程之前，讓我們先了解為什麼優化 PDF 文件至關重要：
- 更快的載入時間：優化的 PDF 載入速度更快，透過減少等待時間來增強使用者體驗。
- 頻寬效率：較小的檔案大小可減少頻寬消耗，從而更輕鬆地共享和下載 PDF。
- 儲存空間：最佳化後的PDF佔用較少的儲存空間，這在處理大量文件時尤其重要。
現在讓我們按照以下步驟編寫腳本來優化 PDF 檔案。
- 首先，選擇需要最佳化的PDF檔案。
- 然後，建立一個 FileReader 物件來讀取檔案。
- 之後，呼叫AsposePdfOptimize函數來最佳化PDF。此函數的參數包括產生的 PDF 檔案的名稱。
- AsposePdfOptimize函數傳回一個JSON對象，使用json.errorCode，您可以檢查PDF檔案是否優化成功。如果錯誤代碼為 0，則 PDF 已最佳化，沒有任何問題。否則，會發生錯誤，您可以從 json.errorText 中讀取該錯誤。
- 最後，呼叫DownloadFile函數產生最佳化後的PDF檔案的連結。
以下程式碼片段展示如何在 JavaScript 中優化 PDF 檔案。
var ffileOptimize = function (e) {
const file_reader = new FileReader();
file_reader.onload = (event) => {
/*optimize a PDF-file and save the "ResultOptimize.pdf"*/
const json = AsposePdfOptimize(event.target.result, e.target.files[0].name, "ResultOptimize.pdf");
if (json.errorCode == 0) document.getElementById('output').textContent = json.fileNameResult;
else document.getElementById('output').textContent = json.errorText;
/*make a link to download the result file*/
DownloadFile(json.fileNameResult, "application/pdf");
};
file_reader.readAsArrayBuffer(e.target.files[0]);
};
在 PDF 最佳化中使用 Web Worker
在上一節中，我們只是加載了一個 PDF，對其進行了優化，然後下載了生成的 PDF。現在，讓我們使用 Web Worker 來使最佳化過程更加順暢並防止 UI 執行緒被阻塞。以下腳本展示如何編寫一個使用我們在上一節中編寫的 PDF 最佳化功能的 Web Worker。
/*Create Web Worker*/
const AsposePDFWebWorker = new Worker("AsposePDFforJS.js");
AsposePDFWebWorker.onerror = evt => console.log(`Error from Web Worker: ${evt.message}`);
AsposePDFWebWorker.onmessage = evt => document.getElementById('output').textContent =
(evt.data == 'ready') ? 'loaded!' :
(evt.data.json.errorCode == 0) ?
`Result:\n${DownloadFile(evt.data.json.fileNameResult, "application/pdf", evt.data.params[0])}` :
`Error: ${evt.data.json.errorText}`;
/*Event handler*/
const ffileOptimize = e => {
const file_reader = new FileReader();
file_reader.onload = event => {
/*Optimize a PDF-file and save the "ResultOptimize.pdf" - Ask Web Worker*/
AsposePDFWebWorker.postMessage(
{ "operation": 'AsposePdfOptimize', "params": [event.target.result, e.target.files[0].name, "ResultOptimize.pdf"] },
[event.target.result]
);
};
file_reader.readAsArrayBuffer(e.target.files[0]);
};
/*Make a link to download the result file*/
const DownloadFile = (filename, mime, content) => {
mime = mime || "application/octet-stream";
var link = document.createElement("a");
link.href = URL.createObjectURL(new Blob([content], {type: mime}));
link.download = filename;
link.innerHTML = "Click here to download the file " + filename;
document.body.appendChild(link);
document.body.appendChild(document.createElement("br"));
return filename;
}
在 JavaScript 中優化 PDF 資源
優化 PDF 檔案的另一種方法是刪除未使用的資源並將公共資源連接到單一物件中。為了最佳化PDF資源，Aspose.PDF提供了AsposePdfOptimizeResource函式。以下程式碼片段示範如何在 JavaScript 中優化 PDF 資源。
var ffilePdfOptimizeResource = function (e) {
const file_reader = new FileReader();
file_reader.onload = (event) => {
/*Optimize resources a PDF-file and save the "ResultPdfOptimizeResource.pdf"*/
const json = AsposePdfOptimizeResource(event.target.result, e.target.files[0].name, "ResultPdfOptimizeResource.pdf");
if (json.errorCode == 0) document.getElementById('output').textContent = json.fileNameResult;
else document.getElementById('output').textContent = json.errorText;
/*Make a link to download the result file*/
DownloadFile(json.fileNameResult, "application/pdf");
};
file_reader.readAsArrayBuffer(e.target.files[0]);
};
取得免費的 JavaScript PDF 函式庫
取得免費的臨時許可證 並不受任何限制地使用我們的 JavaScript PDF 最佳化程式庫。
結論
優化 PDF 檔案對於確保 Web 應用程式的最佳效能和使用者體驗至關重要。 Aspose.PDF for JavaScript 提供了一套強大的工具來有效優化 PDF 文件。在這篇文章中，我們為您提供了一種使用 JavaScript 優化 PDF 文件的易於實現的方法。透過使用這種 PDF 最佳化方法，您可以顯著改善 Web 應用程式中的整體文件管理。
在 文件 中探索有關我們的 JavaScript PDF 庫的更多資訊。如果您有任何疑問，請透過我們的論壇與我們分享。