jsPDF чудовий для легких браузерних експортів
jsPDF популярний, бо розв’язує реальну продуктову задачу: створити PDF у браузері без запуску серверного сервісу. Розробник може намалювати текст, лінії, зображення і прості таблиці, а потім запустити завантаження з тієї самої сторінки. Для прототипів, невеликих адмінок, локальних квитанцій і офлайн PWA це сильна відповідність.
Продуктове питання в тому, де ця браузерна межа перестає бути правильною. Коли PDF стає бізнес-документом, який клієнт сканує, архівує, надсилає електронною поштою або передає в іншу систему, робота вже не зводиться до “намалювати файл”. Це керування шрифтами, точність штрихкодів, стабільність на мобільних пристроях, детермінований вивід і іноді пакування PDF/A або електронного рахунку.
Той самий PDF, інша межа продукту
З jsPDF ваш вебзастосунок стає рендерером. Кожна вкладка браузера має тримати бібліотеку, будь-які власні шрифти, проміжні зображення, результат генерації штрихкодів і фінальні PDF-байти. Це лишає рахунок за бібліотеку нульовим, але переносить бойову відповідальність на кожен пристрій користувача.
З gPdf браузер або серверна частина надсилає структурований DocumentRequest або запит template_id + data. gPdf володіє середовищем рендера, вбудованими шрифтами, геометрією штрихкодів і бінарною генерацією PDF на edge. Застосунок відповідає за дані й логіку шаблонів, а не за PDF-рушій.
Відповідність продукту: офлайн-експорт проти операційних документів
Обирайте jsPDF, коли PDF — локальна зручна функція: невелика кнопка експорту, проста квитанція лише з латиницею, знімок панелі або PWA, що має працювати без мережі.
Обирайте gPdf, коли PDF є частиною операційного процесу: транспортні етикетки, складські ярлики, рахунки, квитки, виписки, митні форми й транскордонні квитанції. Таким документам потрібен однаковий вивід на всіх пристроях, а не те, що поточна вкладка браузера змогла безпечно зібрати.
Модель вартості: безкоштовна бібліотека проти відповідальності за експлуатацію
Бібліотека jsPDF має очевидну цінову перевагу: сама бібліотека з відкритим кодом, а CPU браузера не є рядком у вашому хмарному рахунку. Для невеликої внутрішньої функції це може бути найдешевший шлях.
Вартість бойової експлуатації з’являється в роботі навколо бібліотеки:
- CJK-сумісні файли шрифтів або згенеровані base64-модулі шрифтів.
- Бібліотеки кодування й конвертації штрихкодів.
- Помилки пам’яті та завантаження, специфічні для браузерів.
- Перевірка друку для сканерів і термопринтерів.
- Регресійні тести в десктопних браузерах, iOS Safari, Android WebView і вбудованих браузерах.
gPdf перетворює це на рахунок за використання. Публічний Basic plan починається з 5 USD/міс. за 100 000 сторінок, зі стандартним перевищенням ліміту від 0,00005 USD за сторінку. Це витрата на постачальника, але вона прибирає потребу змушувати кожен пакет вебзастосунку і кожен пристрій користувача поводитися як бойовий PDF-сервіс.
Вартість CJK — це не лише розмір файла
Перша жорстка межа — CJK-текст: китайська, японська й корейська.
Вбудовані стандартні PDF-шрифти jsPDF корисні для простого виводу латиниці, але не покривають кожен Unicode-гліф. Коли документ містить CJK-текст, застосунку потрібен шрифт, у якому ці гліфи справді є. На практиці браузерні реалізації часто пакують TTF-файл, конвертують його в base64-модуль JavaScript або завантажують дані шрифту перед генерацією PDF.
Ця вартість сплачується двічі: спершу як більше навантаження вебзастосунку, потім знову як пам’ять браузера під час генерації PDF. На мобільному пристрої та сама вкладка може одночасно тримати вебзастосунок, шрифт, буфери штрихкодів, зображення і фінальні PDF-байти.
gPdf тримає цю роботу на боці сервісу. Браузер надсилає структурований JSON; рендерер вибирає з вбудованих шрифтів для латиниці, грецької, кирилиці, CJK, арабської, деванагарі, бенгальської, тайської та моноширинного тексту. Дані замовлення на 2 КБ не мають перетворюватися на шлях доставки шрифтів у 12 МБ.
Вартість штрихкодів: закодувати легко, надійно надрукувати складніше
У логістиці, електронній комерції, виробництві, охороні здоров’я, квиткових сервісах і роздрібній торгівлі штрихкод може бути важливішим за видимий текст. Людина читає номер замовлення; операційний процес читає Code 128, GS1-128, QR, DataMatrix або PDF417.
З jsPDF генерація штрихкодів зазвичай є окремим продуктовим рішенням. Команди поєднують jsPDF з іншим енкодером, рендерять штрихкод у SVG, canvas або зображення, а потім вставляють результат у PDF. Це працює для купонного QR-коду або прототипу.
Стає крихким, коли надрукований штрихкод критичний для операцій:
- Canvas-штрихкод може бути растеризований із неправильною роздільною здатністю.
- Масштабоване зображення може розмити штрихи, модулі або тихі зони.
- Браузер, CSS-трансформація або шлях експорту можуть змінити фінальний фізичний розмір.
- Різні формати штрихкодів можуть потребувати різних бібліотек або шляхів конвертації.
- Термопринтери на 203 DPI швидко показують дрібні помилки розміру.
gPdf трактує штрихкоди як елементи документа. Запит задає type: "barcode", format, дані штрихкоду і фізичний розмір у міліметрах. Рендерер записує векторну геометрію штрихкоду всередині PDF для підтримуваних 1D- і 2D-форматів, тому текст, фігури, таблиці, зображення й штрихкоди лишаються в одній системі координат.
Studio та ітерації шаблонів
jsPDF починається з коду. Зміна макета зазвичай означає редагування команд малювання, позицій, реєстрації шрифтів, конвертації зображень і розміщення штрихкодів у JavaScript.
gPdf підтримує той самий процес від API, але додає gPdf Studio як безкоштовний візуальний дизайнер PDF-макета. Команди можуть додавати й перетягувати текст, зображення, таблиці, фігури, колонтитули та штрихкоди, а потім під’єднати дизайн до генерації через template_id + data. Це важливо, коли формат транспортної етикетки, рахунку або квитанції часто змінюється, а до макета мають долучатися не лише PDF-спеціалісти.
Мобільні браузери — погане місце для важкої PDF-роботи
Клієнтська генерація PDF здається дешевою, бо серверний рахунок дорівнює нулю. Вартість переходить на пристрій користувача.
На десктопі це може бути нормально. У мобільних браузерах бойовий документ може сильно навантажити вкладку: CJK-дані шрифту, base64-зображення, canvas-буфери, зображення штрихкодів, згенеровані PDF-байти й активний застосунок одночасно змагаються за пам’ять. iOS Safari і Android-пристрої з малим обсягом пам’яті менш поблажливі, ніж ноутбук розробника.
Перенесення генерації в gPdf змінює форму проблеми. Браузер збирає невеликий JSON-запит, чекає бінарну відповідь і завантажує готовий PDF. Вкладка користувача більше не має бути менеджером шрифтів, рендерером штрихкодів, рушієм макета і бінарним компонентом запису PDF.
Коли jsPDF усе ще правильний вибір
Є сильні причини лишитися з jsPDF.
Якщо користувач має експортувати офлайн, jsPDF підходить краще. Якщо дані взагалі не можуть залишати пристрій, браузерна генерація є чистішою межею приватності. Якщо документ малий, лише з латиницею і використовується зрідка, операційна вартість введення API може не виправдати себе. Для прототипів і внутрішніх інструментів jsPDF часто справді найшвидший шлях.
Рішення змінюється, коли вивід стає частиною операційного процесу: транспортна етикетка має скануватися, рахунок має архівуватися, квиток має перевірятися, а транскордонний документ замовлення має коректно рендерити CJK-імена. У цей момент “згенерувати PDF у браузері” менш важливо, ніж “надійно згенерувати той самий бойовий PDF”.
Форма міграції
Міграція — це не “замінити один виклик функції”. Це перехід від імперативного малювання в браузері до структурованого запиту документа.
- // Before: browser-side drawing with jsPDF plus extra font/barcode setup.
- import { jsPDF } from "jspdf";
- import JsBarcode from "jsbarcode";
-
- const doc = new jsPDF({ unit: "mm", format: [100, 150] });
- // Load a CJK-capable TTF and register it before drawing CJK text.
- doc.addFileToVFS("NotoSansCJK-Regular.ttf", base64Font);
- doc.addFont("NotoSansCJK-Regular.ttf", "NotoSansCJK", "normal");
- doc.setFont("NotoSansCJK");
- doc.text("跨境订单 / Cross-border order", 6, 10);
-
- // Generate a barcode separately, then place it into the PDF.
- JsBarcode(canvas, "PDN0003507278", { format: "CODE128" });
- doc.addImage(canvas.toDataURL("image/png"), "PNG", 6, 72, 72, 20);
- doc.save("label.pdf");
+
+ // After: send one structured DocumentRequest to gPdf.
+ const res = await fetch("https://api.gpdf.com/api/v1/pdf/render", {
+ method: "POST",
+ headers: {
+ Authorization: `Bearer ${KEY}`,
+ "Content-Type": "application/json"
+ },
+ body: JSON.stringify({
+ settings: {
+ defaults: {
+ text: {
+ font_family: "NotoSans-Regular",
+ font_mode: "prefer",
+ font_size: 9,
+ color: "#111827"
+ }
+ }
+ },
+ pages: [{
+ width: 100,
+ height: 150,
+ elements: [
+ {
+ type: "text",
+ x: 6,
+ y: 8,
+ content: "跨境订单 / Cross-border order",
+ style: { width: 88, font_size: 12, font_weight: "bold" }
+ },
+ {
+ type: "barcode",
+ x: 6,
+ y: 70,
+ width: 72,
+ height: 18,
+ format: "code128",
+ content: "PDN0003507278",
+ barcode_text: { enabled: true, position: "bottom", offset: 1 }
+ },
+ {
+ type: "barcode",
+ x: 80,
+ y: 8,
+ width: 14,
+ height: 14,
+ format: "qrcode",
+ content: "https://track.example/PDN0003507278",
+ barcode_text: { enabled: false, position: "bottom" }
+ }
+ ]
+ }]
+ })
+ });
+ const pdf = await res.arrayBuffer();Важлива зміна — володіння. З jsPDF ваш вебзастосунок володіє шляхом CJK-шрифтів, шляхом генерації штрихкодів, профілем пам’яті браузера і поведінкою експорту. З gPdf застосунок володіє даними й шаблоном; edge-рендерер володіє механікою документа.
Пов’язані сценарії генерації PDF
Команди, які порівнюють jsPDF і gPdf, часто також шукають генерацію CJK PDF, альтернативи браузерній генерації PDF, API для штрихкодів у PDF, безпечну для мобільних генерацію PDF, офлайн-експорт PDF, API JSON у PDF, PDF рахунків, PDF квитків, PDF транспортних етикеток і візуальний дизайн PDF-шаблонів.
FAQ
jsPDF безкоштовний?
Сама бібліотека з відкритим кодом. Вартість бойової експлуатації — це робота навколо: CJK-шрифти, бібліотеки штрихкодів, перевірка в браузерах, перевірка друку і підтримка пристроїв, у яких закінчується пам’ять.
Чи замінює gPdf усі сценарії jsPDF?
Ні. Офлайн-експорт із браузера й документи, які мають лишатися тільки локально, досі є природною територією jsPDF. gPdf — для бойових документів, де контрольований рендерер вартий API-виклику.
Чому вартість штрихкодів згадується окремо?
Бо штрихкод, який добре виглядає на екрані, може не скануватися після масштабування, растеризації або термодруку. Операційним документам потрібна надійність сканування, а не лише видимий візерунок.
Див. також
- Довідник API gPdf - DocumentRequest, елементи штрихкодів, підстановка шрифтів і ендпоінти рендера.
- Векторні та растрові штрихкоди в PDF - чому геометрія штрихкоду важлива після друку.
- GS1-128 з точністю 0,1 мм у JSON - деталі розміру для етикеток.
- PDF/A і Factur-X для інженерів - коли архівні вимоги та вимоги електронного рахунку входять у PDF-процес.