툴링Biome v2.5: Lint 규칙 500개, Plugin Code Fix, Cross-file Linting
Biome v2.5는 500개의 lint 규칙이라는 마일스톤을 달성하며, 73개의 nursery 규칙을 correctness, suspicious, style, security 등 안정적인 그룹으로 승격했습니다. 이번 릴리스에서는 Biome의 모듈 그래프를 활용한 두 가지 크로스 언어 nursery 규칙인 noUnusedClasses와 noUndeclaredClasses가 도입되어, CSS, JSX, HTML 파일 간의 CSS 클래스 불일치를 감지합니다. GritQL 플러그인은 이제 => 심볼을 사용해 safe 또는 unsafe 코드 수정을 선언할 수 있으며, includes 옵션으로 특정 파일 경로에 플러그인을 적용할 수 있습니다. 그 외에도 lint, format, check 명령어에 --watch 모드가 추가됐고, 언어 서버에 go-to-definition 기능, 새로운 delimiterSpacing 포매터 옵션, biome upgrade CLI 명령어, AI 코딩 에이전트의 토큰 사용을 줄이기 위한 concise 리포터가 포함됩니다. 이번 릴리스에서 linter와 checker의 속도는 약 13% 향상되었습니다.
Read Articlearrow_forward Article · 프레임워크READ TIME: 16m
Angular 22: 주요 기능과 변경 사항
Angular 22는 새 컴포넌트의 기본 변경 감지 전략을 OnPush로 변경하고, 기존 동작을 위한 ChangeDetectionStrategy.Eager와 자동 마이그레이션을 제공합니다. Signal Forms와 resource(), httpResource() API가 실험적 상태에서 안정 버전으로 졸업하며, 장기 실행 앱의 구독 누수 문제도 수정되었습니다. 라우터는 이제 기본적으로 부모 라우트 파라미터를 상속(paramsInheritanceStrategy: 'always')하여 route.parent?.parent?.snapshot.params 체이닝이 불필요해졌습니다. @Injectable({ providedIn: 'root' })의 간소화 대안인 @Service 데코레이터와 선택적 프리페치 트리거를 지원하는 injectAsync 헬퍼가 추가되었습니다. 실험적 WebMCP 기능은 Angular 폼과 서비스를 navigator.modelContext를 통해 브라우저 내 AI 에이전트가 호출 가능한 타입화된 도구로 등록할 수 있게 합니다. 또한 platform-server의 SSRF 보호 강화와 SVG href 바인딩 및 TransferCache 기본값에 대한 더 엄격한 보안 처리가 포함됩니다.
READ_FULL_LOGarrow_forwardArticle · 프레임워크READ TIME: 5m
Svelte 새 소식: 2026년 6월
6월 Svelte 업데이트는 버전 2.57에서 2.61에 걸친 SvelteKit의 remote form과 query API 개선에 집중되어 있습니다. form의 submit 메서드가 유효성 여부를 boolean으로 반환하게 되었고, requested() API는 이제 limit을 필수로 요구하며 구조화된 항목을 반환합니다. remote query의 .run() 메서드는 제거되어 직접 await를 사용하도록 변경되었습니다. 새로운 query.live() API는 장기 실행되는 async-iterable 방식의 remote query 구독을 지원하며, enhance 콜백은 이제 programmatic submit() API를 갖춘 remote form 인스턴스의 복사본을 받습니다. Svelte 코어에서는 마크업 내 인라인 선언을 직접 지원하게 되었고, svelte-language-tools는 언어 서버, svelte2tsx, svelte-check, svelte-preprocess 패키지 전반에서 TypeScript 6.0을 지원합니다. Svelte MCP 서버의 stdio 모드는 파일 내용을 직접 읽을 수 있어 로컬 도구 워크플로에서의 왕복 횟수를 줄여줍니다.
READ_FULL_LOGarrow_forwardArticle · 라이브러리READ TIME: 15m
TanStack Table V9 Beta: Tree-shakable, Signal 기반 상태, Custom Feature
TanStack Table V9는 V8의 두 가지 핵심 문제인 React Compiler 규칙과의 비호환성과 진정한 tree-shakability 부재로 촉발된 수년간의 재작성 끝에 베타 버전에 진입했습니다. V9는 TanStack Store를 상태 관리 레이어로 채택하여, TanStack Form의 form.Subscribe API를 미러링하는 table.Subscribe 컴포넌트를 통한 셀렉터 기반 구독이 가능해졌습니다. 이로써 행 선택 변경이 트리의 관련 없는 부분에서 리렌더링을 유발하지 않습니다. 기능은 이제 tableFeatures()를 통해 등록되는 opt-in 플러그인 방식이 되어 정렬이나 페이지네이션 같은 미사용 코드는 번들에서 제외되고, TypeScript는 등록된 기능에 따라 사용 가능한 API를 파악합니다. 새로운 createTableHook 유틸리티는 TanStack Form의 createFormHook과 유사하게 팀이 공유 테이블 설정을 한 번 정의하고 앱 전반에서 재사용할 수 있게 합니다. 행, 셀, 헤더 API를 공유 프로토타입으로 이동시켜 메모리 효율성도 개선되었으며, 전용 @tanstack/react-table-devtools 패키지가 console.log 없이 테이블 상태를 구조적으로 검사할 수 있는 DevTools를 제공합니다.
READ_FULL_LOGarrow_forwardArticle · 심층 분석READ TIME: 8m
JavaScript Reactivity(3부): Coarse vs. Fine-grained Reactivity
Jim Schofield의 리액티비티 시리즈 3편은 JavaScript 프레임워크를 변경이 감지되는 범위(window, application, service, component, template, DOM node)와 해당 범위 내에서 사용되는 메커니즘이라는 두 축으로 분류합니다. Zone.js는 가장 조잡한 극단을 대표하며, 모든 비동기 작업을 monkey-patch하고 무엇이 변경되었는지 알지 못한 채 전체 컴포넌트 트리를 순회합니다. React, Preact, Redux, Zustand는 virtual DOM 재조정과 참조 동등성 검사를 통해 리렌더를 줄이는 애플리케이션 레이어에 위치합니다. Vue와 Ember는 중간 지점을 차지하는데, Vue는 재귀 프록시를 통해 템플릿에서 실제로 읽은 프로퍼티만 추적하고, Ember는 추적된 데이터에 대한 증가 카운터를 사용해 어떤 템플릿을 다시 렌더해야 하는지 파악합니다. Angular signals, Solid signals, Svelte 5 runes, Preact signals와 같은 세밀한 시스템은 DOM 노드 수준에서 업데이트하지만, 단일 상태 변경이 여러 경로를 통해 전파되어 위상 정렬 없이는 글리치를 유발할 수 있는 다이아몬드 문제 등 의존성 추적 과제를 수반합니다.
READ_FULL_LOGarrow_forwardArticle · 서비스 워커READ TIME: 15m
왜 Service Worker를 사용하지 않는가?
2018년부터 모든 주요 브라우저에서 지원됨에도 불구하고, Service Worker는 중소 규모 회사의 코드베이스에서 여전히 대부분 사용되지 않고 있습니다. 이 글은 Service Worker를 오프라인 지원을 넘어 재평가하기 위한 세 가지 프로덕션 사례를 제시합니다. Slack은 배포 타임스탬프에 연결된 캐시 버킷, 커스텀 webpack manifest 플러그인, 지터된 재등록 인터벌을 활용해 부팅 시간을 약 50% 단축했으며, 웜 부트는 콜드 부트보다 25% 더 빨랐습니다. Mux는 Service Worker에서 HLS manifest 요청을 가로채 720p 이하의 렌디션을 제거해 서버 사이드 프록시 없이 적응형 비트레이트 문제를 해결했습니다. Vite 배포 사고를 계기로 version.json 폴링 전략이 도입되어, Service Worker가 열린 탭에 알리기 전에 새 에셋을 미리 캐시해 Failed to fetch dynamically imported module 오류 루프를 제거했습니다. 저자는 또한 Partytown이 Web Worker에서 실행되는 분석 스크립트의 동기적 DOM 읽기를 Service Worker가 가로채는 가짜 동기 XHR 호출로 브리지하는 방법도 설명합니다.
READ_FULL_LOGarrow_forwardArticle · 런타임READ TIME: 9m
Node.js 26.3.0(현재 버전)
Node.js 26.3.0은 4가지 SEMVER-MINOR 추가 사항과 함께, Apple이 Intel 아키텍처 지원을 단계적으로 중단함에 따라 macOS Universal Binary 제공 방식에 변화가 생길 수 있다는 공지를 함께 발표했습니다. Buffer.poolSize의 기본값이 8 KiB에서 64 KiB로 증가하여 고처리량 작업에서의 할당 성능이 향상됩니다. http 모듈에는 수신 헤더 값의 유효성 검사 여부를 제어하는 httpValidation 옵션이 추가되었습니다. inspector 모듈은 이제 정확한 커버리지 시작 정보를 JavaScript 런타임에 노출합니다. permission 모델에는 애플리케이션이 런타임에 특정 권한을 자발적으로 포기할 수 있는 permission.drop API가 추가되었습니다. 또한 James M Snell이 기여한 광범위한 QUIC 개선 사항으로 호스트 이름 검증, 스트림 유휴 타임아웃, 블록 리스트 지원, 세션 생성 및 버전 협상에 대한 속도 제한, recvmmsg 배치 처리, ECN 마킹 지원이 포함됩니다.
READ_FULL_LOGarrow_forwardsummarizeDigest_Summary
이번 주 JavaScript 카테고리는 주요 프레임워크 및 툴링 릴리스가 중심이었습니다. Biome v2.5는 500개 lint 규칙 마일스톤을 달성하며, CSS, JSX, HTML 파일 간 CSS 클래스 불일치를 감지하는 두 개의 크로스 파일 nursery 규칙(noUnusedClasses, noUndeclaredClasses)을 도입했습니다. 파일별 린터로는 불가능했던 기능입니다. --watch 모드, GritQL 플러그인 코드 수정, 13% 속도 향상도 포함됩니다. Angular 22는 OnPush를 기본 변경 감지 전략으로 채택하고, Signal Forms와 resource()/httpResource() API를 안정 버전으로 승격했으며, navigator.modelContext를 통해 Angular 서비스를 브라우저 내 AI 에이전트가 호출 가능한 타입화된 도구로 노출하는 실험적 WebMCP 기능을 추가했습니다.
TanStack Table V9는 React Compiler 비호환성과 tree-shakability 부재라는 V8의 두 가지 문제를 해결하기 위한 수년간의 재작성 끝에 베타에 진입했습니다. V9는 table.Subscribe 컴포넌트를 통한 셀렉터 기반 구독을 위해 TanStack Store를 채택하고, tableFeatures()로 등록하는 opt-in 플러그인 방식을 도입해 미사용 코드를 자동으로 번들에서 제외합니다. Node.js 26.3.0은 Buffer.poolSize 기본값을 8 KiB에서 64 KiB로 올리고, 새로운 permission.drop API, QUIC 개선(속도 제한, recvmmsg 배치 처리, ECN 마킹) 등 4개의 SEMVER-MINOR 추가 사항을 포함했습니다. 리액티비티 심층 분석 글은 Zone.js의 조잡한 monkey-patching부터 Angular, Solid, Svelte 5의 세밀한 DOM 노드 수준 signal까지 프레임워크를 분류했습니다.
SvelteKit 버전 2.57-2.61은 remote form과 query API를 개선했습니다. 새로운 query.live()는 async-iterable 방식의 장기 구독을 지원하고, .run() 메서드는 제거되어 직접 await를 사용하며, svelte-language-tools는 TypeScript 6.0을 지원합니다. Service Worker 사례 연구 글은 Slack이 캐시 버킷으로 부팅 시간을 50% 단축하고 Mux가 HLS manifest를 Service Worker에서 가로채 적응형 비트레이트 문제를 해결한 사례를 통해 오프라인 지원을 넘어선 Service Worker 활용법을 제시했습니다.
Key Takeaways- Biome v2.5의 noUnusedClasses와 noUndeclaredClasses는 모듈 그래프를 활용한 최초의 크로스 파일 lint 규칙으로 CSS/JSX/HTML 클래스 불일치를 감지합니다. 지금 바로 업그레이드하여 활성화하십시오.
- TanStack Table V9의 tableFeatures() opt-in 플러그인 방식은 미사용 기능(정렬, 페이지네이션)을 자동으로 tree-shake하며, V8 채택을 막았던 React Compiler 비호환성 문제를 해결합니다.
- Angular 22의 실험적 WebMCP는 navigator.modelContext를 통해 Angular 폼과 서비스를 브라우저 내 AI 에이전트가 호출 가능한 타입화된 도구로 노출하여 에이전트 네이티브 웹 앱의 새 지평을 열었습니다.
