dooli1971039
commented
1 year ago 최적화
1. CDN(Content Distributed Network)에 대해 설명해주세요
CDN(콘텐츠 전송 네트워크)는 지리적으로 분산된 여러개의 서버이다. 웹 콘텐츠를 사용자와 가까운 곳에서 전송함으로써 전송 속도를 높인다. 사용자는 가까운 서버를 통해 웹 활성화 디바이스 또는 브라우저에서 인터넷 콘텐츠에 빠르게 접속할 수 있다. CDN은 웹 페이지, 이미지, 비디오 등의 콘텐츠를 사용자의 물리적 위치와 가까운 프록시 서버에 캐싱한다. 이렇게 하면 콘텐츠가 로딩될 때까지 기다릴 필요 없이 영화 감상, 소프트웨어 다운로드, 은행 잔고 확인, 소셜 미디어 포스팅, 구매 등의 작업을 할 수 있다.
2. Web Vitals에 대해 설명해주세요
웹에서 훌륭한 사용자 경험을 제공하는 데 필수적인 품질 신호에 대한 통합 지침을 제공하기위한 Google의 측정 기준이다.
이 중에 Core Web Vitals는 모든 웹 페이지에 적용되는 Web Vitals의 하위 집합으로 모든 사이트 소유자가 측정해야 하며, 모든 google 도구에 표시된다.
Core Web Vitals에는 아래 지표들이 있다.
- LCP (Largest Contentful Paint) : 로딩 성능을 측정합니다. 좋은 사용자 경험을 제공하려면 페이지가 처음로드되기 시작한 후 2.5 초 이내에 LCP가 발생해야합니다.
- FID (First Input Delay) : 상호 작용을 측정합니다. 좋은 사용자 환경을 제공하려면 페이지의 FID가 100 밀리 초 미만이어야합니다.
- CLS (Cumulative Layout Shift) : 시각적 안정성을 측정합니다. 좋은 사용자 환경을 제공하려면 페이지에서 0.1 미만의 CLS를 유지해야합니다.
3. Lighthouse에 대해 설명해주세요
Lighthouse는 구글에서 개발한, 웹 페이지의 품질을 개선할 수 있는 오픈 소스 형태의 자동화 도구로, 어떤 페이지든 사용할 수 있다. 크롬 개발자도구의 Lighthouse 탭을 통해 측정 결과를 확인할 수 있다.
테스트
1. 유닛테스트 vs 통합테스트 vs E2E테스트를 비교하여 설명해주세요
1. 유닛테스트
Unit 테스트는 전체 코드 중 작은 부분을 테스트하는 것이다. (ex. 함수 하나하나 개별로 테스트 코드를 작성) 만약 테스트에 네트워크나 DB같은 외부 리소스가 포함된다면, 이는 유닛 테스트가 아니다.
2. 통합테스트
Integration 테스트는 각각의 시스템이 어떻게 상호작용하고 제대로 작동하는지 테스트하는 것을 의미한다. 유닛테스트와 유사하지만, 통합테스트는 다른 컴포넌트들과 독립적이지 않다. (ex. 통합테스틑 실제 DB와 통신해야 한다.)
3. E2E테스트
End-to-End 테스트는 프로덕트를 사용자 관점에서 테스트 하는 방법으로, DB 및 여러 인프라가 갖추어진 상태에서 테스트한다. 페이지에서 UI가 제대로 보이는지, 특정 행동을 했을 때 올바른 동작을 수행하는 지 등을 테스트한다. E2E 테스트는 다양한 앱의 의존관계가 정확히 작동하는지 확인하며, 정확한 정보가 다양한 시스템 컴포넌트 사이에서 전달하는지 체크할 수 있다.
2. 리액트 테스트에 사용되는 도구들을 비교하여 설명해주세요.
1. Jest
Jest는 자바스크립트의 Test Runner이다. ex) RTL로 찾은 버튼이 제대로 동작하는지를 테스트한다.
2. React Testing Library
RTL은 test runner는 아니다. 하지만 test runner를 위한 공간(virtual DOM)을 제공한다. 즉, 테스트가 필요한 react 컴포넌트를 렌더링하는 역할을 한다. ex) example이라는 컴포넌트에서 버튼을 눌렀을 때 기능이 동작하는지 테스트하고 싶다면, RTL은 테스트를 위해 example 컴포넌트를 렌더하고, 컴포넌트에서 버튼을 찾는다.