devInfo

[프로그래머스 / C++] 피로도

문제 https://school.programmers.co.kr/learn/courses/30/lessons/87946 프로그래머스 코드 중심의 개발자 채용. 스택 기반의 포지션 매칭. 프로그래머스의 개발자 맞춤형 프로필을 등록하고, 나와 기술 궁합이 잘 맞는 기업들을 매칭 받으세요. programmers.co.kr 문제 해설 해당 문제는 일정 피로도로 최대한 많은 던전을 들어가는 방법을 찾는 문제이다. 문제의 중요한 조건을 정리하면 아래와 같다. 1. 던전에 들어가기 위해서는 최소 필요 피로도 이상의 피로도가 있어야 한다. 2. 던전에 들어가면 소모 피로도만큼 현재 피로도에서 감소한다. 3. 한 번 들어간 던전은 다시 들어갈 수 없다. 4. 던전의 수는 최소 1개, 최대 8개이다. 위 조건을 확인하면 ..

[LeetCode] 258. Add Digits

Given an integer num, repeatedly add all its digits until the result has only one digit, and return it. Example 1: Input: num = 38 Output: 2 Explanation: The process is 38 --> 3 + 8 --> 11 11 --> 1 + 1 --> 2 Since 2 has only one digit, return it. Example 2: Input: num = 0 Output: 0 Constraints: 0 = 1){ val += temp % 10; temp = parseInt(temp/10); } num = val; } return num }; 위 코드와 같이 간단하게 각 자리의 숫..

Virtual Scroll - 가상 스크롤 구현

Virtual scroll 가상 스크롤은 화면에서 보이지 않는 부분의 내용을 출력하지 않고, 화면에 보여질 때만 출력하는 방식의 스크롤을 말한다. 많은 양의 리스트 데이터를 화면에 그리는 경우, 모든 항목을 그리면 성능 상 문제를 초래한다. 예를 들자면 10만개의 데이터를 그리기 위해 10만개의 DOM노드를 그리려고 하면 Call Stack size error가 발생할 것이다. 그렇기에 화면에 직접적으로 보여지는 부분만 그리고, 나머지 부분은 가상으로 그려내는 것이 Virtual Scroll의 목표이다. 이때 새로운 요소들이 렌더링되는 동안 어색하지 않도록, Node padding이라는 여분의 공간을 둔다. 가상 스크롤은 SNS나 커뮤니티 등 무한 스크롤에서 많은 내용 출력할 때 사용하면 유리하다. 구현..

[React] DOM과 Virtual DOM을 이용한 브라우저의 렌더링 과정

리액트의 주요 특징 중 하나는 가상의 DOM인 Virtual DOM을 사용한다는 것인데, 이를 통해 개발의 편의성(DOM을 직접 제어X)과 성능(배치 처리로 DOM 변경)이 개선되었다. 이 부분은 웹 개발에 있어서 알아야 하는 개념으로 꼭 이해하도록 하자. DOM 브라우저는 문자열 형식의 HTML을 곧바로 이해할 수 없기 때문에, 브라우저가 이해하고 활용할 수 있는 구조로의 변환이 필요하다. DOM(Document Object Model)은 브라우저 렌더링 엔진의 HTML parser에 의해 생성된 '트리' 구조의 Node 객체 모델이다. DOM의 목적은 JS를 사용하여 문서에 대한 추가, 삭제, 이벤트 처리 등을 처리하는 인터페이스를 제공하는 것이다. 브라우저의 렌더링 과정 1. DOM 트리 생성 HT..

[백준]1107번 리모컨

문제 https://www.acmicpc.net/problem/1107 1107번: 리모컨 첫째 줄에 수빈이가 이동하려고 하는 채널 N (0 ≤ N ≤ 500,000)이 주어진다. 둘째 줄에는 고장난 버튼의 개수 M (0 ≤ M ≤ 10)이 주어진다. 고장난 버튼이 있는 경우에는 셋째 줄에는 고장난 버튼 www.acmicpc.net 문제 풀이 필자는 해당 문제를 처음에는 수학적으로 접근을 하였다. 하지만 계속되는 예외 케이스들에 걸려 계속 오답처리가 되었다. 6번을 틀리고 나서 문제 풀이 방법을 변경하였다. 해당 문제의 제시된 조건을 보면 제한 시간이 2초였다. 그래서 브루트포스로 접근해보았다. 최대 목표 채널은 500,000 이므로 최대 자리수를 10의 6승에서 내려가는 것이 최대 크기일 것이다. 즉 ..

TypeScript

타입스크립트는 javascript의 슈퍼셋으로 데이터 타입을 지정하지 않는 javascript에 타입 지정을 필수로 만들어준 언어로 대부분의 많은 프로젝트에서 사용된다. 그렇기에 javascript가 익숙해졌다면 typescript도 꼭 도전해보자. 지피지기면 백전무패! 타입스크립트의 장단점과 특징, 타입스크립트를 도입해야 하는 이유에 대해서 알아보자 타입스크립트의 특징 1. 컴파일 언어, 정적 타입 언어 자바스크립트는 동적 타입의 인터프리터 언어로 런타임에서 오류를 발견할 수 있습니다. 이에 반해 타입스크립트는 정적 타입의 컴파일 언어이며 타입스크립트 컴파일러 또는 바벨(Babel)을 통해 자바스크립트 코드로 변환됩니다. 코드 작성 단계에서 타입을 체크해 오류를 확인할 수 있고 미리 타입을 결정하기 때..