Quill Version 2.0 wurde veröffentlicht.
Offizielle TypeScript-Erklärung
Der Quellcode von Quill wurde vollständig auf TypeScript umgestellt, mit den Vorteilen einer frühzeitigen Fehlererkennung, verbesserter Wartbarkeit und besserer Tool-Unterstützung.
Bisher mussten Entwickler @types/quilles als separates Paket installieren, um TypeScript-Definitionen zu erhalten. In Quill 2.0 können Typdeklarationen direkt aus der Quelle abgerufen werden.
mehrere Register
Blog-Projekte können Quill verwenden, um eine voll funktionsfähige Bearbeitungsoberfläche für den Beitrag selbst bereitzustellen, einschließlich Titeln, Bildern und Codeblöcken, während Quill auf derselben Seite auch die Eingabe von Kommentaren in Fett- und Kursivschrift sowie unterstützte Linkformate unterstützt. Neue registryFunktionen in Quill 2.0 unterstützen diesen Anwendungsfall und ermöglichen die Koexistenz mehrerer Editoren mit ihren eigenen Stilkonfigurationen auf derselben Seite ohne Konflikte.
Automatische Rollcontainererkennung
In der Vergangenheit mussten Entwickler beim Erstellen einer Quill-Instanz den Scroll-Container des Editors angeben, damit der Cursor oder die Auswahl des Benutzers bei Bedarf in die Ansicht scrollen konnte. Diese Konfiguration wird jedoch häufig übersehen oder verwechselt, und der Rollcontainer ist entweder falsch oder überhaupt nicht angegeben. Darüber hinaus ist es in größeren Apps und Codebasen nicht immer einfach, den richtigen Scroll-Container für wiederverwendbare Editorkomponenten zu finden, die in unterschiedlichen Kontexten vorkommen können. In 2.0 findet Quill automatisch den richtigen Scroll-Container, was die Verwendung von Quill mit Text im längeren Format erleichtert und komplexere Interaktionen wie frei verschachtelte Scroll-Container und horizontales Scrollen unterstützt.
Verwenden von InputEvent
Eine der Hauptstärken von Quill ist sein intern verwaltetes Dokumentenmodell, das nicht auf dem DOM als einziger Wahrheitsquelle basiert. Dies ermöglicht eine Zuordnung von Rich-Text-Zuständen, die näher am mentalen Modell des Entwicklers liegen, und unterstützt eine einfachere Textbearbeitungs-API.
Quill tut dies, indem es auf DOM-Änderungen lauscht und diese wieder auf sein internes Dokumentmodell normalisiert. Allerdings verarbeiten Browser möglicherweise Benutzeraktionen inkonsistent oder falsch, was dazu führt, dass falsche DOM-Änderungen generiert werden. Wenn ein Benutzer beispielsweise roten Text auswählt und ihn durch Eingabe ersetzt, ersetzt der Browser ihn manchmal durch fontein Element, dessen Attribute Rot enthalten style, obwohl der Editor spandas Element zur Darstellung der Farbe verwendet.
Verwenden Sie in Quill 2.0 moderne und gängige Browserfunktionen, um InputEvents auszulösen . Nun werden zunächst die Aktionen des Benutzers erfasst, um das interne Dokumentmodell zu aktualisieren, bevor die daraus resultierenden Änderungen mit dem DOM synchronisiert werden. Dieser Ansatz bietet ein konsistenteres und zuverlässigeres Bearbeitungserlebnis, insbesondere bei komplexen Inhalten und Formaten. Diese Funktion konzentriert sich derzeit auf die problematischsten Quellen von Textersetzungsinteraktionen und ist für die Zukunft in größerem Umfang geplant.
Im Folgenden finden Sie eine Liste der wichtigsten Update-Informationen für 2.0:
Wesentliche Verbesserungen
-
Quill ist jetzt ein gültiges ESM-Paket, um Ökosysteme (z. B. Packager) und Tree-Shaking-Funktionen besser zu unterstützen
-
Unterstützt verschachtelte Feder #3590
-
Verbesserte Eingabemethode (IME) und Unterstützung für die Rechtschreibkorrektur #3807
-
Semantische Bereinigung des TEXT_CHANGE-Ereignisses #3778
-
Verlauf: Protokollierung der Auswahl im Verlaufsmodul Nr. 3823
-
Scrollende Container #3840 automatisch erkennen
-
Zwischenablage: Verbesserte Unterstützung für das Einfügen aus Google Docs und Microsoft Word
Leistungsverbesserungen
-
Quill 2.0 umfasst eine Reihe von Leistungsoptimierungen, von denen die wichtigste eine verbesserte Geschwindigkeit beim Rendern großer Mengen an Inhalten ist.
-
Verbessern Sie die Einfügeleistung #3815
-
Vermeiden Sie nach Möglichkeit den Erhalt von Auswahlsätzen #3538
-
Es ist nicht erforderlich, Contents festzulegen, wenn der Container leer ist #3539
Code-Modernisierung
-
Migrieren Sie zu TypeScript
-
Offizielle TypeScript-Deklaration bereitgestellt
-
Migrieren Sie zu Vitest für Unit-Tests
-
Migrieren Sie zu Playwright für End-to-End-Tests
-
Website nach Gatsby migrieren
Weitere Informationen finden Sie in der offiziellen Ankündigung und im Leitfaden zur 2.0-Migration: