테스트 및 최적화 관련

코몽·2023년 7월 31일
0

1.테스트 유형비교
유닛테스트(Unit Test): 소프트웨어의 가장 작은 단위인 개별 함수나 메서드를 테스트하는 과정입니다. 각각의 기능이 올바로 동작하는지 확인합니다.
통합테스트(Integration Test): 여러 개의 유닛들이 서로 상호 작용하며 올바르게 통합되는지 확인하는 테스트 입니다. 주로 시스템의 여러 기능이 서로 잘 연계되는지 확인합니다.
E2E테스트(End-to-End Test): 사용자 관점에서 전체 시스템이 어떻게 동작하는지 확인하는 테스트 입니다. 이 테스트는 사용자 시나리오를 따라가며 단계별로 동작을 체크하여 최종 결과를 확인합니다.
2.리액트 테스트 도구 비교
Jest: 자바스크립트 및 리액트 테스트 프레임워크로, 유닛 테스트와 통합 테스트에 주로 사용됩니다. 속도가 빠르고 설정이 간편하며, 가상 DOM을 이용해 브라우저 없이 컴포넌트를 테스트할 수 있습니다.
React Testing Library: 리액트 컴포넌트를 테스트하기 위한 도구로, 사용자의 관점에서 컴포넌트를 테스트할 수 있습니다. Jest와 함께 사용되어 렌더링, 이벤트, 상태 변화 등 리액트 컴포넌트의 동작을 체크합니다.
Enzyme: AirBnB에서 개발한 리액트 테스트 도구로, 컴포넌트 렌더링 및 내부 상태 변경을 테스트 할 수 있습니다. React Testing Library와 유사하지만 조금 더 로우레벨의 테스트가 가능합니다.
최적화
1.CDN(Content Distributed Network
CDN은 전 세계의 여러 서버를 이용해 웹 콘텐츠를 효율적으로 제공하는 시스템입니다. 사용자와 가장 가까운 서버에서 콘텐츠를 전달해주므로 빠른 응답 속도와 낮은 지연 시간을 보장합니다. 이를 통해 웹사이트의 전체적인 성능과 가용성이 향상됩니다.

2.Web Vitals
Web Vitals는 웹사이트의 사용자 경험을 측정하기 위한 핵심 성능 지표입니다. 이 중 대표적인 지표들은 LCP(Largest Contentful Paint), FID(First Input Delay) 및 CLS(Cumulative Layout Shift)입니다. 이러한 지표들을 통해 웹사이트의 성능을 평가하고 개선할 수 있습니다.

LCP(Largest Contentful Paint): LCP는 화면에 가장 큰 콘텐츠 요소가 완전히 로드되는 시점까지 걸리는 시간을 측정합니다. 사용자가 웹사이트에서 중요한 정보를 볼 수 있는 속도를 의미합니다. 이 지표가 좋을수록 사용자가 페이지가 로딩되는 것을 빠르게 느낍니다. LCP는 2.5초 이내가 이상적이라고 간주됩니다.
FID(First Input Delay): FID는 사용자의 첫 번째 상호작용(클릭, 탭, 키보드 입력 등)부터 웹사이트가 이에 반응하는 데까지 걸리는 시간을 측정합니다. 페이지의 인터렉티브성을 수치화한 것으로, 이 지표가 좋을수록 더 빠른 반응성을 제공합니다. FID는 100밀리초 이내가 이상적이라고 간주됩니다.
CLS(Cumulative Layout Shift): CLS는 웹페이지의 누적적인 레이아웃 시프트 점수를 측정합니다. 레이아웃 시프트는 웹페이지가 로드될 때 공간을 차지하지 않은 콘텐츠가 나중에 로드되어 발생하는 현상을 의미합니다. 이는 사용자에게 방해가 되며, 페이지 안정성을 떨어뜨립니다. CLS는 0에 가까울수록 좋으며, 0.1 이하가 이상적이라고 간주됩니다.
3.Lighthouse
Lighthouse는 웹 애플리케이션의 성능, 접근성, 프로그레시브 웹 앱(PWA) 기준 등 다양한 분야를 분석해주는 오픈 소스 도구입니다. Lighthouse는 크롬 개발자 도구에 내장되어 있으며, 웹사이트에 대한 각종 지표를 제공하고 개선 방법을 알려줍니다. 이를 통해 웹사이트의 품질을 높일 수 있습니다.

profile
프론트엔드 웹 개발자

1개의 댓글

comment-user-thumbnail
2023년 7월 31일

좋은 정보 얻어갑니다, 감사합니다.

답글 달기