FrontEnd

FrontEnd

[Next.js] 웹페이지 전환속도 최적화를 위해 Back/Forward Cache 적용하기

적용하게 된 계기현재 개발중인 프로젝트의 프론트엔드 서버는 두 서버로 분리되어 있습니다. 그리고 사용자는 분리된 서버 간 이동을 자주 경험하고 있습니다. 근데, 두 서버 중 한 서버에서 웹 캐싱이 이루어지지 않고 있다는 사실을 발견하게 되었고, 그동안 사용자가 두 서버 간 이동을 할 때 이전 상황이 캐싱되지 않아 페이지 전환 시마다 맨 처음화면으로 돌아가는 현상을 겪고 있다는 것을 알게 되었습니다. 원인은 Cache-Control값에 따른 Back/Forward Cache 적용 여부에 차이가 있다는 것이었고, 해당 글을 통해 Back/Forward Cache 적용방법을 공유하고자 합니다. Back/Forward Cache란? Back/Forward Cache는 브라우저의 뒤로가기/앞으로가기 시 즉각적인 ..

FrontEnd

[Typescript] 커스텀 훅에서 제너릭 활용하기

개요 프로젝트를 진행하면서 custom Hook을 사용해야할 일이 있었다. 다양한 곳에서 custom hook을 활용하기 위해선 generic 활용이 필수라는 것을 느꼈고, 학습 후 코드에 적용해보게 되었다. generic은 Java나 C++ 등의 정적타입 언어에서 동적타입 기능을 제공해주는 역할을 하고있기 때문에 정적타입 언어에서 중요한 문법이라고 볼 수 있다. Javascipt는 동적 타입 언어이지만, Typescript를 통해 정적타입 언어로 코드를 관리하기 때문에, 동적타입 기능을 제공해주는 generic에 대한 이해가 필요하다. 이에 따라 generic에 대해 학습해보고 이전에 진행했던 프로젝트에 적용해봄으로써 실전활용도 해보고자 한다. 제너릭(generic)이란? generic은 컴포넌트에 대..

FrontEnd

[JavaScript] 클로저(Closure)란? (스코프, 클로저 개념, 클로저 활용)

먼저 클로저를 이해하기 위해서 Scope의 개념을 먼저 알아야 한다. 🧐 Scope란? Scope는 한국어로 `유효 범위`라는 뜻 즉, 사용자가 정의한 변수를 읽을 수 있는 범위 이다. 우리가 알고있는 변수는 크게 두가지로 나뉜다. : 전역변수, 지역변수 전역 변수 : 전역으로 선언한 변수이다. 모든 함수가 이 변수를 불러올 수 있다. 지역 변수 : 함수(지역)에서 선언한 변수이다. 특정 함수(지역) 내에서만이 이 선언된 변수를 불러올 수 있다. 예시를 한번 보자 var global_scope = 11; function local_function() { var local_scope = 22; alert(global_scope); // ok alert(local_scope); // ok } alert(gl..

caseBread
'FrontEnd' 카테고리의 글 목록