1편 웹 최적화하기 (React)
2021. 3. 25. 01:51ㆍjavascript/최적화
웹 최적화
웹 최적화를 왜 시켜야할까? 웹을 사용하다 보면 프론트가 느리거나 반응이 느려서 사용자가 답답해야할 때가 있다. 특히나 한국인의 경우에는 반응이 조금만 새로고침을 하는 특이한 종족이기 때문에 한국의 웹 개발자라면 최적화에 신경을 안쓸수가 없다.
그리고 또한 리액트를 사용하면서 리액트를 사용하는 사람은 많을 것 같다는 생각이 주위의 사람들이나 들었다. 요즘 좋은 강의들도 많아서 나만의 차이점? 특이점을 만들어서 조금 더 스킬업을 하고 싶다는 생각을 많이 했다.
최적화를 통해 얻을 수 있는 것
- 사용자들이 떠나지 않게 만들 수 있다.
한국 사람 특성상 조금만 로딩이 되거나 늦어지면 나가버리는 사람들이 많다.(나도 그렇다) 이를 해결하면 더 사용성을 높여서 이용자가 더 편하게 사용할 수 있을 것이다. - 조금 더 스킬업을 통한 더 좋은 프론트 개발자로 성장하기
웹 성능
- 로딩 성능
클라이언트가 서버에 요청을 보내고 각가의 필요한 정보 및 파일을 가져오는 성능을 의미한다. - 렌더링 성능
로딩을 통해 받아온 정보 및 파일들을 브라우저에 표시해주는 성능을 의미한다.
위의 두가지 성능을 고치는 것만으로도 더 좋은 웹사이트를 만들 수 있을 것 같다. 이 글을 시작으로 최적화와 관련된 글을 작성해보겠다.
웹 사이트 최적화 방법
1. HTTP 요청 줄이기 브라우저가 웹페이지를 그리는 첫번째 과정으로 주소창에 URL을 입력하고 엔터키를 누르면 서버는 요청을 받고 웹 페이지를 구성하고 있는 HTML, CSS, JavaScript, 이미지 등의 구
bearjin90.tistory.com
위의 블로그에 많이 표시되어 있다. 위의 블로그를 참고해보면 좋을 것 같다.
사실은 필드에서 저렇게 모든 것을 다 신경써주기 어렵다는 생각이 든다. 그래서 필자의 경우 몇가지만을 이용해 진행하며 리액트에 적용하려고한다.
'javascript > 최적화' 카테고리의 다른 글
7편 애니메이션 최적화 (0) | 2021.04.02 |
---|---|
6편 Code Splitting 과 React lazy, Suspense (0) | 2021.03.30 |
5편 Performance 사용해서 오래걸리는 코드 찾아보기 (0) | 2021.03.29 |
3편 이미지 사이즈 최적화 부분 해결하기 (0) | 2021.03.26 |
2편 크롬 검사 기능으로 웹의 성능평가 해보기(light house) (0) | 2021.03.26 |