반응형 레이아웃에서 뷰포트 너비가 바뀌는 순간, 렌더링할 요소 개수가 늦게 재계산됐다. 브레이크포인트를 넘는 순간 잠깐이지만 이전 개수의 요소가 그대로 노출되는 현상이었다.성능 문제는 아니었다. 하지만 상태 계산 시점이 렌더링과 맞지 않는 구조적인 문제였고, 그냥 두기엔 사용자 눈에 직접 보이는 오류였다. 이 글은 그 원인을 찾고 해결한 과정을 기록했다. 문제무엇이 문제였는가반응형 환경에서 뷰포트 너비를 변경하면 약 0.1초 정도 요소가 추가되는데 시간이 걸렸다.원래라면 뷰포트 786px(Tablet size)을 기준으로 보다 클 때 8개, 작을 때 6개가 렌더링 되어야하는데 아래 사진과 같이 렌더링 지연 시간이 보이는 것을 확인할 수 있다. 가설원인을 어디서 찾았는가가장 먼저, 네트워크 환경에 따라 ..

내가 보려고 만드는 기술 면접 리스트문제 리스트CPU와 메모리는 각각 어떤 역할을 하나?프로그램은 어떻게 실행되는가?메모리 계층 구조를 간단히 설명해보세요.캐시 메모리는 왜 필요한가?지역성(Locality)이란?스택(Stack)과 힙(Heap)의 차이는?콜 스택(Call Stack)이란?스택 오버플로우가 발생하는 시점과 이유메모리 누수는 왜 성능 문제로 이어지나요?멀티코어 CPU가 프론트엔드에 주는 이점은?컨텍스트 스위칭이란?무거운 연산이 UI를 멈추게하는 이유Web Worker는 왜 필요한가요? 들어가기 전,컴퓨터 구조라는 과목은, 말 그대로 컴퓨터의 구조와 관련된 학문으로 내가 공부하고 있는 프론트엔드를 넘어 웹 개발자라면 기본적으로 인지하고 있어야하는 내용입니다.따라서, 공부한 내용은 컴퓨터 구조라..

들어가며"호이스팅이 왜 일어날까?", "스코프 체인이란 무엇일까?", "this는 왜 상황마다 달라질까?" JavaScript를 공부해봤다면, 이 질문들은 한 번쯤 생각해보았을 것입니다. 이 세 가지는 따로 외워야 할 별개의 규칙이 아닌, 실행 컨텍스트라는 개념을 이해하면 전부 같은 원리로 설명됩니다.이 글에서는 실행 컨텍스트가 무엇인지, 내부에 무엇을 담고 있는지, 그리고 호출 스택에서 어떻게 동작하는지를 다룹니다.컨텍스트실행 컨텍스트를 이해하기 앞서, 컨텍스트란 무엇인지 이해해야합니다.컨텍스트(Context)란 상황, 맥락, 문맥 상의 의미를 의미합니다. 이를 개발자답게 해석해보면, 텍스트의 내용뿐만 아니라, 텍스트가 사용된 상황, 이전 문맥, 이후 맥락 등을 모두 가지고 있는 데이터 묶음을 가리킨다..

📦 스택(Stack)스택(Stack)은 데이터를 한쪽 방향으로만 넣고 꺼내는 자료구조입니다. 후입선출(LIFO, Last In First Out)방식으로 동작하여 가장 마지막에 들어온 데이터가 가장 먼저 나가는 구조입니다.예를들어, 접시를 쌓아두고 위에서부터 하나씩 사용하는 것과 같습니다. 🏓 동작 방식스택의 핵심은 “순서대로 데이터를 넣고, 마지막 데이터를 꺼낸다.” 입니다. 1. 데이터 추가(push)앞에서부터 순서대로 데이터를 추가합니다.2. 데이터 제거(pop)가장 마지막 데이터를 제거합니다.3. 스택의 가장 마지막 데이터 확인마지막에 있는 데이터를 확인합니다.4. 스택이 비어있는지 확인스택이 비어있는지 확인합니다.가장 간단한 방법은 배열의 길이가 0인가를 확인하는 방법입니다.JavaScrip..

더보기포트폴리오 프로젝트 몰아보기 안녕하세요! 전부터 프론트엔드 개발자라면자신의 포트폴리오 페이지정돈 있어야지!... 라고 생각만 하고실천은 없었지만 이번에는 진짜로 만들어볼 예정입니다 :) 기획 먼저, 포트폴리오에서어떤 내용을 강조할까?, 어떤 형태로 보여줄까? 를 많이 고민했으며혼자 생각하는것보다 다른 레퍼런스를 찾아보며 고민했습니다. 레퍼런스 리스트 ⬇️더보기송진경님의 포트폴리오 송진경 | 프론트엔드 개발자프론트엔드 개발자 송진경의 포트폴리오입니다. React, Typescript, Next.js 기반의 웹 프론트엔드를 개발합니다.www.meganmagic.com 이정민님의 포트폴리오 이정민 - Leejeongminjeongmin's dev portfolio siteleejeongmin.ver..

더보기KDT 해커톤 모아보기 2025.09.16 - [기타] - [KDT 해커톤] 해커톤 후기 (참가 신청 ~ 예선)2025.12.19 - [기타] - [KDT 해커톤] 해커톤 후기 (본선)제 7회 KDT 해커톤 본선 후기안녕하세요, 미루고 미루던 해커톤 후기를 3개월만에 다시 적기위해 돌아왔습니다.(지난 글에서 이어집니다.)2025.09.16 - [기타] - [KDT 해커톤] 해커톤 후기 (참가 신청 ~ 예선) [KDT 해커톤] 해커톤 후기 (참가 신청 ~ 예선)제 7회 KDT 해커톤 후기 오늘은 최근에 참여했던고용노동부 주관 KDT 해커톤 후기를 작성해보려고한다. 전체 과정 본선 전 과정에서는 모두 온라인으로 진행되었고본선만 오프라인 무박 2일이라blog.dev-sg.cloud 본선...에 들어가기전..