Next.js : Network, Origin Servers - 한글
How Next.js Works ⑩⑪
네트워크란?
애플리케이션 코드가 네트워크에 배포될 때, 코드가 저장되고 실행되는 위치를 알면 도움이 된다. 네트워크를 자원을 공유하는 연결된 컴퓨터(혹은 서버) 라고 생각할 수 있다. 애플리케이션에서 Next.js의 경우에는, 코드는 오리진 서버, CDN, Edge에 분산되게 할 수 있다. 이것들이 무엇인지 보자. :
오리진 서버
앞서 본 것처럼, 서버는 오리지널 버전의 애플리케이션 코드를 저장하고 작동하는 주 컴퓨터를 말한다. 우리는 다른 장소의 분산되어있는 CDN 서버, Edge 서버처럼 다른 애플리케이션 코드를 이 서버와 구별하기 위해 '오리진'이라는 용어로 사용한다.
오리진 서버가 요청을 받을 때, 응답을 전송하기 전에 계산을 한다. 이 계산 결과는 CDN으로 이동할 수 있다.
컨텐츠 딜리버리 네트워크
CDN은 HTML과 이미지 파일과 같은 정적인 컨텐츠를 세계 여러 곳에 저장하며, 클라이언트와 오리진 서버 사이에 위치한다. 새 요청이 들어올 때, 사용자와 가장 가까운 CDN에서 캐시된 결과로 응답할 수 있다. 이런 방식은 각 요청에 대해
계산할 필요가 없기 때문에 오리진의 부하를 줄일 수 있다. 또한, 사용자도 그들과 지리적으로 가까운 곳에서 응답이 오기 때문에 더 빠른 경험을 할 수 있다.
Next.js에서는, 사전 렌더링을 수행하기 때문에, CDNs는 정적인 작업의 결과를 저장해 컨텐츠 전달 속도를 높이는 데 적합하다.
엣지
엣지는 네트워크의 프린지데 대한 일반화된 개념으로, 사용자에게 가장 가깝다. CDN은 '엣지'의 일부라고 간주될 수 있다. 왜냐하면 네트워크의 가장자리에서 정적인 커넨츠를 저장하기 때문이다.
CDN과 비슷하게, 엣지 서버도 세계 여러 장소에 분산되어 있다. 하지만 정적의 컨텐츠를 저장하는 CDN과 다르게, 일부 엣지 서버는 코드를 실행할 수 있다.
이 의미는 캐시와 코드 실행 모두 사용자에게 제일 가까운 엣지에서 가능할 수 있다.
엣지에서 코드를 실행해, 기존 클라이언트 측이나 서버 측 작업의 일부를 엣지로 이동할 수 있다. (Next.js 예제 보기)
이것은 애플리케이션의 성능을 높일 수 있다. 왜냐하면 클라이언트로 전송되는 코드 양이 줄어들고, 사용자의 요청 일부가 오리진 서버로 돌아갈 필요가 없으므로 대기시간이 줄어든다.
Next.js에서, 미들웨어로 엣지에서 코드를 실행할 수 있고, 조만간 리액트 서버 컴포넌트에서 사용할 수 있다.
다음 단계
Next.js의 기본 단계를 끝마친 것을 축하해요!
다음으로 Next.js를 배우시려면, 첫 번째 Next.js 앱 만들기를 추천한다. 그것은 주요 기능을 소개하는 사용지침서이다.
또한 우리의 문서를 확인해보고, 많은 예제들을 탐구해보자.
커뮤니티에 가입
만약에 질문이 있다면 우리의 커뮤니티인 Discord 나 깃헙의 디스커션에 방문해주세요.
번역 : 2022. 08. 25
영어를 잘하지 못하므로 부정확할 수 있습니다. 더 정확한 설명 or 번역이 있다면 댓글 환영합니다 *
출처