JSer.info #714 - Node.js v22.11.0가 출시되었습니다.
Node.js v22.11.0은, Node.js v22.x의 LTS(Long Term Support) 출시입니다.
Node.js v22.x은, 2027-04-30까지 지원이 예정되어 있습니다.
Nuxt.js v3.14가 출시되었습니다.
클라이언트와 서버에서 공유하는 코드를 두는 shared/ 폴더 추가, rspack 대응.
useResponseHeader와 useRuntimeHook 추가가 있습니다.
또한, v4에서 변경을 opt-in할 수 있는 compatibilityVersion: 4 추가도 있습니다.
npm 호환 패키지 매니저 vlt와, npm registry 호환 서버리스 레지스트리 vsr가 출시되었습니다.
vlt은, npm 명령어처럼 패키지 설치나 script 실행이 가능한 패키지 매니저입니다.
특징으로는 vlt query 같이 쿼리 검색과 그 결과를 Mermaid나 GUI로 표기 기능이 있습니다. (쿼리 자체는 npm-query도 닮은 구조입니다)
또한, vlt gui 명령어로 GUI 실행, 프로젝트 의존 관계를 확인 하는 기능이 있습니다.
vsr은, npm registry 호환 서버리스 레지스트리입니다.
이건 Fair Source로, Functional Source License으로 공개되었으며, 셀프 호스팅 가능합니다. 호스팅은 Cloudflare Workers로 이용 가능하도록 제공됩니다.
또한, npm이나 GitHub처럼, 권한이 세세하게 Granular Access Tokens 발행할 수 있는 구조입니다.
다음 페이지에, vsr/verdaccio/jsr 비교 글이 있습니다.
vlt 로드맵은 공개되어 있지 않지만, vlt은 npm, inc의 founder인 Isaac이나 본래 npm 개발자들이 개발하고 있습니다.
vlt 만든 동기 중 하나로, npm registry 문제가 있기에, vsr 호스팅 서비스 개발에 힘을 넣고 있다합니다.
To support JSer.info
- 😘 Recommend JSer.info to your friends!
- ❤️ Support @azu on GitHub Sponsors/JSer.info Sponsors
- 🐦 Follow @jser_info on X(Twitter)
헤드라인
Node.js — Node v22.11.0 (LTS)
nodejs.org/en/blog/release/v22.11.0
Node.js v22.11.0 출시.
Node.js 22.x가 LTS가 되어, 2027년 4월까지 관리됨.
Nuxt 3.14 · Nuxt Blog
Nuxt v3.14 출시.
jiti 업데이트, 클라이언트와 서버에서 공유하는 코드를 두는 shared/ 폴더 추가, rspack 대응.
useResponseHeader와 useRuntimeHook 추가.
v4의 변경을 opt-in 가능한 compatibilityVersion: 4 추가
Release v5.0.0 · immutable-js/immutable-js
github.com/immutable-js/immutable-js/releases/tag/v5.0.0
imutable-js v5.0.0 출시.
비권장 메서드 삭제, default export 삭제, TypeScript 자료형 정의 개선
mylesmmurphy/prettify-ts: Prettify TypeScript: Better Type Previews
github.com/mylesmmurphy/prettify-ts
TypeScript 자료형 정보를 읽기 쉽게 펼쳐서 보여주는 VSCode 확장
happy-dom allows for server side code to be executed by a <script> tag · CVE-2024-51757 · GitHub Advisory Database
github.com/advisories/GHSA-96g7-g7g9-jxw8
happy-dom의 SSRF 보안 수정.
<script>의 src 속성에 써있는 코드를 실행 가능하도록 하는 문제 수정.
happy-dom v15.10.2에서 수정 됨.
읽을거리
Making content-aware components using CSS :has(), grid, and quantity queries - Piccalilli
piccalil.li/blog/making-content-aware-components-using-css-has-grid-and-quantity-queries/
Quantity Queries나 Container Queries 사용해서 요소 갯수나 폭 Grid Layout 변경하는 테크닉에 대하여.
Re-implementing JavaScript's == in JavaScript
evanhahn.com/re-implementing-javascript-double-equals-in-javascript/
== 를 JavaScript에서 구현하는 이야기.
== 가 어떻게 변환이나 비비교를 하는지 사양의 Step마다 구현, 그 알고리즘을 보는 글
CSS sprite sheet animations · leanrada.com
leanrada.com/notes/css-sprite-sheets/
CSS sprite으로 하는 애니메이션에 대하여.
APNG나 SVG 애니메이션과 비교해 장단점, CSS sprite에서 애니메이션 구현 방법에 대하여
Introducing the vlt Package Manager & Serverless Registry
blog.vlt.sh/blog/introducing-vlt-and-vsr
npm 호환성 있는 패키지 매니저 vlt와 npm registry 호환되는 vsr 공개.
슬라이드, 영상
Next.js App Router 보안 - Speaker Deck
speakerdeck.com/zaru_sakuraba/nextjssekiyuritei
Next.js의 Server Action 보안에 관한 슬라이드.
"use server";으로 의도치 않게 서버 함수를 함수하는 경우, Server Component에서 Client에 데이터를 통째로 Props로 전달하는 경우에 대하여.
웹사이트, 서비스, 문서
astahmer/atomic-css-devtools: A devtool panel for debugging Atomic CSS rules as if they were not atomic. Available on chrome & firefox
github.com/astahmer/atomic-css-devtools
Atomic CSS 스타일을 정리해 패널을 제공함으로, Atomic CSS 디버그가 쉬워지는 브라우저 확장
NPM Chart
npm 패키지 설치 수의 그래프를 생성하는 서비스
