JSer.info #671 - Node.js v18.19.0가 출시되었어요.
npm 10 업데이트, node:module
에 register
API 추가, import.meta.resolve
지원돼요.
그리고, .js
기본값을 CJS에서 ESM로 변경하는 --experimental-default-type
플래그가 백포트돼요.
Biome v1.4.0 출시되었어요.
Prettier의 JS/TS/JSX 관련 테스트케이스를 95% 이상 통과한 Rust 구현 대회 The Prettier Challenge가 있었어요.
Biome v1.4.0는 이 도전과제를 달성했으며, Pretttier 포맷터 결과 96% 일치했어요.
의도적인 다르게 만든 부분은 다음 Issue에 정리되었어요.
그 외로, 포맷 관련한 옵션 추가, --config-path
플래그 추가, Lint 규칙 추가도 있어요.
Prettier's CLI: A Performance Deep Dive · Prettier 에서는 Prettier의 CLI 성능 개선에 대해 언급되고 있어요.
glob 파일 탐색 개선, INI 파일 파싱 개선, 캐시를 기본값으로 변경, console.log
출력을 버퍼링하도록 변경하는 등 CLI 개선에 관련된 이야기가 있어요.
CSS Hooks 라이브러리는, style
속성 스타일링 가능한 CSS in JS이며, :hover
같은 추상 클래스도 지원돼요.
CSS Hooks는, CSS Custom Properties 사용함으로 style 속성에서 추상 클래스나 Media Query 지원해요. CSS Custom Properties로 if문 같이 스타일링 토글 가능하고요.
상세한 구조는, 다음 글을 참조해주세요.
To support JSer.info
- 😘 Recommend JSer.info to your friends!
- ❤️ Support @azu on GitHub Sponsors/JSer.info Sponsors
- 🐦 Follow @jser_info on X(Twitter)
헤드라인
Release v135 / Introducing esm.sh/run · esm-dev/esm.sh
github.com/esm-dev/esm.sh/releases/tag/v135
esm.sh v135 출시.
JSX나 TS 코드 변경과 실행 가능한 https://esm.sh/run
추가
Biome formatter wins the Prettier challenge |
biomejs.dev/blog/biome-wins-prettier-challenge
Biome v1.4.0 출시.
JS/TS/JSX 포맷터 결과를 Prettier 호환하도록 개선. 현 시점 Prettier 결과와 96% 일치. 몇 가지 포맷터는 의도적으로 다르게 구현.
포맷터 관련한 옵션 추가, --config-path
플래그 추가, Lint 규칙 추가
Release v9.0.0 · cosmiconfig/cosmiconfig
github.com/cosmiconfig/cosmiconfig/releases/v9.0.0
설정 파일 모더 라이브러리 cosmiconfig 9.0.0 출시.
searchStrategy
옵션, $import:
지원.
파일 시스템 권한을 얻을 수 없어 실패했을 때 크래시되는 문제 수정
Astro 4.0 Beta Release | Astro
astro.build/blog/astro-4-beta/
Astro 4.0 Beta 출시.
Vite 5으로 업데이트, <ViewTransitions />
관련 라이프 사이클 이벤트 추가
Node v18.19.0 (LTS) | Node.js
nodejs.org/en/blog/release/v18.19.0
Node.js v18.19.0 출시.
npm 10으로 업데이트, node:module
에 register
API 추가, import.meta.resolve
지원.
.js
기본값을 CJS에서 ESM으로 변경하는 --experimental-default-type
플래그 지원.
Node.js Downloads
Node.js 버전 마다 다운로드 수를 시각화하는 웹사이트
Storybook 7.6
storybook.js.org/blog/storybook-7-6/
Storybook 7.6 출시.
webpack 프로젝트에서도 SWC 이용 가능하도록 변경, @storybook/test
의 assertion를 Vitest의 expect으로 변경, Test mode 추가.
react-docgen 업데이트로 기동 시간 개선, Storyshots와 Vue2 지원 비권장화
Node v21.3.0 (Current) | Node.js
nodejs.org/en/blog/release/v21.3.0
Node.js v21.3.0 출시.
--disable-warning
플래그 추가, 루트 증명성를 NSS 3.95으로 갱신, UTF-8 문자열을 fs.writeFileSync
에서 작성할 때 성능 개선
tapjs/tsimp
ts-node 같이 TypeScript 코드 타입 체크하면서 컴파일하는 로더.
Node.js 20부터 지원되는 Module.register()
사용해서 node --import
동작. 또한 데몬과 캐시 사용함으로 불필요한 처리 스킵 가능.
읽을거리
Prettier's CLI: A Performance Deep Dive · Prettier
prettier.io/blog/2023/11/30/cli-deep-dive
Prettier의 CLI 퍼포먼스 개선에 대해.
glob 파일 탐색 개선, INI 파일 파싱 개선, 캐시 기본값으로, console.log
출력 버퍼링하도록 변경
CSS Containment 구조 이해하며 렌더링 퍼포먼스 개선1 개요 | 프론트엔드 Blog | 미츠에링크스
www.mitsue.co.jp/knowledge/blog/frontend/202311/28_1448.html
CSS Containment 관련하여
소프트웨어, 도구, 라이브러리
architect/aws-lite: A simple, fast, extensible AWS client
AWS의 API 클라리언트 라이브러리.
AWS SDK 성능이나 스택 트레이스 등 문제 다루기 위해 작성.
css-hooks/css-hooks: Hooks bring advanced CSS features to native inline styles.
github.com/css-hooks/css-hooks
style 속성으로 스타일링 하는 CSS in JS 라이브러리. React/Preact/Solid 지원.
CSS custom properties 사용해서, :hover
등 추상 클래스나 Media Query 관련 스타일링을 style 속성으로 구현하고 있음.
tapjs/tsimp
ts-node 같이 TypeScript 코드를 타입 체크하면서 컴파일링하는 로더.
Node.js 20에서 지원하는 Module.register()
를 사용해 node --import
동작. 또한 데몬과 캐시 사용함으로 불필요한 처리 스킵 가능.
도서
Fluent React
learning.oreilly.com/library/view/fluent-react/9781098138707/
2024년 3월 발매.
React 관련 도서