perf: optimizations for composer with Tiptap (#6315)

* chore: update tiptap packages

* perf: reduce number of re-renders

* refactor: apply min height without a layout effect

* Remove stale zeed-dom resolution

---------

Co-authored-by: Dan Abramov <dan.abramov@gmail.com>
This commit is contained in:
Nick Perez
2024-11-23 22:07:37 +01:00
committed by GitHub
parent 0395ba3e79
commit fdc3f0f17d
3 changed files with 163 additions and 112 deletions
@@ -225,6 +225,7 @@ export const TextInput = React.forwardRef(function TextInputImpl(
autofocus: 'end',
editable: true,
injectCSS: true,
shouldRerenderOnTransaction: false,
onCreate({editor: editorProp}) {
// HACK
// the 'enter' animation sometimes causes autofocus to fail
@@ -317,15 +318,9 @@ export const TextInput = React.forwardRef(function TextInputImpl(
style.lineHeight = style.lineHeight
? ((style.lineHeight + 'px') as unknown as number)
: undefined
style.minHeight = webForceMinHeight ? 140 : undefined
return style
}, [t, fonts])
React.useLayoutEffect(() => {
let node = editor?.view.dom
if (node) {
node.style.minHeight = webForceMinHeight ? '140px' : ''
}
}, [editor, webForceMinHeight])
}, [t, fonts, webForceMinHeight])
return (
<>