본문 바로가기
반응형

전체 글

 (403)
[알고리즘/자료구조] 시간복잡도/공간복잡도/알고리즘/자료구조 시간복잡도 시간 복잡도(Time Complexity)란 알고리즘이 입력 데이터의 크기에 따라 얼마나 많은 시간(혹은 연산)이 소요되는지를 나타내는 것입니다. 자바스크립트에서도 이러한 시간복잡도를 계산하는 방법이 있습니다. 자바스크립트에서 시간 복잡도는 주로 Big O 표기법을 사용하여 표현합니다. Big O 표기법은 입력 크기에 따른 알고리즘 실행 시간 증가율을 나타내며, 가장 큰 항을 기준으로 표기합니다. 여기서 입력 크기란 일반적인 for 반복문 에서 배열의 길이를 의미하며, 검색 알고리즘에서는 검색해야 하는 데이터의 개수가 이에 해당합니다. 다음은 자바스크립트에서 자주 사용되는 시간 복잡도와 그에 해당하는 Big O 표기법입니다. O(1) : 입력 크기에 관계 없이 일정한 실행 시간을 가지는 알고리..
[Next.Js] useRouter() 훅의 프로퍼티 asPath 브라우저에서 실제로 보여지는 URL 경로를 나타내는 문자열입니다. 예를 들어, "/blog/post/123"과 같은 형식입니다. ** asPath 더 알기 더보기 asPath를 사용하면 현재 페이지의 실제 url 경로를 알 수 있기 때문에, 이를 기반으로 특정 동작을 수행할 수 있습니다. 예를 들어, 특정 경로에서만 컴포넌트를 렌더링하거나, 특정 경로에 따라 다른 데이터를 불러오는 등의 작업을 수행할 수 있습니다. 아래는 asPath를 사용하는 간단한 예시입니다. import { useRouter } from 'next/router'; function MyComponent() { const router = useRouter(); const path = router.asPath; //asPat..
[Next.JS] CSR, SSR, SSG 그리고 pre-rendering + ISR CSR(Client-Side Rendering, 클라이언트 사이드 렌더링) "클라이언트 측에서 모든 거 만든다." CSR은 클라이언트 측에서 JavaScript를 이용하여 동적으로 웹 페이지를 렌더링하는 방법입니다. 사용자가 페이지를 요청하면, 브라우저에서 JavaScript 파일을 다운로드하고 실행하여 페이지를 렌더링합니다. CSR은 초기 로딩 속도가 느리지만, 페이지를 로딩한 후에는 빠른 페이지 전환과 상호작용을 제공합니다. 예를 들어, React, Vue와 같은 프론트엔드 라이브러리와 프레임워크를 사용하는 경우 CSR을 적용할 수 있습니다. SSR(Server-Side Rendering, 서버 사이드 렌더링) "서버에서 HTML,JS,CSS 만들어서 클라이언트 측에게 전송한다." SSR은 서버 측에..
[단순용어] Nest.JS, Next.JS, Nust.JS / 정적 웹 애플리케이션 왜 다 비슷하게 이름을 지어서 헷갈리게 만드는지 원,, Nest.JS (백엔드-서버 전용-> 서버에만 집중) "nestjs"는 TypeScript로 작성된 Node.js 기반의 서버 사이드 프레임워크입니다. "nestjs"는 Angular와 같은 프론트엔드 프레임워크의 구조와 유사한 구조를 가지고 있으며, 의존성 주입, 모듈 시스템, 미들웨어 등의 기능을 제공합니다. Next.JS(리액트 기반 서버/프론트엔드 모두 지원) "nextjs"는 React를 기반으로 한 서버 사이드 렌더링 및 *정적 웹 애플리케이션 프레임워크입니다. "nextjs"는 React를 사용하여 클라이언트 측 및 서버 측 렌더링을 모두 지원합니다. 이를 통해 검색 엔진 최적화(SEO)와 성능 개선을 도모할 수 있습니다. Nust.JS..
[Node.js] 태스크 큐와 이벤트 큐 태스크 큐와 이벤트 큐 태스크 큐(Task Queue)와 이벤트 큐(Event Queue)는 비슷한 역할을 하지만 약간 다릅니다. 태스크 큐는 자바스크립트 엔진이 처리해야 할 작업들을 순서대로 담아놓는 대기열이며, 콜 스택이 비어있을 때 실행됩니다. 대표적으로 setTimeout, setInterval, setImmediate, requestAnimationFrame 등의 비동기 함수가 콜백 함수를 태스크 큐에 넣습니다. 반면에 이벤트 큐는 Node.js에서의 태스크 큐입니다. 이벤트 루프에서는 태스크 큐와 함께 이벤트 큐도 관리하며, 이벤트 루프가 처리해야 할 작업들을 담아놓습니다. 대표적으로 I/O 작업, 타이머, process.nextTick 등의 비동기 함수가 콜백 함수를 이벤트 큐에 넣습니다. ..
[Node.js] 노드에서 싱글 스레드/블로킹과 언블로킹/이벤트 루프 .../ 싱글 스레드 Node.js는 싱글 스레드 모델을 사용하는 JavaScript 런타임입니다. 이는 Node.js가 한 번에 하나의 작업만 처리할 수 있다는 것을 의미합니다. 하지만 Node.js는 비동기 I/O를 사용하여 작업을 처리하므로, 블로킹 작업이 발생하더라도 다른 작업을 처리할 수 있습니다. 이를 통해 Node.js는 높은 처리량을 달성할 수 있습니다. 또한 Node.js는 이벤트 루프를 사용하여 비동기 작업을 처리하며, 작업이 완료되면 콜백 함수를 호출하여 결과를 반환합니다. 이러한 방식으로 Node.js는 단일 스레드에서도 많은 요청을 처리할 수 있습니다. 그러나 CPU 집약적인 작업에 대해서는 성능이 떨어질 수 있으므로, 이러한 작업을 처리하는 데에는 멀티 스레드 또는 워커 프로세스 등의 다..
[Node.js] 컨텍스트/ 컨텍스트 스위칭 / 컨텍스트 스위칭 오버헤드 컨텍스트(context) | 현재 프로그램의 실행 상태에 대한 전반적인 정보 컨텍스트(Context)는 어떤 상황이나 조건에서 데이터나 프로그램이 실행되고 있는 상태의 전반적인 정보를 말합니다. 프로그램이 실행되는 도중에는 실행 위치, 레지스터 값, 메모리 값 등이 변경될 수 있습니다. 이러한 정보들을 모두 모아서 현재 실행되고 있는 상태를 나타내는 것이 컨텍스트입니다. 컨텍스트는 프로세스나 스레드의 실행 상태를 나타내는 정보이기 때문에, 컨텍스트 스위칭(Context Switching)이 발생할 때는 현재 실행 중인 프로세스나 스레드의 컨텍스트를 저장하고, 다음에 실행할 프로세스나 스레드의 컨텍스트를 불러옵니다. 이를 통해 운영체제는 여러 개의 프로세스나 스레드를 동시에 실행하고, 멀티태스킹(multi..
[Node.js] 스레드 풀 스레드 풀 노드(Node.js)에서 스레드 풀(thread pool)은 I/O 작업을 처리하는 데 사용되는 스레드의 집합입니다. 노드는 기본적으로 싱글 스레드로 동작하므로, 블로킹되는 I/O 작업(예: 파일 시스템 액세스, 네트워크 호출 등)을 처리할 때는 이러한 작업을 비동기적으로 수행하는 것이 중요합니다. 이를 위해 노드는 내부적으로 스레드 풀을 사용하여 I/O 작업을 비동기적으로 처리합니다. 노드의 스레드 풀은 기본적으로 4개의 스레드를 사용합니다. 이는 libuv 라이브러리에서 관리됩니다. 각 스레드는 I/O 작업을 처리하고, 작업이 완료되면 콜백 함수를 호출하여 결과를 반환합니다. 이렇게 함으로써, 노드는 I/O 작업을 비동기적으로 처리하면서도 블로킹되지 않고, 다른 작업을 처리할 수 있습니다...
반응형

티스토리툴바