![]()
* 이 글은 Iceberg of React Hooks 번역하였습니다. The Iceberg of React Hooks React Hooks, unlike Class Components, provide low-level building blocks for optimizing and composing applications with minimal boilerplate. medium.com Class Component와는 달리 React Hooks은 application을 최소한의 보일러플레트로 구성 및 최적화하기 위해 low-level 빌딩 블럭을 제공합니다. 깊이있는 지식없이는 미묘한 버그나 추상화로 인해 성능 문제가 발생할 수 있고 코드 복잡성이 높아집니다. 저는 공통적인 문제를 증명하고 그것들을 고치기..
![]()
대부분의 회사에서 사용 되고 있는 React, Vue와 같은 프레임워크, 라이브러리들의 trade off는 항상 존재한다고 믿어왔다. 요즘 그러한 생각들이 더욱 드는 이유는 사내에서 에디터를 만들면서 관련된 기능의 내부 동작을 정확하게 알지 모른채 사용하는 메서드들이 생기고 있기 때문이다. 빠른 기능 구현을 해야하는 핑계로 인해 기술에 대한 합리화를 제 자신이 하고 있지 않은가에 대해 다시 생각해보면서, 이 글을 기록한다. addEventListener 자바스크립트를 이용해서 어떤 이벤트를 등록할 때 내부적으로 다음과 같다. var event_listener_list = []; var sayHi = function() { console.log('hi'); }; window.addEventListener(..
![]()
사내에서 개발 중인 여러가지 기능 중 이벤트 전파를 중단 시켜야 하는 상황이 생기게 되었다. 한 줄의 코드라도 코드의 대한 명분이 확실해야 한다는 것이 모든 개발자가 생각하는 중요한 것 중 하나이지만, 막상 실무에서 빠르게 자신의 할당량을 채워내기 바쁜 상황이면, 크롬 탭에 새로운 친구( 아.. 좀 이따가 읽어봐야지 하는 개발 관련 글 )를 만드는 현실이다. 이러한 상황들을 조금이라도 무마하기 위해, 또 습득한 지식을 머리 속에 남기기 위해 정리하는 시간을 갖고자 한다. 잘 알고 쓰면 득이 되고, 그렇지 않으면 독이 되는 이벤트 전파와 그에 관련된 기능 stopPropagation, stopImmediatePropagation의 기본적인 설명서에 대한 기록이다. StopPropagation 대부분의 DO..
![]()
* 이 글은 How are Function Components Different from Classes? 를 번역 및 요약하였습니다. How Are Function Components Different from Classes? They’re a whole different Pokémon. overreacted.io 리액트의 Function Component와 Class Component는 어떻게 다른 걸까? 여기에 대한 통용적인 해답은 Class를 통해 더 많은 기능을 사용할 수 있다는 것이었다. 과거형이기는 하지만, state같은 기능은 함수에서 사용할 수 없었다. 물론 Hook이 탄생하기 전까지 말이다. 그럼 속도가 차이가 날까? 이를 주장하는 벤치마크들이 있긴 하지만, 명분이 부족한 부분은 사실ㄹ이..
