본문 바로가기

JavaScript

(2)
Event Loop와 Task Queue의 동작 시각화 setTimeout의 실행 순서에 대해 이해하기가 쉽지 않았습니다. 또, Event Loop의 구조 전체를 시각적으로 파악하고 싶었지만, 자료를 찾기 쉽지 않았습니다. 저와 같이 Event Loop가 머릿속에 그려지지 않는 분들에게 이 글이 조금이라도 도움이 되었으면 합니다. Event LoopJavaScript는 초기에 한 번에 하나의 작업만 처리하도록 설계되었습니다. 하지만 시간이 지나고, 여러 가지 작업을 동시에 처리할 일들이 생기기 시작했습니다. 이벤트루프는 이런 비동기 처리를 지원합니다. 간단히 말하면, Task Queue에 있는 작업을 Call Stack으로 이동시키는 역할을 합니다. 그리고 좀 더 상세하게는 다음과 같습니다.Task Queue에 작업이 있으면, Call Stack이 비었는지 ..
Failed to load module script - ViteJS Typescript 문제 발견 Vite + Vanilla JS를 이용해서 간단한 웹을 개발했습니다. 하지만, github pages로 배포하는 과정(참고 문서)에서 아래 이미지와 같은 이슈가 발생했습니다. 에러 내용을 확인해 보니, 브라우저가 index.html에 있는 script 태그를 읽지 못했습니다. 그래서 main.js에 작성되어 있던 js 로직과 import 된 css를 읽지 못했고, style과 사용자 인터렉션이 하나도 없는 깡통 html만 렌더링 되었습니다. ...body tags 원인 파악과 해결 초기에는 github page가 레포지토리 이름으로 렌더링 되도록 설정했습니다. 이후 정상적으로 배포되는 걸 확인한 후, url이 github.io로 끝나도록(https://{username}.github.io) 변..