JSer.info #651 - ORM 도구 Prisma 5.0.0 출시되었습니다.
실험적 기능이었던 jsonProtocol
/fieldReference
/extendedWhereUnique
가 Stable로 변경되었습니다.
Wire Protocol를 JSON Protocol으로 변경함으로, Cold Start 시간이 크게 개선되었습니다.
파괴적 변경으로 Node.js 14 지원 종료, 암묵적으로 배열로 간주하는 "array shortcuts" 지원 삭제, 비권장 옵션 삭제가 있습니다.
다음 글에 업데이트 방법이 공개되어 있습니다.
Prettier 3.0 출시되었습니다.
Markdown에서 일본어/중국어 ⇔ 영어 간 스페이스가 들어가지 않도록 변경, CJK 금지처리 대응같은 변경도 있습니다.
trailingComma
기본값을 all
으로 변경했으며 babel
파서에서 Flow 구문 지원을 삭제하는 변경도 있습니다.
그 외에도 내부적으로 ESM에도 대응하기 위한 API 변경, 플러그인 비동기 파서를 지원, 설정 파일에서 ESM 지원도 추가되었습니다.
CommonJS에서 ES Modules로 이행하는 방법. 톱다운인가 바텀업인가에서는, Secretlint의 ESM 이행을 예시로 어떻게 패키지를 CommonJS에서 ES Modules으로 이행했는가 설명합니다.
Node.js에는 ESM에서 CJS는 읽는 호환 레이어가 있어, 의존 관계부터 톱 다운으로 ESM으로 이행하며, 패키지를 조금씩 이행할 수 있는 방법에 대해 작성되고 있습니다.
이 글은 흔히 말하는 Pure ESM package(ESM만 지원) 방침에 관련한 것입니다만, CJS와 ESM 둘 다 지원하는 Dual Package이라는 방법도 있습니다.
Dual Package 주요한 기법은 다음 Issue에 정리되어 있습니다.
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 v20.4.0 (Current) | Node.js
nodejs.org/en/blog/release/v20.4.0
Node.js v20.4.0 출시.
node:test
가 Timer의 Mock 지원, ECMAScript Stage 3의 Explicit Resource Management(using
) 지원
Bun v0.6.13 | Bun Blog
Bun v0.6.13 출시.
bun:test
가 Date의 mock 대응, Buffer.toString("base64")
성능 개선, node:tls
와 node:net
호환성 개선.
Buffer.isUtf8()
와 isAcii()
구현, WebSocket
클라이언트 버그 수정
Prettier 3.0: Hello, ECMAScript Modules! · Prettier
prettier.io/blog/2023/07/05/3.0.0.html
Prettier 3.0 출시.
Markdown에서 일본어/중국어와 영어 사이에 공백을 넣지 않도록 변경, CJK 금지처리도 대응.
플러그인에서 비동기 파서를 지원, 설정파일에서 ESM 지원, trailingComma
기본값을 all
변경
Announcing typescript-eslint v6 | typescript-eslint
typescript-eslint.io/blog/announcing-typescript-eslint-v6/
typescript-eslint 6.0.0 출시.
프리셋 규칙을 그룹으로 나눠서, strict-type-checked
/stylistic
/stylistic-type-checked
추가, 프리셋 조합으로 설정하도록 변경.
비권장이 된 규칙 삭제, Node.js 14 지원 종료, 규칙 설정 변경.
개발자 대상 API와 AST 변경.
Boa release v0.17 - Boa
boajs.dev/posts/2023-07-08-boa-release-17/
Rust로 작성된 JavaScript 파서/컴파일러 Boa 0.17 출시.
ECMAScript Modules 대응, test262 대시보드 추가.
Constant folding 최적화, Hidden Class 최적화.
--debug-object
플러그 추가, 임베디드 wrapper 추가, Intl 지원
Release 5.0.0 · prisma/prisma
github.com/prisma/prisma/releases/tag/5.0.0
Prisma 5.0.0 출시.
실험적 기능이었던 jsonProtocol
/fieldReference
/extendedWhereUnique
를 Stable으로 변경.
Node.js 14 지원 종료, 암묵적으로 배열로 취급하는 "array shortcuts" 지원 삭제, 비권장 옵션 삭제
Release v6.0.0 · styled-components/styled-components
github.com/styled-components/styled-components/releases/tag/v6.0.0
styled-components v6.0.0 출시.
Node.js 14 지원 종료, TypeScript으로 재작성, vendor prefix를 기본적으로 생략하도록 변경, stylis v4으로 업데이트
Deno 1.35: A fast and convenient way to build web servers
Deno v1.35 출시.
Deno.serve()
를 Stable로 변경, Noe.js와 호환성개선.
표준 모듈 semver
재작성, html
모듈 추가, http/user_agent
추가
Bytecode Alliance — Welcoming Javy: A new hosted project
bytecodealliance.org/articles/javy-hosted-project
Shopify에 의해 작성된 JavaScript를 WebAssembly(JS + QuickJS)으로 컴파일 하는 Javy가 Bytecode Alliance 호스트 프로젝트가 되었다.
읽을거리
Breaking Up with SVG-in-JS in 2023 | Jacob Groß | kurtextrem.de
SVG를 JS의 bundle에 포함하는 문제와 성능에 대하여
애니메이션 구현을 극적으로 간단하게 만드는 FLIP 테크닉
katashin.info/posts/flip-animation/
FLIP(First, Last, Invert, Play) 애니메이션 테크닉에 관해서.
복잡한 좌표 계산없이 애니메이션을 구현하는 방법.
DevTools Tips: Record and replay user flows with the Recorder - Chrome Developers
developer.chrome.com/en/blog/devtools-tips-4/
Chrome DevTools의 Record and Replay 기능에 관하여.
조작을 기억해서 재생가능. 재생에는 브레이크 포인트 설정하거나 내용 편집, 확장 기능을 사용해서 Cypress 같은 테스트 프레임워크 출력할 수도 있다.
CommonJS에서 ES Modules으로 이행하는 방법. 톱다운인가 바텀업인가 | Web Scratch
efcl.info/2023/07/05/convert-to-esm/
Node.js에서 ESM으로 이행은 의존관계의 읽는 쪽에 영향을 주기에, 바텀업이 아니라 톱다운으로 단계적인 이행한다.
의존 트리 작성이나 단계적 이행하기 위해 경계선 발견하는 방법, CJS에서 ESM 임포트하는 회피책에 대해서도 다룬다
소프트웨어, 도구, 라이브러리
Scroll-driven Animations
scroll-driven-animations.style/
Scroll-driven animations 데모나 유스케이스에 관한 정리 사이트
mdx-editor/editor: An open source rich text React component for markdown editing
Markdown 리치 에디터의 React 컴포넌트.
도서
gibbok/typescript-book: The Concise TypeScript Book: A Concise Guide to Effective Development in TypeScript. Free and Open Source.
github.com/gibbok/typescript-book
TypeScript 입문서