Choosing the Right Rich Text Editor: Why Superthread Switched to TipTap

The Heart of Superthread: Building a Reliable Editor

A project management tool is only as good as its editor. At Superthread, we don't just treat the editor as a text box; it is the core interface for our pages, cards, comments, and checklists.

When we set out to build Superthread, we wanted an editor that was simple, lightning-fast, and robust enough for ordinary users without the overwhelming complexity of tools like Notion. Here is the story of how we navigated the landscape of rich text libraries and why we eventually landed on TipTap.

The Comparison: TipTap vs. Lexical vs. Quill

Early in our journey, we narrowed our search to three major players. Each had distinct strengths, but our specific needs, particularly our use of Vue.js, sharpened our focus.

Lessons Learned from Our First Mistakes

In our initial prototype, we treated the editor as an afterthought. We used an ad-hoc implementation of Quill for comments and tried to hack it together.

The result? A system that felt unpolished and suffered from duplication bugs in collaborative mode. We quickly realized that if we wanted a 'rock-solid' experience, we had to start over and do it properly. We needed full control over the collaboration layer, which led us back to TipTap paired with Yjs.

Custom Features We Built

While TipTap provided the foundation, we built several custom extensions to ensure the Superthread experience felt polished:

• The Slash Command: Type / to instantly access formatting options and blocks.

• The Assistant: A direct integration with ChatGPT-4 that allows you to highlight text and rewrite, summarize, or generate content on the fly.

• Smart Mentions: Typing @ brings up a unified search for members, cards, boards, and pages, keeping everything interconnected.

• Internal Link Beautification: When you paste a link to another Superthread resource, it automatically transforms into a 'beautified' link that is easy to read and navigate.

• The Bubble Menu: Instead of a cluttered top toolbar, formatting options appear right where your cursor is when you highlight text.

Why TipTap Won

Ultimately, TipTap won because it offered the best balance between ease of use and developer control. It abstracts the complexity of ProseMirror while giving us a modular system where we only include the extensions we need.

For any developer building a Vue-based application that requires real-time collaboration, I can’t recommend TipTap enough. It helped us move from a buggy, hacky prototype to a stable, single-editor architecture used across our entire platform.

Experience the fastest editor in project management.

Write docs and manage tasks in one unified, high-performance workspace. Sign up for Superthread for free

Further Reading & Resources

• The Anti-Bloat Philosophy: Why we prioritize speed over features.

• Superthread vs. Jira: How a modern editor changes the way you work.