Was jasy anders macht.

01

Passwortschutz

Setzen Sie ein Passwort, und beide verschlüsseln die Datei. Der Unterschied ist, was Sie bekommen, ohne noch etwas einzustellen.

react-pdf 4.9.0

Standardmäßig 40-Bit-RC4 (/V 1, /R 2) in einer Datei nach PDF 1.3. AES-256 gibt es mit pdfVersion: "1.7ext3" - in Revision 5, der Vorab-Fassung von Adobe, die ISO 32000-2 als veraltet führt.

jasy

Immer AES-256 in Revision 6 (/V 5, /R 6), der aktuelle Handler nach ISO 32000-2 - ohne Option, die man kennen muss, und nichts Schwächeres.

PDFKit, auf dem react-pdf aufbaut, macht standardmäßig dasselbe (0.20.2).

// react-pdf 4.9.0
<Document userPassword="secret">...</Document>
// %PDF-1.3 ... /Encrypt << /V 1 /R 2 >>        40-bit RC4
<Document userPassword="secret" pdfVersion="1.7ext3">...</Document>
// %PDF-1.7 ... /Encrypt << /V 5 /R 5 >> /AESV3  AES-256, revision 5

// jasy
await renderToBytes(doc, { encrypt: { userPassword: "secret" } });
// %PDF-2.0 ... /Encrypt << /V 5 /R 6 >> /AESV3  AES-256

02

Barrierefreie, getaggte PDFs

Ein Screenreader braucht einen Structure Tree: was eine Überschrift ist, was ein Absatz, was Dekoration.

react-pdf 4.9.0

react-pdf hat für einen Structure Tree keine Option. Die PDF/UA-1-Prüfung von veraPDF meldet 4 verletzte Regeln, darunter fehlender StructTreeRoot und MarkInfo.

jasy

accessible: true schreibt eine getaggte PDF/UA-1-Datei. veraPDF: 0 verletzte Regeln.

// react-pdf 4.9.0 - title and language, but no structure tree
<Document title="Quarterly report" language="en-US">...</Document>
// verapdf -f ua1: not compliant, 4 failed rules

// jasy
Text("Quarterly report", { role: "h1" });
await renderToBytes(doc, { accessible: true, title: "Quarterly report", lang: "en-US" });
// verapdf -f ua1: compliant, 0 failed rules

03

SVG mit Styles, wie Illustrator es exportiert

Der Standard-SVG-Export von Illustrator legt die Farben als CSS-Klassen in einen style-Block.

react-pdf 4.9.0

Die CSS-Klassen werden nicht angewendet, die Formen bleiben unsichtbar - ohne Meldung.

jasy

Beide Formen, in ihren Farben, als Vektoren.

(nichts gezeichnet)

<!-- styled.svg, as Illustrator's "Internal CSS" export writes it -->
<svg viewBox="0 0 120 60"><defs><style>.cls-1{fill:#e2483d}.cls-2{fill:#1450aa}</style></defs>
  <rect class="cls-1" width="55" height="60"/><circle class="cls-2" cx="90" cy="30" r="28"/></svg>

// react-pdf 4.9.0
<Image src="styled.svg" style={{ width: 120 }} />

// jasy
Image("styled.svg", { width: 120 });

04

Deutsche Silbentrennung

In einer schmalen Spalte müssen lange deutsche Wörter getrennt werden. react-pdf bringt englische Trennmuster mit und wendet sie auf jede Sprache an.

react-pdf 4.9.0

react-pdf

jasy

jasy mit deutschen Mustern

jasy trennt erst, wenn Sie die Sprache nennen - eine Zeile mit jeder Bibliothek für Trennmuster, hier hyphen/de. Das letzte Wort steht auf jeder deutschen Rechnung.

// react-pdf 4.9.0: a narrow column, nothing configured
<View style={{ width: 100 }}><Text>Umsatzsteueridentifikationsnummer</Text></View>

// jasy, with German patterns
import { hyphenateSync } from "hyphen/de";
const hyphenate = (word: string) => hyphenateSync(word).split("\u00AD");
Box({ width: 100 }, [Text("Umsatzsteueridentifikationsnummer", { hyphenate })]);

05

Ein Absatz, der nicht auf die Seite passt

Große Schrift auf einer kleinen Seite - ein Etikett, ein Ticket - kann einen Absatz ergeben, der auf keine Seite passt.

react-pdf 4.9.0

Für diesen Fall gibt es keine Abbruchbedingung: Der Prozess läuft weiter, bis der Speicher voll ist.

jasy

Nach Millisekunden ein benannter Fehler, der sagt, was zu ändern ist - oder, mit onOverflow: "warn", ein abgeschnittenes Rendering und eine Warnung.

// react-pdf 4.9.0: two lines of 34pt text, 50pt of room
<Page size={[420, 90]} style={{ padding: 20 }}>
  <Text style={{ fontSize: 34 }}>Typography, jumping quickly</Text>
</Page>
// FATAL ERROR: ... JavaScript heap out of memory

// jasy: the same page
// Layout overflow: Text is 79pt tall but the page region is only 50pt and it cannot be
// broken - reduce its size, give it a bounded height, or let it split across pages.