Редакторы текста в Вебе

Ниже краткий путеводитель по редакторам текста для Веба. Мы пройдёмся по базовым технологиям, подходам и свободным библиотекам.

Задачи: какие мы редакторы мы рассматриваем?

Мы будем исходить из задачи создания редактора текста общего назначения — для редактирования публикаций в CMS, чат-клиенте, написания комментариев в социальной сети и так далее. Нам нужно разнообразное форматирование: — общепринятые выделения курсивом и полужирным, заголовки и так далее. Также нам нужны добавление изображений, видео, кода и прочих произвольных виджетов.

Общие принципы

Рассмотренные здесь редакторы воплощают несколько общих базовых подходов, на которых сошлись как на оптимальных:

Conteditable как база

Иммутабельные структуры данных

Текствовые координаты

Lexical

Quill

ProseMirror

Редакторы на основе ProseMirror

TipTap

ProseBlock

CKEditor

Overtype

Достоин отдельного упоминания Overtype — простой редактор для Markdown, который использует интересный трюк чтобы избежать всех сложностей описанных выше.