HTTP/1.1의 단점 HOL(Head Of Line) Blocking HTTP/1.1은 위의 그림과 같이 기본적으로 하나의 연결에 하나의 요청을 처리하도록 설계되어 있습니다. 그래서 동시 전송이 불가능하고 요청과 응답이 순차적으로 이루어지게 됩니다. 그렇다보니 HTTP 문서 안에 포함된 다수의 리소스를 처리하려면 요청할 리소스 개수에 비례해서 대기 시간이 길어지게 됩니다. 그리고 아래의 그림과 같이 여러 번의 요청을 했을 때, 앞선 요청에 문제가 있어서 응답이 늦어지면 다음 응답도 같이 늦어진다는 문제점도 발생합니다. RTT(Rount Trip Time)증가 앞서 말한 것처럼 HTTP/1.1의 경우 하나의 연결에 하나의 요청을 처리합니다. 이렇다 보니 매번 요청을 할 때마다 새로 연결을 만들게 되고 T..

DOM이란 DOM은 Document Object Model의 약자로, 구조화된 문서를 표현하는 방법을 말합니다. HTML, XML 등에서 데이터를 표현하거나 상호작용하는데 사용됩니다. 웹 브라우저는 DOM을 사용하기 때문에 우리는 JavaScript와 CSS를 사용해서 상호작용할 수 있습니다. 브라우저의 작업 흐름 (1) DOM Tree가 생성됨 - 브라우저가 HTML 파일을 수신하면 렌더 엔진은 해당 파일을 구문 분석하고 HTML 요소와 1:1 관계를 가지는 Node의 DOM Tree를 생성합니다. (2) Render Tree가 생성됨 - 인라인 스타일 구문과 외부 CSS 파일의 스타일이 구문 분석이 되며, DOM Tree의 node와 함께 Render Tree를 만드는데 사용됩니다. (3) Layou..

SSL이란 SSL(Secure Socket Layer)이란 웹 서버와 브라우저간 통신의 보안을 위해 만들어진 프로토콜입니다. SSL은 Certificate Authority라 불리는 서드 파티로부터 서버와 클라이언트의 인증을 하는데 사용됩니다. SSL 통신은 공개키 암호화 방식과 비공개키 암호화 방식을 조합해 사용합니다. SSL에서는 통신을 수행할 때 먼저 통신 상대의 인증서를 체크함으로써 위장 여부를 확인합니다, 이 때, 인증서 체크는 공개키 암호화 방식에 기초한 것입니다. 공개키 암호화 방식은 처리 부하가 크기 때문에 대량 데이터 전송이 어렵기 때문에 SSL에서는 먼저 공개키 암호화 방식으로 비공개키를 암호화하여 통신 상대 사이에서 안전하게 비공개키를 배송합니다. 그리고 실제 대이터는 비공개키 암호화..

Https란 Http의 약점 Http는 웹에서 사용되는 심플하면서도 중요한 기술이지만 치명적인 단점이 있습니다. 아래의 그림과 같이 브라우저와 웹 서버가 통신함에 있어서 주고 받는 데이터가 암호화 되지 않고 그대로 전송된다는 점입니다. Http는 인터넷을 통해 웹 서버와 브라우저가 통신하는데, 해커가 중간에 도청하게 된다면 중요한 정보들을 탈취할 수 있습니다. 만약 이러한 데이터가 로그인 기능에서 사용하는 아이디, 비밀번호나 개인 정보와 관련된 데이터라면 치명적일 수 있습니다. 뿐만 아니라 정상적인 데이터를 중간에서 악의적으로 변조시킬 수도 있습니다. Https란 Https는 데이터가 암호화 되지 않는 Http의 단점을 극복하기 위해 Http에 암호화나 인증의 기능을 가진 SSL을 추가한 기술입니다. H..

Vue.js란 Vue.js는 웹 페이지 화면을 개발하기 위한 프론트엔드 프레임워크입니다. Vue.js는 다른 프론트엔드 프레임워크보다 배우기 쉽다는 장점이 있습니다. React와 Angular라는 프레임워크의 장점들을 모아 더우 빠르고 가볍게 만든 프레임워크입니다. Vue.js의 특징 MVVM 패턴 위 그림에서 보이듯이, MVVC 패턴이란 화면을 모델(Model) - 뷰(View) - 뷰 모델(ViewModel)로 구조화하여 개발하는 방식을 의미합니다. 이러한 방식으로 개발하는 이유는 화면의 요소들을 제어하는 코드와 데이터 제어 로직을 분리하여 코드를 더 직관적으로 이해할 수 있고, 추후 유지 보수가 편해지기 때문입니다. 뷰(View): 사용자에게 보이는 화면 돔(DOM): HTML 문서에 들어가는 요소..

아호 코라식 알고리즘이란 아호 코라식 알고리즘은 문자열 S와 여러 개의 문자열 T가 주어졌을 때, T에 있는 문자열 중 하나와 S가 매칭이 되는지를 계산할 수 있는 알고리즘 입니다. 아호 코라식 알고리즘은 KMP에서 사용하는 Failure Function을 Trie에 확장시킨 알고리즘입니다. 아래의 예시를 통해 알아보겠습니다. 앞에서 말했듯이 아호 코라식 알고리즘은 트라이 구조를 이용해 동작합니다. 우선 기본 문자열들을 he, she, his, hers으로 설정하고 위의 그림과 같이 트라이를 만들어 줍니다. 그리고 S = "cdhisxy"일 때 어떤 문자열들이 들어있는지 확인해봅니다. 우선 앞에 존재하는 cd의 경우에는 일치하는 문자열이 없으니 스킵하겠습니다. 위의 세 그림을 확인해 보면 'his'라는 ..