CDN이란 CDN의 개념 CDN은 Content Delivery Network의 약어로, 전 세계에 분산되어 있는 서버 네트워크입니다. CDN은 사용자가 리소스를 다운로드 할 수 있는 대체 서버 노드를 제공하여 동작합니다. 이러한 노드는 전 세계에 퍼져있기 때문에 지연 시간 감소로 인해 컨텐츠의 빠른 응답과 다운로드 시간을 제공함으로써 사용자에게 더 가까운 전략적 이점을 제공합니다. CDN의 장점 웹 사이트 로딩 속도 개선 인터넷 회선 비용 절감 컨텐츠 제공의 안정성 웹 사이트 보안 개선 CDN의 작동 원리 최초 요청은 서버로부터 컨텐츠를 가져와 고객에게 전송하며 동시에 CDN 캐싱 장비에 저장합니다. 두 번재 이후 모든 요청은 CDN 업체에서 지정하는 해당 컨텐츠 만료 시점까지 CDN 캐싱 장비에 저장..

SPA(Single Page Application)란 SPA의 개념 SPA(Single Page Application)이란 정적 파일을 한 번에 모두 다운로드 받고, 이후 사용자와의 상호작용 가운데 필요한 데이터만 서버에서 동적으로 받아 트래픽의 총량을 줄이는 애플리케이션의 형태입니다. 웹의 사용성, 속도 향상의 이점을 가지므로 모바일 퍼스트 전략에 부합합니다. SPA의 장점 서버에 들어가는 요청이 적음 개발이 간단하고 능률적 네트워크 작업을 모니터링하고 페이지 요소 및 이와 관련된 데이터를 조사할 수 있기 때문에 크롬에서 디버그가 쉬움 어떤 로컬 저장소라도 효율적으로 캐시할 수 있음 프론트엔드와 백엔드 분리로 인한 개발업무 분업화 및 협업이 용이함 SPA의 단점 모든 정적 리소스를 한번에 다운로드하기 ..

좌변을 가공하지 않기 DB 인덱스를 사용할 수 없는 경우 인덱스 컬럼이 비교되기 전에 변형이 일어나는 경우 부정형으로 조건을 기술(not)한 경우 인덱스 컬럼이 NULL로 비교되는 경우 옵티마이저가 필요에 다라 상기 적용원칙을 준수했음에도 불구하고 특정 인덱스의 사용을 취사선택함으로써 사용되지 않는 경우 위와 같은 경우에 인덱스를 사용할 수 없습니다. 그렇기 때문에 DB 컬럼을 가공하지 말고 상수 부분을 가공해서 사용하도록 작성합니다. 잘못된 경우 -- 인덱스 컬럼에 변형이 일어났기 때문에 인덱스 사용이 불가 SELECT dept , ename , sal FROM emp WHERE SUBSTR(job, 1, 4) = 'SALE' 바람직한 경우 SELECT dept , ename , sal FROM emp..

Webpack이란 Webpack의 등장 이유 규모가 큰 시스템에서는 많은 Javascript가 존재합니다. 이 많은 Javascript 파일을 하나로 관리하기에는 어려움이 있습니다. 그렇다고 여러 개의 파일을 브라우저에서 로딩하는 것은 네트워크 비용이 커지면서 반응 속도가 느려지게 됩니다. 더 나아가 각 파일 변수의 충돌 위험성도 존재하게 됩니다. 이를 해결하기 위해 Webpack이 등장하게 되었습니다. Webpack의 개념 Webpack은 Javascript Application의 Static Module Bundler입니다. Webpack이 실행되면 Dependencies Graph를 통해 필요한 형태의 하나 또는 여러 개의 Bundle로 생성합니다. Module: 프로그램을 구성하는 구성 요소의 일..

Chunk란 Spring Batch에서 Chunk란 데이터 덩어리로 작업할 때 각 커밋 사이에 처리되는 row 수를 의미합니다. 즉 Chunk 지향 처리란, 한 번에 하나씩 데이터를 읽어 Chunk라는 덩어리를 만든 뒤, Chunk 단위로 트랜잭션을 다루는 것을 의미합니다. 여기서 Chunk 단위로 트랜잭션을 수행하기 때문에 실패할 경우에는 해당 Chunk 만큼만 롤백이 되고, 이전에 커밋된 트랜잭션 범위까지는 반영이 된다는 것입니다. Chunk 지향 처리의 구조 Reader에서 데이터를 하나 읽어옵니다. 읽어온 데이터를 Processor에서 가공합니다. 가공된 데이터들을 별도의 공간에 모은 뒤, Chunk 단위만큼 쌓이게 되면 Writer에 전달하고 Writer는 일괄 저장합니다. Reader와 Pro..

Promise란 Promise의 개념 Promise는 자바스크립트 비동기 처리에 사용되는 객체입니다. jQery ajax 코드 function getData(callbackFunc) { $.get('url 주소/products/1', function(response) { callbackFunc(response); // 서버에서 받은 데이터 response를 callbackFunc() 함수에 넘겨줌 }); } getData(function(tableData) { console.log(tableData); // $.get()의 response 값이 tableData에 전달됨 });Promise 코드 function getData(callback) { // new Promise() 추가 retu..