1. 자바스크립트는 싱글 스레드다 2. 자바스크립트 내부적으로 일부 시간이 걸리는 기능은 대기실로 잠시 이동 후 스택이 다 끝나고 queue에서 실행된다(비동기 실행) 3. 따라서 시간이 오래걸리는 기능이 있으면 해당기능 때문에 마비가 걸리므로 주의가 필요하다 *1. Javascript 로 만든 node.js의 경우 무거운 기능이 생기면 성능이 크게 떨어진다 *2. 따라서 일부 javascript로 만든 무거운 프로그램(게임 등)들은 앞에 로딩시간을 넣는다
여기 댓글보면 개발자들의 자뻑이 참 문제라는걸 알수 있음. 뭐냐면, 자기가 스택, 큐를 현업에서 쓰고 작동방식을 알고 있으니깐 스택 큐가 뭔지 알고 있다고 착각하는 개발자들이 대량으로 보인다는 점임. 프로그래밍을 하면 이런 경우가 있음. 자기가 쓰고 있으면 그거에 대해 100%마스터 했다고 착각하게 되는 케이스가 있는데, 사실 그걸 현업에서 쓰고 있다고 해서 그게 뭔지 진짜로 완벽히 파악하고 있는건 아님. 예를들어 나는 30년 가까이 퍼스널 컴퓨터를 사용하고 있지만 아직도 cpu에서 기계어가 어떻게 반영되는지를 모름. 그냥 내가 코딩 하면 그게 기계어가 되서 뭐 잘 모르는 어쩌고 저쩌고가 발생한다고 이해하고 있고, 앞으로도 그럴거임. 대부분의 개발자들은 기계어를 써서 코딩하라고 시키면 못할테지만, 자기가 기계어라는걸 이해하고 있다고 착각하고 있는 개발자들은 많을것임. 개발하면서 개발자에게 가장 중요한 능력은 그냥 알고 있는거와 알고 있는걸 어디까지 이해하고 있느냐 이 둘의 경계를 정확히 파악하는 것임. 특히 내가 뭘 어떻게 모르고 있냐를 파악하는게 아주 중요한데, 왜냐면 알고 있고 쓰고 있다고 해서 이해했고 파악까지 했다고는 할수 없는 경우가 많고, 내가 뭘 어디까지 모르느냐를 파악해야 나중에 가서 내가 뭘 어디까지 할수 있고 갈수 있느냐라는 견적이 가능해짐. 참고로 난 7년 가까이 자바스크립트를 썼는데 브라우져에서 이런 동작 하는거 이 영상 보고 처음암. 그리고 개념적으로 뭔 OS와 미들웨어가 있고 브라우져는 어플리케이션이네 뭐 어쩌네 하는 소린 많이 들었는데 미들웨어가 뭔진 아직도 이해가 안됨. 알고 이걸 개발에서 인지하고 쓸 일은 있어도 아마 이걸 이해하게 될 일은 영원히 안 올듯.
사실 이런건 개발할 때는 딱히 체감이 막 되거나 하진 않아요. 왜냐면 애초에 정상적인 프로그래밍 흐름을 따른다면 저런 오류를 마주할 일이 없거든요. 그런데 처음부터 옳은 길만 갔기 때문에 발생이 안되는 것과, 저런 오류가 있을 수도 있구나 라는걸 알고 피하는건 다른거니까요. 좋은 영상 감사합니다.
바닐라 JS가 아닌, JS 런타임을 가진 노드는 싱글 스레드가 맞긴 한데 컴퓨팅이 필요한 작업들은 libuv 를 통해서 worker thread 에 할당하고 병렬 실행해요. 이걸 non-blocking io 라고 하고 단순하게 ‘싱글 스레드라서 느려’ 라고 말하는건 맞는 말은 아닐수 있어요!
stack에서 코드 그림이 FILO 선입후출에 의해 reverse 되어야 더 정확합니다. 강사님이 stack에서 처리 순서를 쉽게 설명하려고 위에서부터 그린거 같아요. 실제로는 스택 제일 밑바닥에는 가장먼저 실행된 함수가 쌓입니다. 이후 가장 늦게 쌓인 실행 스택이 컨텍스트에서 하나씩 제거 됩니다
저 이제 이영상 봤는데 자바 Thread.sleep( ) 이라는 함수랑 매우 비슷한거 같아요. setTimeOut 이란게 쉬었다가 실행하는 거여서 setTimeOut 1초를 하면 1초뒤에 실행한다는 뜻이고 엄청 바쁜 연산을 걸어둔다는것은 1초뒤에 실행하되 엄청 오래걸리는 실행이라는 뜻인거같아요
쉬운 설명 감사합니다!! C/C++도 이런 설명이 있었으면 좋겠으나... 채널 가보니 웹코딩 전문 채널이네요 ㅜㅜ 혹시 Memory Leak 잡는 방법에 대해서도 영상 만들어주실 수 있을까요?? 인트라넷에서 운용하는 웹페이지가 오래 켜두면 점점 느려지다가 뻗어버리는거 봐선 Memory Leak이 있는거 같은데 제가 웹 코딩을 체계적으로 배운게 아니다보니 어디서부터 어떻게 디버깅을 해야할지 모르겠네요 ㅜㅜ 그리고 파이어폭스보다 크롬에서 더 버벅이는거 같은데 웹 브라우저마다 리소스 관리 측면에서 비교도 해주시면 유용할 것 같습니다!!
마지막에 이런 거 몰라도 되요. 알아서 뭐해 라고 하시는데 은근히 아는 거 많으면 쓸데 많죠 ㅋㅋㅋㅋㅋㅋ 개발자로 일해보신 분들은 아시겠지만 일하다 보면 이러한 지식들을 직접 얘기해줘야 할 상황이 생기는데 그 대상은 설계를 맡은 사수한테 개발을 맡은 부사수 입장에서 설명 해주거나 현업이 물어보면 대답해줘야 하고, 아는 체하는 동료에게 한방 맥이기 위한 설명이 될 수도 있죠. 진짜 개발자는 개발만 열심히 하면 되는데 가끔 지식 싸움도 해야 하는 불편한 현실이 참 안타깝습니다 ㅠ
영상 감사합니다.영상을 몇번보고 이해하는데 도움이 많이 되였습니다. 여기서 약간의 오류가 있는거 같습니다. stack 가 없어야 queue의 함수(microtask,미크로)가 stack 로 들어가고 stack와 queue 에 동시에 함수가 없을때 대기실 하나의 함수(macrotask,매크로)가 stack로 이동합니다.그리고 다른 대기실 함수는 또다시 stack와 queue 비는것을 기다릅니다. 이벤트 함수는 우선적으로 대기실 앞쪽으로 이동할수 있습니다.
질문이 있습니다. console.log(1+1);setTimeout(function(){ console.log(2+2)},1000);setTimeout(function(){ console.log(3+2)},1000); 이렇게 콘솔에 입력했을경우, 2가 나오고 1초뒤에 4,5가 같이 나오는데 각각 1초뒤에 4와 5가 나오게 하려면 무조건 setTimeout(function(){ console.log(3+2)},2000); 이렇게 구현해야하는건가요??
event loop moves tasks in the callback queue to the stack(when stack is empty) to be executed, async tasks are first sent to the callback queue(first in first out) call stack is somewhere code is executed in last in first out order Javascript is a single threaded & non-blocking language only have one call-stack
이를 이해하려면 '실행 컨텍스트'라는 개념을 찾아보시면 될 것 같습니다. 보통 코드의 실행 흐름은 위에서부터 아래로 진행되는 게 기본인건 아실겁니다. 댓글에서 말씀해주신 부분이 아마 이를 언급하신 것 같구요. 헌데 코드의 흐름을 바꿀 수 있는 요소들이 있습니다. 예를 들면 일반 함수들, 조건문, 반복문 등등. 코드를 순차적으로 진행하다가 이들을 만나면 해당 코드 블럭 안으로 코드의 흐름이 바뀝니다. 이 때 실행 컨텍스트의 개념이 등장합니다. 예를 들어 함수를 만났다고 한다면, 자바스크립트 엔진은 함수 내부의 코드를 평가하여 실행 컨텍스트를 생성하고 이를 실행 컨텍스트 스택에 푸시(push)합니다. 그리고 함수 내부의 코드가 종결될 때 비로소 원래 진행되고 있던 코드로 돌아가 나머지 후순의 코드들을 실행하게 되는거죠. 우리가 흔히 스택의 후입선출은 이러한 실행 컨텍스트 방식을 지칭하는 것 같습니다. 좀 주저리주저리 말이 길었는데 궁금했던 부분과 맞았으면 좋겠네요. 제가 아는대로 써봤는데 잘못된 부분도 있을 수 있으니 참고만 하시면 될거같아요. 화이팅입니다~
