주요 렌더링 경로 - 브라우저의 원리를 이해하고 최적화 하기
[Critical Rendering Path](https://developers.google.com/web/fundamentals/performance/critical-rendering-path?hl=ko)를 요약했습니다. 이글을 보는게 더 나아요 사실 ```toc tight: true, from-heading: 2 to-heading: 3 ``` 성...
05 POSTS
Web-performance 5
왜 CommonJS는 번들사이즈를 크게 하는가?
[How CommonJS is making your bundles larger](https://web.dev/commonjs-larger-bundles/) 를 번역 & 요약한 글입니다. ```toc tight: true, from-heading: 2 to-heading: 3 ``` **요약: 웹 애플리케이션을 확실하게 최적화해서 번들링하기 위해서는, C...
프론트엔드 개발자가 알아야 하는 Angular와 React의 Change Detection
[What every front-end developer should know about change detection in Angular and React](https://indepth.dev/what-every-front-end-developer-should-know-about-change-detection-in-angular-and-react/)를 번...
React count down에서 배운 event-emitter 와 requestAnimationFrame
# 리액트에서 카운트 다운을 만들며 배운 것들 리액트에서 카운트 다운을 만든다고 가정해보자. 가장 먼저 생각나는대로, 빠르게 구현한다면 아래와 같은 느낌이 될 것이다. https://codepen.io/yceffort/pen/BayPyNe 하지만 이 코드는 한가지 문제를 가지고 있다. ## setInterval, setTimeout `setInte...
typescript debounce
> Creates a debounced function that delays invoking func until after wait milliseconds have elapsed since the last time the debounced function was invoked. The debounced function comes with a cancel m...