본문 바로가기
728x90

전체 글121

Reflow와 Repaint가 실행되는 시점 Reflow와 Repaint가 실행되는 시점 Reflow DOM 엘리먼트 추가, 제거 또는 변경 CSS 스타일 추가, 제거 또는 변경 CSS 스타일을 직접 변경하거나, 클래스를 추가함으로써 레이아웃이 변경될 수 있습니다. 엘리먼트의 길이를 변경하면, DOM 트리에 있는 다른 노드에 영향을 줄 수 있습니다. CSS3 애니메이션과 트랜지션. 애니메이션의 모든 프레임에서 리플로우가 발생합니다. offsetWidth 와 offsetHeight 의 사용. offsetWidth 와 offsetHeight 속성을 읽으면, 초기 리플로우가 트리거되어 수치가 계산됩니다. 유저 행동. 유저 인터랙션으로 발생하는 hover 효과, 필드에 텍스트 입력, 창 크기 조정, 글꼴 크기 변경, 스타일시트 또는 글꼴 전환등을 활성화하.. 2022. 7. 30.
마이크로태스크 큐, 태스크 큐 마이크로태스크 큐, 태스크 큐 2개의 큐 모두 콜백함수가 들어간다는 점에서 동일하지만 어떤 함수를 실행하느냐에 따라 어디로 들어가는지가 달라집니다. 또한 명칭은 큐 (Queue) 이지만 자료구조의 큐와는 다릅니다. 엄밀히 말하자면 우선순위 큐 (Priority Queue) 라고 할 수 있는데, 이벤트 루프가 2개의 큐에서 태스크를 꺼내는 조건이 “제일 오래된 태스크” 이기 때문입니다. (동작방식) 콜백함수를 태스크 큐에 넣는 함수들 setTimeout, setInterval, setImmediate, requestAnimationFrame, I/O, UI 렌더링 콜백함수를 마이크로태스크 큐에 넣는 함수들 process.nextTick, Promise, Object.observe, MutationObser.. 2022. 7. 30.
📕 리팩터링 2판 리뷰: 2장, 3장 📕 리팩터링 2판 : 코드 구조를 체계적으로 개선하여 효율적인 리팩터링 구현하기 리뷰 리팩터링 2판의 2장과 3장을 읽고 왔습니다. 최근에 면접이 잡히고, 면접 공부를 병행하느라 하루에 작은챕터 2장씩만 읽고 있네요.. 합격한다면 읽는 속도 좀 팍팍 내보고 싶습니다. 🥲 리팩터링 2판의 2장과 3장의 리뷰를 시작해보겠습니다. ⭐️ 2장: 리팩터링 원칙 2장에서는 리팩터링의 정의, 리팩터링의 유래 등과 함께 리팩터링 전반에 적용되는 원칙들에 대해 알아봅니다. ⭐️ 3장: 코드에서 나는 악취 3장에서는 리팩터링을 제때 적용하는 법을 알기 위해, 코드에서 나는 냄새(악취)를 감지하는 법에 대해 알아봅니다. 🤔 느낀 점 2장(리팩터링 원칙)에서는 리팩터링이 얼마나 좋은건지, 리팩터링의 효험(?)을 설명해주기도 .. 2022. 7. 30.

티스토리툴바