✅ 트리 순회(Tree Trabersal)란? 트리 순회는 트리 구조에서 각각의 노드를 정확히 한 번만, 체계적인 방법으로 방문하는 과정을 말한다. 이진트리뿐만 아니라 모든 트리에서도 일반화될 수 있다. 트리를 순회하는 데는 두 가지 전략이 존재한다. 너비 우선 탐색(BFS, Breadth-first Search) 깊이 우선 탐색(DFS, Depth-first Search) 🤔 너비 우선 탐색(BFS, Breadth-first Search) 루트 노드에서 시작해서 인접한 노드를 먼저 탐색하는 방법이다. 👍 BFS 특징 두 노드 사이의 최단 경로를 탐색할 때 활용하기 좋은 방식. 멀리 떨어진 노드는 나중에 탐색하기 때문이다. 큐를 활용해서 탐색할 노드의 순서를 저장하고 큐에 저장된 순서대로 탐색한다. 🔥 ..
✅ 트리(Tree)란? 부모와 자식 관계를 가진 노드로 구성된 데이터 구조이다. 리스트는 선형구조이다. 한 가지가 있고, 그다음에 하나 그다음에 하나 이런 식으로 모든 것이 한 줄로 늘어서 있다. 트리는 비선형구조로 여러 가지들로 뻗을 수 있다. 그리고 트리는 부모가 자식을 가리키는 형태이지 형제를 가리키거나 자식이 부모를 가리키면 안 된다. 루트(Root) - 트리의 최상위 노드. 자식(Child) - Root로부터 멀어지는 방향으로 다른 노드와 직접적으로 연결된 노드. 부모(Parent) - 자식의 반대 개념. 형제(Siblings) - 같은 부모를 가지는 노드들의 그룹이다. 리프(Leaf) - 자식이 없는 노드. 간선(Edge) - 한 노드에서 다른 노드로 향하는 화살표이다. 노드와 노드를 연결한다..
✅ 스택(Stack)이란? 가장 마지막으로 들어간 데이터가 가장 첫 번째로 나오는 성질(LIFO, Last In First Out, 후입선출)을 가진 자료구조이다. 스택은 가장 먼저 추가된 것이 가장 마지막에 제거되는 하나의 방식으로 그러한 구조를 만드는 방법은 여러 가지가 있다. 배열로 스택을 만든다고 가정하면, push와 pop메소드를 이용해 맨 마지막에 데이터를 삽입하고, 맨 마지막 데이터를 삭제하는 구조가 갖춰진다. unshift와 shift도 마찬가지이지만 비효율적이다. 그렇지만 사실 효율성만 따질 때는 배열을 스택으로 이용하지 않는 경우가 더 많다. 왜냐하면 인덱스 기반으로 정보에 접근할 필요가 없으니 인덱스들을 전부 다 가지고 있을 이유가 없다. 재귀적인 함수, 알고리즘에 사용되며 웹 브라우..
✅ 최대공약수(GCD, Greatest Common Divisor)최대공약수는 두 수 A와 B의 공통된 약수 중에 가장 큰 정수이다.const getGCD = (num1, num2) => { let gcd = 1; for(let i=2; i2부터 시작하여 두수 중 작은 수만큼 i를 반복한다.num1, num2를 i로 나눈 나머지가 0일 경우 i가 gcd에 들어가고 반복한다. 루프가 종료되고 최대 공약수인 gcd를 반환한다.✅ 최소공배수(LCM, Least Common Multiple)두 수, 혹은 그 이상의 여러 수의 공통인 배수 중 가장 작은 수이다.const getLCM = (num1, num2) =>{ let lcm = 1; while(true){ if((lcm % n..
원문을 토대로 작성하였습니다. - https://www.builder.io/blog/the-definitive-guide-to-image-optimization ✅ 이미지 최적화(Image optimization)란? 가장 작은 크기를 유지하면서 최고 품질의 이미지를 제공하는 과정이다. 즉, 이미지를 최적화하면 최적의 형식, 크기, 해상도로 이미지를 만들고 화면에 표시하여 사용자 참여를 높일 수 있다. 🤔 이미지 최적화를 하는 이유 선명하고 아름다운 이미지는 좋은 사용자 경험 제공을 위한 핵심요소이지만 품질을 위해 속도를 희생할 수 없고, 반대의 경우도 마찬가지이다. 이미지 최적화의 이점 사용자 경험 향상: 사용자들은 이미지가 로드될 때까지 기다리려고 하지 않는다. 그리고 중요하거나 긴급한 콘텐츠를 포함..
시작하기에 앞서 👉 를 읽고 시작하면 좋다. Part. Opportunity 이번에 최적화를 시도해볼 부분은 바로 Reduce unused JavaScript이다. 사용하지 않는 JS를 줄이라고 한다. 사진 아래 내용을 확인해보면, 이 제안들은 page load을 빠르게 하는데에 도움을 줄 수 있지만 성능 점수에 직접적인 영향을 주지는 않는다고 한다. 일단 개선이 필요한 부분이기에 시도해보자. ✅ 1. Reduce unused JavaScript Chrome DevTools의 Coverage 탭은 사용하지 않는 JavaScript 및 CSS 코드를 찾는 데 도움이 될 수 있다. Usage visualization(사용시각화) 탭의 빨간색 부분이 사용하지않는 ..
목표 양방향 연결 리스트의 정의 단방향 연결 리시트와 비교하기 양방향 연결 리스트의 기본적인 기능 구현하기 ✅ 양방향(이중) 연결 리스트(Doubly Linked List)란? 노드가 이중으로 즉, 양방향으로 연결되어 있는 리스트를 말한다. 단일 리스트와 달리 포인터가 추가되므로 메모리가 더 사용 된다. 구현 기본적인 뼈대 class Node { constructor(val) { this.val = val; this.next = null; this.prev = null; } } class DoublyLinkedList { constructor() { this.head = null; this.tail = null; this.lenght = 0; } } prev 속성이 추가되었다. 🟢 1. Push 리스트의..
해당 내용은 2023년 01월 28일 React Docs BETA 버전을 토대로 작성되었습니다. - 링크 ✅ useRef란? 렌더링에 필요하지 않은 값을 참조할 수 있는 React Hook이다. 여기서 Ref는 reference, 즉 참조를 뜻한다. 값을 참조하고 DOM을 조작하는 데에 주로 사용된다. 참조란? 객체의 실제 위치를 가리키는 포인터이다. 실제 값이 아닌 메모리 공간의 주소를 가진다. const ref = useRef(initialValue) 매개변수 initialValue: 참조하려는 ref 객체의 current property의 초기 값이다. 반환 단일 속성(current)을 가진 객체를 반환한다. current: 처음에는 매개변수로 받은 초기 값으로 설정되어 있고, ref 객체를 JSX..
