[2025‐01‐06] 스프린트 회의록

고려할 점

• 성능 개선
  • 성능 모니터링
  • 성능 최적화
• 사용성 개선
  • 버그 수정
  • 호환성(반응형, 문서 호환)
• 리팩토링 가이드
  1. 구체적인 계획은 수치를 포함한 목표를 갖춰야 합니다. 아래 내용을 참고해서 계획을 수립해보세요.

     • CS 리팩토링인 만큼, CS 지식을 활용해서 프로젝트 문제를 개선해야 합니다.

       • 생각해볼만한 질문들

         우리팀은 어떤 문제를 개선할건가요?

         성능이 개선되었는지 정확한 수치를 계산하기 위해서는 어떤 지식이 필요할까요?

         테스트 도구를 만들기 위해서는 어떤 CS 지식이 필요할까요?

     • 검증하려는 가설이 있으면 좋습니다.

       • 특정 문제를 해결하기 위한 방법과 가정하는 결과를 목표로 세우는 방법입니다.
       • 가설 검증을 위해 필요한 도구는 직접 개발해 볼수도 있습니다.

     • 구체적이고 달성 가능한 숫자를 포함해 완성 조건을 갖춘 목표를 주단위로 세워야 합니다.

       • 예) 성능 5% 개선, 특정 화면 사용성 n명 측정, 응답 속도 10% 개선 등

✅ 개선

1. 테스트 및 모니터링
   • 수행 이유
     • 모든 환경에서 정상적으로 돌아가는지에 대한 테스트 부재
     • 성능 개선을 위한 구체적 수치 필요
   • 수행 목록
     • playwright 를 통한 크로스 브라우징 및 유저 과부하 테스트
     • CRDT 통신 모니터링
     • 서버 모니터링?
   • 예상 결과
2. 마크다운&CRDT 구조 개선
   • 수행 이유
     • 기존 로직에서 여러 문제점 노출
       • 동시 편집의 순서 보장 문제
       • caret이 의도하지 않게 동작
       • 기타 현재 존재하는 버그들
     • 타 마크다운 문서와의 호환성
       • 복사 붙여넣기 등
   • 수행 목록
     • 클래스 리팩토링
     • tombstone 추가
     • caret 처리 수정
     • 1차원 → 중첩구조 ?
   • 예상 결과
3. 성능 최적화
   • 수행 이유
   • 수행 목록
     • 리스트 가상화
     • 프론트엔드 성능 최적화
       • 페이지 리사이징 스켈레톤 UI 도입 / 디바운싱 / 쓰로틀링
     • 백엔드 성능 최적화
       • Redis
   • 예상 결과
     • 정확한 수치?

성능 개선

• useMemo 활용하여 변화가 일어나는 블록에만 리렌더링 적용하기
• 리스트 가상화
• 프론트엔드 성능 최적화
• E2E 유저 부하 테스트 진행 (playwright)
• CRDT 통신 모니터링
  • 10개의 페이지에서 10명이 동시에 입력했을때 응답속도 측정
• CRDT 구조개선
  • tombstone 처리를 통해 순서가 꼬일 경우도 입력이 되게 CRDT스럽게 구조 개선
• 도커이미지 파일 줄이기
• DB 최적화? 멀 해야하지?
  • 서버가 날아간다면 DB에 저장되는 데이터는 어떻게 되나요? (최종발표 질문)
    • 이를 방지하기 위한 다중 서버 구현?

사용성 개선

• 사용성 개선을 위해 페이지 전부 지우기 버튼 (owner만 보이게)
• 크로스 브라우징 테스트 진행 (사파리, 크롬, 익스플로러, 파이어폭스 등등)
• 한글입력 다시 살펴보기
• 사용성 개선과 호환성을 위해 반응형 구현하기 (Mobile, Tablet)
• 이미지 추가...?
• 붙여넣기 최적화(Notion, Github, Obsidian….)
• undo/redo…??
• Caret 서버에 저장하기
  • 같은블럭 동시 편집 가능하게 하기 위해
• 같은 블록 동시편집 가능하게
• 여러 블록의 텍스트 동시에 드래그 가능하게