min

코드 리뷰 사이트 개인 회고 1일차 본문

프로젝트 회고

코드 리뷰 사이트 개인 회고 1일차

minprogramming 2023. 8. 23. 07:58

<회고록>

오늘은 내가 코드 리뷰 사이트 매인 페이지를 제작하면서 느꼈던 어려움들에 대해서 같이 이야기를 나눠볼려고 한다.

 

1. 폰트 어썸 CDN

: 사실상 CDN이라고 하는 서비스는 분산 처리 시스템을 의미한다. 이는 서버를 한 군데에다가 넣어두는 것이 아니라 여러 곳에 배치하여 클라이언트와 서버 사이에 물리적인 거리를 줄인다. 또한 이 서버는 캐싱 서버이기 때문에 초기에 들어오고 나서 두번째부터는 캐싱이 된다는 장점이 있다. 하지만 여전히 물리적인 거리는 존재하기 때문에 속도는 낮을 수 밖에 없다. 그 뿐만 아니라 CDN 시스템에서 내가 원하는 폰트를 가져오기 때문에 내가 이 폰트를 압축시키지 못한다는 점도 문제이다. 이는 결과적으로 성능과도 연관되는 문제이기 때문에 이번에 나는 폰트를 CDN 서비스를 통해서 가져오는 것이 아니라 직접 다운로드 받아 정적 파일로 사용하기로 했다. 장점은 물리적인 거리 자체도 줄어들 뿐만 아니라 내가 원하는대로 압축을 시킬 수 있기 때문에 성능상에서도 좋은 영향을 미쳤다.

 

2. lazy loading 

사실상 js는 사용자가 사이트에 방문할 때 라우터에 있는 모듈들을 묶어서 즉 번들을 보낸다. 이는 해당 페이지와 관련이 없는 파일들까지 클라이언트에게 보내기 때문에 사실상 클라이언트는 불필요한 데이터를 받는 것과 다름이 없다. 그래서 나는 이를 해결하기 위해서 lazy   loading을 구현했다. lazy loading의 자세한 설명은 위 블로그를 참조하길 바란다.

 

https://minprogramming.tistory.com/entry/React-Lazy에-대하여

 

React Lazy에 대하여...

오늘은 React Lazy에 대해서 알아볼려고 한다. 1. React Lazy를 사용하는 이유? React Lazy를 사용하는 이유는 다음과 같다. 만약 다음과 같은 코드가 있다고 가정하자 import { BrowserRouter, Route, Routes } from "re

minprogramming.tistory.com