프론트엔드 2

[Network] 프론트엔드에서 리소스 요청 부담 줄이기

웹 사이트 혹은 애플리케이션에서 가장 코스트가 높은 것은 물론 서버와 요청을 주고 받을 때이다. 무엇을 하던 내부에서 처리하는 작업보다는 외부와 통신하는 작업이 비용이 높다. 서버에 대한 리소스 요청을 최적화하는 작업은 프론트엔드 성능 측면에서도 중요하지만 서버 측의 부담을 감소시켜줄 수 있다는 점에서도 신경써줘야 하는 부분이다. 리소스 요청을 최적화하는 방법에는 두 가지가 있다. 하나는 요청하는 리소스의 크기를 줄이는 것이고 하나는 리소스 요청 횟수 자체를 줄이는 것이다. 1. 리소스 용량 줄이기 (1) 트리 쉐이킹 : 트리 쉐이킹은 외부 모듈을 import할 때 필요한 기능만을 가져오는 것을 의미한다. (2) 불필요한 코드 제거하기 (ex. 주석) (3) Minify, Uglify 등을 통해 번들링 ..

잡다한 교훈 2022.04.20

프론트엔드 면접공부

면접관련 포스트들은 구글링한 다른 블로그들의 내용들과 교내 강의를 수강하면서 학습했던 내용을 합쳐서 정리하였습니다. 프론트엔드 면접과 관련된 공부 내용들은 해당 포스트에 지속적으로 추가될 예정입니다. 1. 브라우저 렌더링에 대해 설명하기 - 렌더링은 html, css, javascript 등 개발자가 작성한 문서를 브라우저에서 그래픽 형태로 출력하는 것을 말한다. - 구체적인 브라우저 렌더링 과정은 다음과 같다. 1) 브라우저 주소창에 사이트 주소를 입력한다. 2) 네임서버(DNS : Domain Name Server)가 입력된 도메인 주소에 해당하는 IP 주소를 연결시켜준다. 3) 서버로부터 수신된 html파일과 css파일을 파싱하면서 각각 DOM 트리와 CSSOM 트리를 형성해준다. (정확히는 htm..