에러를 놓치지 않는 방법, Sentry 도입 가이드

1. 개요 “혹시 어떤 상황에서 발생하셨나요?, 저는 재현이 안되는데요??” 회사에서 개발을 하다가 팀원분께서 때때로 에러상황에 대해 전달해주실때가 종종 있습니다. 문제는 발생상황을 말씀해주셔도 재현이 안되거나, 하나하나 전달받을때마다 처리하는게 좋은 구조는 아니라고 생각했어요. 발생 당시의 로그를 파...

프론트엔드 성능 최적화가이드-4

4장 이미지 갤러리 최적화 본 글은 “웹 개발 스킬을 한 단계 높여주는 프론트엔드 성능 최적화 가이드” 책의 공부내용으로 기억력이 좋지 않은 미래의 나를 위한 정리글입니다. git 4.1 레이아웃 이동 문제 상황 : 이미지가 뚝뚝 끊기고, 밀어내는 현상이 보이고있다 , CLS(Cumulative ...

프론트엔드 성능 최적화가이드-3

3장 홈페이지 최적화 본 글은 “웹 개발 스킬을 한 단계 높여주는 프론트엔드 성능 최적화 가이드” 책의 공부내용으로 기억력이 좋지 않은 미래의 나를 위한 정리글입니다. git 3.1 이미지 지연로딩 문제 상황 : 처음 페이지에 들어오면 비디오가 표현되는데, 스크롤을 내려야 표현되는 이미지정보가 ...

프론트엔드 성능 최적화가이드-2

2장 올림픽 통계 서비스 최적화 본 글은 “웹 개발 스킬을 한 단계 높여주는 프론트엔드 성능 최적화 가이드” 책의 공부내용으로 기억력이 좋지 않은 미래의 나를 위한 정리글입니다. git 2.1 CSS 애니메이션 최적화 브라우저의 렌더링과정 DOM+CSSOM → 렌더트리 → 레이아웃 → 페인트 → 컴포지트...

프론트엔드 성능 최적화가이드 -1

1장 블로그 서비스 최적화 본 글은 “웹 개발 스킬을 한 단계 높여주는 프론트엔드 성능 최적화 가이드” 책의 공부내용으로 기억력이 좋지 않은 미래의 나를 위한 정리글입니다. git 1.1 LightHouse Lighthouse란 웹 페이지의 품질을 측정하는 데 사용되는 오픈 소스 도구 여기서 기...