@tiptap/core vs. prosemirror-state

Tiptap Core is a headless, framework-agnostic rich text editor built on top of ProseMirror. Its primary audience includes developers looking for a highly customizable and extensible editor solution that abstracts away the DOM manipulation and provides a declarative API for managing editor state and behavior. It empowers developers to build rich text editing experiences tailored to specific application needs without being tied to a particular frontend framework, though it offers integrations for popular ones.

ProseMirror State, on the other hand, is a foundational piece of the ProseMirror toolkit, specifically focusing on the management of editor state. Its core philosophy centers around providing a robust, functional mechanism for representing and transforming document content through a schema. Its primary audience consists of developers building custom editing experiences or richer applications that require fine-grained control over document structure and transformation logic, often as a dependency for more complex editor implementations.

A key architectural difference lies in their scope and abstraction. Tiptap Core acts as a comprehensive editor framework, managing the entire editing lifecycle from user input to rendering, and exposing a rich API for plugins and extensions. ProseMirror State is a more focused library, concentrating exclusively on the state management aspect of an editor, treating the document as a structured data representation that can be manipulated via transactions. It doesn't concern itself with the DOM or user interface directly.

Regarding their implementation details, Tiptap Core provides a higher-level abstraction, offering a declarative way to define editor features and behaviors through its extension system. This system allows for easy composition of functionalities like collaboration, history, and specific node/mark types. ProseMirror State, being a lower-level component, operates directly with ProseMirror's schema and transaction system, requiring a deeper understanding of its internal data structures and operational transformations for advanced use cases.

The developer experience contrast is significant. Tiptap Core aims for a more approachable API, making it easier to get started with rich text editing, especially for those familiar with modern JavaScript frameworks, due to its extension-based approach and clear documentation. ProseMirror State, while powerful, has a steeper learning curve. It requires a solid grasp of functional programming concepts and ProseMirror's specific state management paradigms, which can be challenging for developers new to these ideas.

Performance and bundle size considerations highlight a common trade-off. Tiptap Core, as a full-fledged editor framework encompassing rendering and various features, has a larger footprint. Its bundle size is substantial at 92.5 kB (gzip). ProseMirror State is significantly more lightweight, weighing in at only 19.6 kB (gzip), reflecting its focused responsibility on pure state management without DOM rendering or complex plugin orchestration.

In practice, choose Tiptap Core when you need a complete rich text editor solution with a well-defined API and an extensible plugin system, especially if you want to integrate it seamlessly into applications using React, Vue, or other frameworks. Select ProseMirror State when you are building a highly custom editor from the ground up, need direct control over document structure and transformations, or are using it as a core dependency for a more advanced ProseMirror-based application where bundle size is critical and you are managing the UI layer yourself.

The ecosystem surrounding Tiptap Core is more geared towards practical editor implementations, with various extensions and integrations available. This can streamline development for common editing features. ProseMirror State is part of the larger ProseMirror ecosystem, which, while powerful and robust, might require more custom development to bridge the gap between its state management capabilities and a fully featured user interface, potentially leading to more intricate integration efforts.

Edge cases and niche use cases often reveal the true nature of a library. Tiptap Core excels in scenarios where a feature-rich, opinionated yet customizable WYSIWYG experience is paramount, such as content management systems or collaborative document editors. ProseMirror State is better suited for highly specialized text-processing applications, complex form builders with rich text fields, or when building custom rendering engines where fine-grained control over document schema and mutation is the absolute priority.