본문 바로가기

전체 글

 (176)
🌟[상상개발] 무한스크롤을 어떻게 구현하는 게 좋을까? (개발자 강화/프론트엔드) 2025. 1. 23. 13:32 * 주의: 실제 개발하면서 정리한 것이 아니라, 구현을 어떻게 할 수 있을지 찾아보고 생각을 정리한 글입니다. React Query 사용특징QueryClient라는 객체에서 관리하고, 이는 브라우저 메모리에 존재함.Query Key를 기준으로 저장함. 데이터+상태(status, fetching, updateAt)을 메모리 캐시에 보관함.staleTime으로 캐시된 데이터가 오래된 상태인지 확인하고, 오래됐으면 서버로 데이터 갱신useInfiniteQuery: 페이지네이션 데이터 관리할 때, 각 페이지 데이터를 구분해 메모리 캐시에 저장함.invalidateQueries: 서버 데이터가 변경된 경우, React Query는 invalidateQueries를 통해 캐시를 무효화.Garbage Collecti..
[매일메일] SSR vs CSR, SPA vs MPA란? (BE.250122) (개발자 강화/백엔드) 2025. 1. 22. 20:48 SSR이란?서버 측에서 렌더링하는 방식.클라이언트가 서버에 컨텐츠를 요청할 때마다, 서버는 완성된 페이지를 생성해서 클라이언트에 제공함.CSS를 모두 적용하고 렌더링 준비를 마친 HTML과 JS 코드를 응답함.브라우저에서는 JS 코드를 다운로드하고, HTML에 JS를 연결함.모든 데이터가 HTML에 이미 담겨있기 때문에 SEO(검색 엔진 최적화)에 유리함.JS 코드를 다운로드 받고 실행하기 전에 사용자가 이미 렌더링된 HTML을 볼 수 있음(초기 로딩 속도 빠름) CSR이란?클라이언트 측에서 렌더링 하는 방식.클라이언트가 서버에 컨텐츠를 요청하면, 서버는 빈 뼈대만 있는 HTML을 응답함.클라이언트는 연결된 JS 링크를 통해 서버로부터 다시 JS 파일을 다운로드 받음JS를 통해 동적으로 페이지를 만들어 ..
[매일메일] Connection/Socket/Read Timeout이란? (BE.250121) (개발자 강화/백엔드) 2025. 1. 21. 22:48 Connection Timeout클라이언트가 서버에 연결을 시도할 때, 서버 장애나 응답 지연으로 일정 시간 내 연결이 이루어지지 않으면 발생함3-way handshake가 일정 시간 내에 완료되지 않으면 발생함 (클라이언트-서버 연결을 위해 확인하는 절차) Socket Timeout패킷이 전송되는 시간 간격 제한 내에 다음 패킷을 보내지 않으면 발생함.패킷: 클라이언트와 서버가 연결된 후, 서버에서 데이터를 전송할 때 데이터를 여러 패킷 단위로 쪼개서 전송함.시간 내에 다음 패킷이 오지 않으면 클라이언트는 연결 종료. Read Timeout클라이언트와 서버가 연결된 후, 특정 I/O 작업이 일정 시간 내에 완료되지 않으면 발생함.클라이언트는 서버의 응답이 지연되거나 I/O 작업이 길어져 요청이 처리되지..

티스토리툴바