본문 바로가기

웹 프론트엔드/Javascript3

Javascript 메모리 관리 (가비지 컬렉션) 알고리즘 알아보기 자바스크립트의 메모리 관리 및 가비지 컬렉션과 관련해 공부한 내용에 대해서 포스팅을 작성해 보았습니다. 1. 가비지 컬렉션이란? (GC) 자바스크립트는 객체가 생성되었을 때 자동으로 메모리를 할당하고 쓸모 없어졌을 때 자동으로 해제한다. 그렇다면 메모리는 언제 생겨나고 없어질까? 메모리의 생존주기는 아래와 같다. 1-1. 메모리 생존주기 1) 필요할때 할당한다. 2) 사용한다. (읽기, 쓰기) 3) 필요없을 때 해제한다. 1)과 3)은 가비지 컬렉션을 사용하는 Javascript 에서는 암묵적으로 작동하며, C 언어와 같은 저수준 언어에서는 아래와 같이 명시를 해주어야 한다. #include int main() { int pNum = malloc(sizeof(int)); // 4 byte, int 형 데.. 2020. 10. 19.
AbortController를 사용해 API 비동기요청 취소하기 최근 Javascript 웹 페이지 제작을 하면서 fetch를 통한 비동기요청이 진행되는 동안에 요청을 취소해야하는 기능구현이 필요하게 되었다. 페이지 이동, 취소 요청과 같은 이벤트가 발생하게 되면 이전 비동기요청을 취소하는 방법에 대해서 알아보다 이를 더 잘 이해하기 위해 포스팅을 작성하게 되었습니다. 1. AbortController 개요 Fetch 객체는 promise 객체를 리턴하는 비동기함수입니다. 원래 promise 객체는 자체 abort 기능이 없기 때문에 abortcontroller 를 통해서 비동기 동작 중단 기능을 구현 할 수 있습니다. - 사용해야 하는 이유 1) 필요하지 않은 API 호출을 취소하여 웹페이지 성능개선 2) API 호출로 인해 발생하는 비용 절감 2. 기본적인 사용방.. 2020. 10. 3.
웹 성능 향상을 위한 Throttle과 Debounce 개념부터 활용까지 저는 Javascript 웹 페이지 제작을 하면서 성능 향상을 위해 쓰로틀(Throttle)과 디바운스(Debounce) 기능이라는 것을 알게 되었습니다. 그에 대한 이해를 더욱 깊이있게 하고 배운 것을 공유하기 위해 포스팅 하게되었습니다. 두 가지 기능에 대한 개념부터 활용까지 한 번 알아보겠습니다. 1. 둘의 개념과 사용법은? 1) Throttle 이란? - 개념 : 여러 호출이 발생할 때 일정 시간이 지나기 전에는 기능이 호출 되지 않도록 하는 기능 - 사용예 : 무한 스크롤을 사용한 LazyLoading 기능을 구현할 때 사용, 스크롤로 인한 성능 저하 방지 Throttle을 적용하지 않으면 스크롤이 조금 움직일 때 마다 기능을 계속 호출하게 된다. 스크롤 이동시 많은 기능이 로드되어야 한다면 부.. 2020. 9. 7.

티스토리툴바