jopemachine. dev blog

개발 관련 개인적인 일상, 후기, 생각, 스터디, 문서 번역 등 각종 포스팅을 정리하고 공부하고, 공유합니다.

Closure에 대해서

Typescript

Closure에 대해서 아래 함수는 클로저를 리턴한다. 1 2 3 4 5 6 7 8 9 10 11 12 const returnClosure = () => { let _state; return () => { if (!_state) _state = 1; else { ++_state; } ...

Posted by jopemachine on November 18, 2021

POSIX에 대해

POSIX

POSIX에 대해 POSIX는 Portable Operating System Interface의 약자 (X는 유닉스 계열에 붙는 관용적인 느낌인 듯..?) 이식성 높은 유닉스 응용 프로그램 개발을 위해 유닉스 OS의 공통적인 API를 정리한 인터페이스 규격. 시스템 콜 (C 언어 인터페이스) 뿐 아니...

Posted by jopemachine on November 18, 2021

Typescript의 Design goals

Typescript

Typescript의 Design goals Goals Statically identify constructs that are likely to be errors. 오류일 가능성이 높은 구성들은 정적으로 식별한다. Provide a structuring mechanism for larger pieces of code. 더 큰 코드...

Posted by jopemachine on November 17, 2021

Type Systems, Covariance, Contravariance, Bivariance, and Invariance

Programming

Type Systems: Covariance, Contravariance, Bivariance, and Invariance Invariance 1 2 3 4 function method(value: Invariant<City>) {...} method(new Noun()); // error... method(new City...

Posted by jopemachine on November 17, 2021

강타입 언어 vs 약타입 언어 / 동적 타입 언어 vs 정적 타입 언어

프로그래밍 언어

강타입 언어 vs 약타입 언어 이 용어들은 언어가 올바르지 않은 타입 정보를 가진 프로그램을 실행하는 것을 허용하는지를 나타낸다. 강타입, 약타입의 언어의 기준은 자의적일 수 있다. 강타입 언어에 대한 명확한 정의가 정해져 있지 않다. 그럼에도 불구하고 일반적인 강타입 언어의 특징을 정리해 보면 다음...

Posted by jopemachine on November 15, 2021

Build your own react 학습 정리 (React의 동작, 구현에 관해)

React 세부사항

Build your own react 학습 정리 Build your own react를 보며 공부한 내용을 정리해보았다. Step I ~ Step V render를 단순히 재귀적인 appendChild로 구현한다면 전체 DOM 트리가 그려지기 전까지 메인 스레드를 블로킹 하게 된다. 즉, workLoop를 ...

Posted by jopemachine on November 14, 2021

Redux와 비동기 액션 처리

프론트 각종 문제 상황 해결

Redux와 비동기 액션 처리 모든 리듀서들은 순수함수이다. 상태는 디스패치로만 변경되며, 수정되는 것이 아니라 교체된다. (불변성 개념 참고) 액션이 디스패치 되면 모든 리듀서들에 액션이 넘어가고, 리듀서는 자신이 다뤄야할 액션에 해당하는 코드를 실행하고 바뀐 상태를 스토어에 반영한다. Redux ...

Posted by jopemachine on November 14, 2021

requestAnimationFrame vs requestIdleCallback

웹 API 세부사항

requestAnimationFrame vs requestIdleCallback requestAnimationFrame requestAnimationFrame, 줄여서 rAF는 브라우저에서 다큐먼트의 스타일, 레이아웃을 새로 계산할 때 마다 (정확히는 바로 직전) 콜백함수를 실행시킨다. requestIdleCallback ...

Posted by jopemachine on November 13, 2021

useEffect vs useLayoutEffect

React 세부사항

useEffect vs useLayoutEffect 둘은 같은 API를 갖고 있고 이름도 비슷한데 어떻게 다른가? useEffect로 전달된 콜백은 Layout, Paint 이후 발생한다. (두 번째 인자로 전달된 상태의 변화에 맞춰 바로 동기적으로 실행되는 게 아니라 지연한다) 대다수의 Side effect가 이렇게 다뤄져야 하므로 일...

Posted by jopemachine on November 13, 2021

React, redux와 불변성에 대한 개념 정리

React 세부사항

React, Redux와 불변성 React의 경우 shouldComponentUpdate, useEffect 등에서 상태의 변화를 감지할 때 매번 깊은 비교를 하는 것은 성능 상 불리한 방식임. 그래서 그냥 객체 자체를 바꾸는 식으로만 업데이트 할 수 있도록 강제하고 상태의 변화엔 항상 얕은 비교만 사용한다. Redux의 경우 Re...

Posted by jopemachine on November 12, 2021

FEATURED TAGS
Git Frontend Javascript Translation Typescript Browser Frontend Optimization Linux Programming React Redux HTML CSS Web Programming Backend Flux Http Node OSSCA Review Security
ABOUT ME

다양한 CS 분야에 관심을 갖고 공부하는 주니어 개발자입니다.