Стиль пересчета значительно увеличился после открытия и закрытия диалогового окна в React (мигание краски) ⇐ Javascript

[Anonymous]

У меня очень странное поведение в приложении React/NextJS. У меня есть редактор форматированного текста, созданный с помощью TipTap, и я столкнулся с проблемой пересчета стилей. Ниже приведено видео того, что происходит, а именно:

• Я вставляю в свой редактор огромный текстовый контент — это не оказывает негативного влияния на время рендеринга (см. результаты профилирования)
• затем я открываю диалог с каким-то другим диалогом, и в этом втором диалоге отображается много контента и компонентов. Я просто закрываю это диалоговое окно, и теперь производительность моего редактора значительно снижается из-за огромной задачи «Пересчитать стиль» в результатах профилирования.

https://streamable.com/fmxybg
Кроме того, посмотрите на мигание краски до и после открытия диалогового окна:

• до: ничего больше, несмотря на то, что содержимое редактора мигает
• Кнопки чата и уведомлений в заголовке начинают мигать

Я действительно понятия не имею, почему это так... Я не думаю, что это связано с самим диалогом Radix, потому что те же проблемы возникают, когда я добавляю в редактор еще один математический узел (katex), и даже его немедленное удаление не помогает. Здесь снова кнопки в заголовке начинают мигать, что, я считаю, является причиной падения производительности. Но как это предотвратить? Что здесь происходит?

Подробнее здесь: https://stackoverflow.com/questions/798 ... log-in-rea