[트리] 에디터 입력시 지연 문제

[woogieReal]

AS-IS

글이 약 400줄 이상 길어지면 입력시 버벅임이 발생

TO-BE

글이 1000줄 이상 길어져도 입력시 버벅임이 발생하지 않는다.

[woogieReal]

uiwjs/react-md-editor Input lag for large text body (>2000 lines) #230
라이브러리 내부적으로는 해결 안된 듯

[woogieReal]

처음에는 텍스트가 길어지면 마크다운 파싱에 시간이 걸려 오래 걸리는게 아닐까 했는데
위 이슈의 내용과 직접 파싱을 제거하고 실행해보니 여전히 입력 지연이 발생하는 것을 확인
에디터 변경도 고려해봐야 할 듯

[woogieReal]

@HAN-SEOHYUN
혹시 불편이 크면 에디터를 교체할까 생각 중인데 어떠신가요?

[HAN-SEOHYUN]

글이 길어지면 입력 시 버벅임이 발생 << 에디터 내 문제라서 해결이 불가하다면 교체하는 것에 동의합니다 🙆‍♂️
혹시 생각해두신 에디터 후보 있으실까요 ? 저도 한번 찾아보겠습니다👀

[woogieReal]

npm @toast-ui/react-editor
일단은 토스트 UI의 에디터가 무난해 보이네요

다만 기존 에디터가 깔끔한 맛이 있었어서 아쉽네요 ㅎㅎ
저도 조금 더 찾아볼게요

[HAN-SEOHYUN]

네 ! 현재는 TOAST UI 가 가장 강력한 것 같습니다💪

simplemde

그 다음으로는 simpleMDE 에디터가 좋아보입니다.

milkdown

milkdown은 디자인이 잘 나온 것 같습니다. 조금 현란한가요 ?

기존에 사용하던건 npm i @uiw/react-md-editor 이 맞을까요 ? 깔끔한 에디터 디자인이 많이 아쉽긴합니다 🥲

[woogieReal]

넵 기존에 사용하던거 그거 맞아요!

simplemde 에디터 리액트 버전은 이거네요.
npm react-simplemde-editor
react-simplemde-editor app

[woogieReal]

예전에 잠깐 적용했던게 이거고
npm marked-react

비슷한게 이것도 있는데
npm markdown-to-jsx

에디터라기 보다는 뷰어 역할만 한다고 보면 될 것 같아요 ㅋㅋ

[woogieReal]

Know The Best React Markdown Editor Components for Your App

[woogieReal]

시안이 올려준 simplemde 에디터가 가장 좋아보입니다 👍
반반 모드일 때 전체화면 되는 것만 제어가능하면 충분히 현재 사용하는 거 대체가 가능할 것 같아요 :)

[woogieReal]

마이크로소프트 vscode 스타일 에디터

• npm monaco-editor
• Monaco - The Editor of the Web

[woogieReal]

@monaco-editor/react

[woogieReal]

아래 이슈 함께 개발

• [트리] 자동 저장 기능 추가
• [트리] 트리 내용 수정 시 노티