전체 글 80

동기 처리 방식 vs 비동기 처리 방식

동기 처리방식은 현재 실행 중인 태스크가 있다면 다음에 실행될 태스크는 현재 실행 중인 태스크가 종료될 때까지 기다렸다가 처리하는 방식이다. 이 와는 반대로 비동기 처리 방식은 현재 실행중인 태스크가 종료되지 않은 상태라 해도 다음 태스크를 곧바로 실행하는 방식이다. 동기 방식의 장점과 단점: 동기 처리 방식은 태스크를 순서대로 하나씩 처리하므로 실행 순서가 보장된다는 장점이 있지만, 앞선 태스크가 종료할 때까지 이후 태스크들이 블로킹 된다는 단점이 있다. 비동기 방식의 장점과 단점 : 비동기 처리 방식은 현재 실행 중인 태스크가 종료되지 않은 상태라 해도 다음 태스크를 곧바로 실행하므로 블로킹이 발생하지 않는다는 장점이 있지만, 태스크의 실행 순서가 보장되지 않는 단점이 있다. 이미지 출처 : http..

async vs defer

브라우저는 html, css, javascript순서로 파싱을 한다. 웹 브라우저는 기본적으로 동기적인 실행을 하기 때문에 중간에 다른 파일이 파싱을 시작하면 파싱이 끝날 때까지 기다려야 해서 성능상 문제가 발생할 수 있다. 일반적인 파싱 방법 1. HTML 파싱을 진행하다가 script 태그를 만나면 html파싱을 중지한다. 2. script파일을 파싱하고 파싱이 완료되면 실행한다. 3. script파일의 파싱이 완료된 후에 html파싱을 다시 진행해 완료한다. 따라서 일반적으로 script 태그를 html태그 맨 마지막 부분에 넣어 html 파싱을 마친 후 script 태그를 실행하도록 한다. 하지만, 사용자 입장에서 javascript로 구현한 성능을 경험하기까지 시간이 소요될 것이고, 이는 사용자..

Http와 Https 통신 방식의 차이

http 방식은 네트워크상에서 정보를 누군가가 마음대로 열람, 수정이 가능하다. www상에서 웹 서버와 브라우저가 하이퍼 텍스트 데이터를 주고 받기 위한 통신 프로토콜로, 기본 TCP/IP 포트로 80포트를 사용한다. 데이터를 단순 텍스트 형태로 주고 받기 때문에 네트워크에서 전송 신호를 가로채는 경우 윈치 않는 데이터 유출이 발생할 수 있다. 즉, 보안에 취약하다. https는 http의 보안문제를 해결하기 위해 SSL(= TLS)(인터넷에서 데이터를 안전하게 전송하기 위한 통신 프로토콜)을 도입하였다. 공개키를 공개하여 클라이언트 측에서 암호화된 데이터를 서버로 보내면 서버가 비밀키로 복호화 한다. TLS는 데이터 무결성을 제공하여 데이터가 전송 중에 수정되거나 손상되는 것을 방지하고 사용자가 자신이..

브라우저 렌더링 과정

- 브라우저 주소창에 주소를 입력한다. - DNS(네트워크에서 도메인이나 호스트 이름을 숫자로 된 ip 주소로 해석해주는 서비스)가 해당 서버가 어디있는 지 찾아서 연결해준다.(https가 붙었다면 https방식으로 통신한다.) - 서버에서 index.html파일을 클라이언트로 전송한다(서버의 기본 설정이 대부분 index.html로 되어있다.) - 브라우저에서 index.html을 파싱한다. - 한줄씩 DOM트리를 만들어 간다. - 중간에 link태그를 만나 css요청이 발생하면, 요청과 응답과정을 거치고 css를 파싱한다. - CSS파싱이 끝나면 중단된 html을 다시 읽고 DOM트리를 완성한다. - 완성된 DOM트리와 CSSOM트리를 합쳐 Render Tree를 만들고 그린다. (여기서는 스타일 정..

[프로그래머스]기능개발(javascript)

lv.2 난이도의 문제이다. 큐를 이용해서 문제를 해결했다. 100에서 progress 값을 빼주고 speeds로 나눴을 때, 나머지가 0이 아니면 num(기능이 완성되는데 걸리는 일수)에 +1를 해주었다. 그리고 Math.floor를 통해서 num를 내림 처리해주었다. 자바스크립트는 기본적으로 실수 소수점으로 값을 반환하기 때문에 내림처리를 해주지 않으면 정말 그대로 실수로 값을 저장한다.

알고리즘 풀이 2021.07.27

[프로그래머스]문자열 압축(javascript)

프로그래머스 lv.2 문제이다. 처음에는 첫 반복문을 i를 1부터 s.length까지로 설정하고, j에 num대신 i를 더하도록 했지만, 테스트 케이스 5에서 계속 통과를 하지 못했다...질문하기에서 알아보니, 테스트케이스 5에서는 문자열 하나만 들어와서 i=1로 설정하면 s.length도 1이되어 애초에 반복문 자체를 수행할 수 없게된 것이었다.

알고리즘 풀이 2021.07.27