기술 블로그

현대 웹 개발에서 성능 최적화는 사용자 경험을 좌우하는 핵심 요소이다. 특히 폰트 파일은 웹 애플리케이션에서 상당한 용량을 차지하는 경우가 많아, 이들의 경량화는 빌드 파일 크기를 줄이는 데 큰 기여를 할 수 있다. 폰트를 경량화하는 방법으로는 사용하지 않는 글리프(glyph)를 제거하거나 필요한 문자 집합만을 포함하는 방법이 있으며, 이를 통해 프로젝트의 전체 파일 크기를 상당히 줄일 수 있다.폰트 경량화의 필요성폰트는 시각적 완성도를 높이는 데 중요한 역할을 하지만, 크기가 커지면 로딩 속도에 부정적 영향을 미친다. 특히 웹사이트나 애플리케이션이 여러 폰트를 사용하거나 다양한 스타일을 포함할 경우, 로딩에 소모되는 시간과 자원이 크게 늘어난다. 따라서 폰트를 경량화하면 불필요한 리소스를 줄이고, 최적..

1. Heap: 빠르게 찾고, 정렬하는 마법의 자료구조Heap은 최소값이나 최대값을 빠르게 찾을 수 있는 트리 기반의 자료구조입니다. Min Heap에서는 가장 작은 값이, Max Heap에서는 가장 큰 값이 루트에 위치하게 됩니다.핵심 메서드insert: 새 값을 삽입하고, 부모 노드와 비교하여 필요한 경우 위로 이동합니다 (bubble-up).extractMin (혹은 extractMax): 루트 값을 삭제하고 맨 마지막 값을 루트로 올린 후, 자식 노드와 비교하여 아래로 내려갑니다 (bubble-down).JavaScript 예시class MinHeap { constructor() { this.heap = []; } insert(val) { this.heap.push(val); ..

JavaScript에서 문자열 비교와 숫자 정렬 문제 해결JavaScript에서 숫자를 이어 붙여 가장 큰 수를 만들 때 주의해야 할 점과 효과적인 방법을 소개합니다.1. 숫자로 변환 시 정밀도 손실숫자가 매우 크면 Number 타입으로 처리할 때 정밀도가 손실될 수 있습니다. 따라서 큰 숫자를 직접 숫자로 변환해 비교하면 잘못된 결과가 나옵니다.Number("11111112111111121"); // 11111112111111120 (정밀도 손실)2. localeCompare()로 문자열 비교두 숫자를 문자열로 결합한 후 localeCompare()로 비교해 사전식으로 정렬할 수 있습니다. 이 방식은 정확한 비교를 제공합니다.("34" + "9").localeCompare("9" + "34"); // ..

문제 상황: Type Guard와 every 메서드의 한계TypeScript는 코드의 타입 안전성을 보장하기 위해 컴파일 시점에 타입을 검사한다. 이 과정에서 타입 가드와 타입 단언을 활용해 컴파일러가 타입을 정확하게 추론하도록 돕는다. 하지만 때로는 타입 가드를 사용했음에도 TypeScript가 배열의 타입을 확신하지 못하는 경우가 생긴다.예시 코드다음 예제에서 result 배열이 FileSystemFileEntry 또는 FileSystemDirectoryEntry로만 구성되어 있는지를 every 메서드를 통해 확인하고자 한다.if ( result.length > 0 && result.every(entry => isFileSystemFileEntry(entry) || isFileSystemD..

타입스크립트에서 배열 요소 타입 가드: 왜 작동하지 않는가?타입스크립트는 정적 타입 기반의 언어로, 타입을 명확히 정의하고 코드의 안정성을 높이는 데 중요한 역할을 한다. 그중에서도 타입 가드(Type Guard)는 변수가 특정 조건을 만족할 때 해당 변수의 타입을 좁히는 기능을 담당한다. 하지만 배열 요소에 타입 가드를 적용할 때는 예상치 못한 오류가 발생할 수 있다. 이번 글에서는 배열 요소에 타입 가드가 제대로 작동하지 않는 이유와 이를 해결하는 방법을 살펴보겠다.타입 가드란?타입 가드는 변수의 타입을 안전하게 좁히기 위해 사용하는 조건문이다. 대표적인 예로 typeof, instanceof, in 연산자가 있다. 이들은 특정 조건을 만족할 때 타입스크립트가 변수를 더욱 구체적인 타입으로 추론하도록..

작성중