비동기4 Module System 목차1. JavaScript 모듈이 왜 등장했을까2. 모듈 시스템의 발전 흐름 (CommonJS > AMD -> UMD -> ESM)3. 마치면서.. (다음 글 예고) 1. JavaScript 모듈이 왜 등장했을까 모듈이 왜 등장했는지부터 알아보자. 그러려면 초창기 JavaScript가 어떤 식으로 사용되었는지부터 알아야 한다. 초기에는 작은 규모의 스크립트만 작성했기 때문에 전역 스코프가 기본적으로 적용되었다. 모든 변수와 함수는 기본적으로 전역 공간에 저장되었고, 이에 따라 서로 다른 스크립트에서 같은 이름의 변수나 함수를 정의하게 되면, 하나가 다른 것을 덮어쓰는 문제가 발생했다. 그러다 보니 유지보수가 심각하게 어려워졌다. 나도 vanilla js로 개발한 첫 프로젝트에서 같은 문제를 맞닥뜨린 .. 2024. 8. 20. React의 최적화 전략 목차- 프롤로그- 렌더링 최적화 기법- 상태 관리 및 업데이트 최적화- 로딩 성능 최적화프롤로그 지난번에는 리액트를 왜 쓰는지에 대해 브라우저의 렌더링 원리부터 리액트의 특징까지 알아보았다. 이렇게나 잘 만든 라이브러리인데 장점을 최대한 살려 코드를 짜야하지 않을까? 이번에는 최적화를 어떻게 하는지 알아보자! 프로젝트 5개 하고 돌아보는 React를 쓰는 이유목차 - 프롤로그 - SPA - 브라우저의 렌더링 원리 - React의 렌더링 과정 - React의 특징 3가지 - React+TypeScript 프롤로그 나의 2023년은 프로젝트로 가득했다. 7~8개월 동안 vanilla JS, React, React Native를 이용hwanheejung.tistory.com렌더링 최적화 기법#불필요한리렌더.. 2024. 4. 11. JavaScript가 비동기를 다루는 방법 목차- 프롤로그- 자바스크립트의 실행 모델- Callback: 비동기 처리의 기본- Promise: 비동기 처리의 진화- async/await: 비동기 처리의 현대적 접근- 병렬 비동기 작업 처리 - 이벤트 루프와 비동기 프로그래밍의 깊은 이해- Web Workers와 멀티 스레딩- 결론프롤로그요즘 시간이 남을 때마다 기술면접에 대한 답변을 써보고 있는데 내가 얼마나 이론이 부족한 채로 코드만 치고 있었는지를 체감하고 있다.. 프로젝트를 하며 async/await를 수백, 수천번 썼지만 "Promise가 뭐예요?", "promise와 async/await의 차이가 뭐죠?"와 같은 질문에 대답이 술술 나오지 않는 나 자신을 보고 약간의 충격에 빠졌다. 잘 알지도 못하면서 별생각 없이 기계처럼 쓰고 있었구나.. 2024. 4. 5. 프로젝트 5개 하고 돌아보는 React를 쓰는 이유 목차 - 프롤로그 - SPA - 브라우저의 렌더링 원리 - React의 렌더링 과정 - React의 특징 3가지 - React+TypeScript 프롤로그 나의 2023년은 프로젝트로 가득했다. 7~8개월 동안 vanilla JS, React, React Native를 이용한 팀프로젝트만 5개를 했더라. 프로젝트를 하면 확실히 해당 기술의 숙련도를 빠르게 향상할 수 있고, 무엇보다 재밌다. 그리고 해당 프레임워크의 장단점을 몸으로 느끼며 그 단점을 보완하기 위해 어떤 또 다른 기술이 등장했는지 흐름을 파악하기에는 프로젝트만 한 것이 없다. 하지만 눈앞에 놓인 기능 구현에만 집중하다 보면 "진짜 공부"를 놓칠 때가 많다. 예를 들어 React의 렌더링 과정에 대해 알고 코드를 치는 사람과 모르고 치는 사람.. 2024. 4. 4. 이전 1 다음
