/images/profile_no_background.png

김영천 블로그

angular route reuse strategy

Intro

웹앱을 개발하다보면 list->detail 패턴의 구조를 흔하게 작성하게 됩니다. list-detail 패턴이란 목록(list)에서 원하는 컨텐츠를 탐색 후 해당 컨텐츠의 상세한 정보를 보는 화면(detail)로 이동하는 방식을 말합니다. 이 때 detail 화면에서 뒤로 가기를 이용해 목록 화면으로 돌아올 경우 Angular는 해당 화면을 구성하는 컴포넌트를 처음부터 다시 생성(ngOnInit 실행)합니다. 이럴 경우엔 다음과 같은 문제가 발생합니다.

도커 컨테이너 안에서 외부 URL 호출하기

도커 컨테이너 내부에서 외부 URL을 호출해야 하는 경우가 종종 있습니다(Ex: 네이버 API 호출). 평소에는 아무 생각없이 불러오던 URL이 도커 컨테이너에서 사용하면 에러가 발생하는 경우가 있습니다. 에러 메세지는 x509: certificate signed by unknown authority 대충 이런 모양인데 이는 도커 컨테이너에 사용한 이미지의 TLS 인증서에 문제가 있음을 의미합니다.

angular universal 메모리 누수 개선하기 - 003

앵귤러 기반 웹사이트를 개발하면서 발생한 메모리 누수의 다양한 원인들과 그 해결법을 기록합니다.

들어가며

이번 문서에서는 Chrome Inspect를 이용해서 서버 사이드 렌더링 시 발생하는 메모리 누수를 확인하고 이를 수정하는 방법에 대해 알아봅니다. 이 문서는 Angular Universal에 대해 기본적인 이해가 있다는 것을 전제로 작성되었습니다.

angular universal 메모리 누수 개선하기 - 002

앵귤러 기반 웹사이트를 개발하면서 발생한 메모리 누수의 다양한 원인들과 그 해결법을 기록합니다.

들어가며

이번 문서에서는 rxjs 쓰다보면 흔하게 접할 수 있는 메모리 누수에 대해 알아보고 eslintuntil-destroy를 이용해 메모리 누수를 원천적으로 막을 수 있는 방법에 대해 알아봅시다. 이 문서는 rxjs, eslint에 대해 기본적인 이해가 있다는 것을 전제로 작성되었습니다.

angular universal 메모리 누수 개선하기 - 001

앵귤러 기반 웹사이트를 개발하면서 발생한 메모리 누수의 다양한 원인들과 그 해결법을 기록합니다.

들어가며

부끄럽지만 앵귤러 기반 웹 프로젝트를 진행하며 메모리 누수같은 문제는 사실 전혀 신경을 안()쓰고 있었습니다. 어차피 사용자 브라우저에서 돌아가니깐 새로고침만 하면 해당 페이지의 메모리는 초기화될테니 속도만 느리지 않다면 된다는 생각이었지요. 당연히 이는 크게 잘못된 생각이었고 서버사이드 렌더링(이하 SSR)를 적용하면서 문제는 상당히 심각하게 흘러갑니다. 지금부터 제가 개발하면서 만나본 다양한 메모리 누수(memory leak) 문제를 살펴보고 그 해결법을 기록하고자 합니다.