dev.daisy

  • 홈
  • 태그
  • 방명록

rerendering 1

[Next.js] 메모이제이션 및 리렌더링을 활용한 TBT 43% 개선기

이번 최적화를 통해 크게 배운 점은 '최적화는 무조건 많이 한다고 좋은게 아니다'라는 점이였습니다. 처음에는 모든 연산을 메모이제이션하면 성능이 올라갈거라고 생각했지만, 오히려 TBT가 증가하는 경험을 했습니다.실제로 효과가 있었던 건 병목 지점윽 정확히 찾아내고, 꼭 필요한 곳에만 최적화를 적용하는 것이었습니다. 특히 Zustand에 선택적 구독을 적용하고 불필요한 날짜 포맷팅 최소화 방법으로 체감상 가장 큰 성과를 가져왔습니다.앞으로도 성능 문제를 만나면 '이 코드가 실제로 병목을 만드는가?'를 먼저 검증하고, 그 후에 최적화를 적용하는 습관을 지키려고 합니다. 조직 기반 매칭 서비스인 '튜닝' 개발 중 프로젝트에서 가장 큰 병목 지점은 채팅 페이지였습니다.실시간 메시지 UI와 상태 관리, SSE 구..

👩🏻‍💻 Develop/Performance Optimization 2025.09.01
이전
1
다음
더보기
프로필사진

dev.daisy

주니어 프론트엔드 개발자입니다 :) github @dani1552

  • 분류 전체보기
    • 👩🏻‍💻 Develop
      • Performance Optimization
      • TroubleShooting
      • Test
      • Document
    • 📚 CS
      • JavaScript
      • React
      • Basic
      • Algorithm
    • 🏃🏻 Others
      • Conference
      • Interview (🔒)
      • Information (🔒)

Tag

V-Dom, V8, useRef, SSR, memoization, nginx, SSE, Next.js, test code, JavaScript, https, refresh token, OSI, scope, rerendering, FEConf, udp, Hooks, REACT, Cors,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

공지사항

페이스북 트위터 플러그인

  • Facebook
  • Twitter

Archives

Calendar

«   2025/12   »
일 월 화 수 목 금 토
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31

방문자수Total

  • Today :
  • Yesterday :

Copyright © Kakao Corp. All rights reserved.

티스토리툴바