본문 바로가기

728x90

dom

(3)
100만 행 데이터 그리드가 버티는 법, 양축 가상화부터 DOM 풀링까지 100만 행 데이터 그리드가 버티는 법, 양축 가상화부터 DOM 풀링까지IT & AI 뉴스 썸네일대용량 데이터 그리드는 행 몇 개를 덜 그리는 것만으로 빨라지지 않아요. 열 너비 계산, 검색 상태, 편집기, 아이콘, 스크롤 이벤트가 한 프레임 안에서 함께 움직여야 해요. VisuaLeaf 개발자가 MongoDB와 PostgreSQL용 그리드를 약 1년 동안 다듬으며 적용한 최적화 과정을 공개했어요. 1핵심 요약구분핵심왜 볼 만한가요렌더링 범위화면에 보이는 행과 열만 그리는 양축 가상화데이터가 늘어도 DOM 크기를 일정하게 유지할 수 있어요상태 구조원본 데이터와 별도로 표시용 섀도 테이블 구성스크롤 중 타입 판별과 중첩 경로 탐색을 반복하지 않아요스크롤 처리수동적 리스너, 프레임 병합, 버퍼와 히스테리시스..
Safari MCP 서버, AI 코딩 도구가 실제 브라우저를 보는 흐름 Safari MCP 서버, AI 코딩 도구가 실제 브라우저를 보는 흐름AI 뉴스 썸네일웹 개발에서 AI 코딩 도구를 쓰다 보면 코드 설명만으로는 부족할 때가 많아요. 화면에 실제로 어떻게 보이는지, 콘솔에 어떤 오류가 찍히는지, 네트워크 요청이 어디서 막히는지는 브라우저 안에 남아 있어요. WebKit이 Safari Technology Preview 247에 Safari MCP 서버를 넣은 이유도 여기에 가까워요. 1핵심 요약구분핵심왜 볼 만한가요브라우저 테스트Safari MCP 서버가 AI 코딩 도구를 실제 Safari 창과 연결해요코드만 보는 도구가 렌더링, 콘솔, 네트워크 상태까지 확인할 수 있어요웹 디버깅DOM, 스크린샷, 콘솔 로그, 네트워크 요청, 페이지 상호작용 도구를 제공해요Safari에서..
Wordgard 0.1, ProseMirror 이후 9년의 편집기 설계를 다시 꺼냈어요 Wordgard 0.1, ProseMirror 이후 9년의 편집기 설계를 다시 꺼냈어요AI 뉴스 썸네일웹에서 문서 편집기를 만들 때 ProseMirror는 여전히 강한 선택지예요. 그런데 ProseMirror와 CodeMirror를 만든 Marijn Haverbeke가 새 리치 텍스트 편집기 라이브러리 Wordgard 0.1을 공개했어요. 기존 프로젝트를 조금 고친 버전이 아니라, 9년 동안 쌓인 불편함을 새 API와 새 이름으로 다시 정리한 작업에 가까워요.핵심 요약구분핵심왜 볼 만한가요새 편집기 라이브러리Wordgard 0.1은 ProseMirror 계열 아이디어를 다시 설계한 JavaScript 리치 텍스트 편집기예요웹앱에서 문서 편집, 노션형 인터페이스, 협업 편집을 다루는 팀이 참고할 만해요변경..

728x90