번들러를 Webpack만 사용하다가 Vite로 최근 넘어오면서 퍼포먼스 차이를 확연하게 체감했다. 번들러에 대해서 따로 공부해보지 않았기에 이참에 정리해 보고 vite가 왜 빠른지 어떻게 번들링 되는지 정리하고자 한다. 본 글에서는 Webpack에 관한 디테일한 건 다루지 않고 단순 비교정도로 작성한다. 번들러란? 우선 번들러가 뭔지 알아보기 전에 번들러가 하는 일을 하지 않았을 때 문제부터 짚어보자. 중복네이밍의 Issue. 과거의 Web은 규모가 그렇게 크지 않았다. 그렇기에 적은 인원이 작업했고 코드 컨벤션이 없거나 지금처럼 버전관리를 하지 않는 상태로 각자의 개성에 맞게 함수나 파일명을 네이밍 했다. 하지만 Web의 규모가 커지게 되면서 문제가 생기기 시작했다. 각각 다른 파일에서 작업이 이루어지..
API를 만드는 도중 Axios를 통해 POST 하는 과정에서 왜 데이터를 헤더에 다 안 보내고 굳이 Body에 싣어서 날릴까 의문이 들었다. 그냥 헤더에 다 때려박으면 안될까 싶어서 찾아봤다. 아무래도 데이터크기 이슈가 있지 않을까 찾아봤는데 일단 정답은 HTTP 스펙상 헤더의 크기제한은 없다. 하지만 우리가 사용하는 엔진에서 이를 제한하고있다. 엔진에서 제한하는 기본 스펙은 아래와 같다. 아파치 - 8K Nginx - 4K-8K IIS - 8K-16K 톰캣 - 8K – 48K 노드(13) - 16K 엔진별로 헤더 크기를 바꾸거나 일부 엔진은 제한을 풀 수 있는 기능을 제공하지만 제한되지 않은 HTTP 헤더 크기는 서버를 공격에 노출시키고 유기적 트래픽을 제공하는 용량을 감소시킬 수 있기에 추천하지 않..
회원가입 기능을 구현하다가 문득 본인 인증이 필요했다. 아무래도 1인 1계정 이어야 할 서비스에서는 이메일 인증보다는 문자인증이 좀 더 완성도를 높여 줄것이다. 문자 인증 방식도 은근 종류가 많고 아래로 내려 갈수록 요금이 비싸다. 카카오 알림톡 카카오톡 사용자라면 플러스 친구에게 매일 같이 받는 그 카카오톡 메시지다. SMS 단문 문자 최대 80자 내외 LMS 장문 문자 우리가 문자 보낼 때 80자 넘어가면 전환되는 그 LMS가 맞다. MMS 미디어 문자 이미지나 파일 첨부등이 MMS다. 이번 포스팅에서는 간단하게 인증번호만 발송 할 예정이기에 SMS 인증으로 진행한다. 방식은 다 비슷하거나 같다. 간단하니 걱정말고 10분만 투자하자. COOLSMS에서 API KEY 발급받기 발급 받은 KEY와 SDK..
스포츠와 마찬가지로 어느 분야든 시간에 예민하다. 일반적인 스포츠라면 길어야 0.01초 단위까지 측정한다. 하지만 프로그램은 때에 따라서 ms(1/1000초)단위는 기본이고 ns 단위까지도 따져야하는 경우가 생긴다. JS에서 처음 시간을 측정할 때는 아래와 같은 방법을 사용했다. const MAX = 100_000_0000; console.log("Date.now() 사용"); for(let i = 0; i > ', end - start); } // /////////////////////..
