JSer.info #684 - Tailwind CSS v4.0 alpha가 출시됐어요.
Rust로 작성된 Oxide 엔진 추가, Lightning CSS 삽입함으로 성능, 빌트인 지원하는 구문 개선되었어요. 또한 글에서는 v4 로드맵에 대해서도 다루고 있어요.
TypeScript 5.4가 출시됐어요.
Beta나 RC에서 큰 기능 추가는 없어요.
클로저에 의한 Narrowing 결과 개선, NoInfer Utility Type 추가,
--module preserve 추가가 있었어요.
또한, ES2024 Object.groupBy/Map.groupBy 지원, Import Attributes 지원이 추가되었어요.
5.4는 target: "ES3"나 out 옵션 같은 비권장 기능 지원되는 마지막 버전이 될 예정이에요.
이 옵션은 5.5에서 삭제될 예정이에요.
브라우저 엔진 퍼포먼스 측정하는 벤치마크 도구 Speedometer 3.0가 출시됐어요.
Speedometer는 주로 브라우저 엔진 개발자가 브라우저 퍼포먼스 측정 벤치마크로 이용하고 있어요.
이번 업데이트에서 동기, 비동기 처리 실행 시간을 보다 더 정확히 측정, HTTP Archive나 npm 다운로드 수 기반으로 이용하고 있는 프레임워크 조절 등이 있어요.
또한, 지금까진 TodoMVC 이용했지만, Next.js/Nuxt 사용한 미디어 사이트나 그래피컬한 대시보드, CodeMirror나 TipTap 사용한 에디터도 테스트에 추가되었어요.
Speedometer 3.0 벤치마크에서는 다음 프레임워크가 테스트에 포함되어 있어요.
- Angular
- Backbone
- jQuery
- Lit
- Preact
- React
- React+Redux
- Svelte
- Vue
- Next.js
- Nuxt
- Observable Plot
- chart.js
- React stockcharts
- D3
- CodeMirror
- TipTap
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 v8.0.0 · pixijs/pixijs
github.com/pixijs/pixijs/releases/tag/v8.0.0
PixiJS v8.0.0 출시.
pixi.js 하나의 패키지에 통합, 초기화가 비동기로 변경, Graphiscs API 변경
Node.js — Node v21.7.0 (Current)
nodejs.org/en/blog/release/v21.7.0
Node.js v21.7.0 출시.
util.styleText(format, text) 함수 추가, process.loadEnvFile(path)와 util.parseEnv(content) 추가.
.env 복수행 값 지원, node:sea에 API 추가, node:vm에 importModuleDynamically 옵션 추가, crypto.hash() 추가
Open-sourcing our progress on Tailwind CSS v4.0 - Tailwind CSS
tailwindcss.com/blog/tailwindcss-v4-alpha
Tailwind CSS v4 alpha 출시.
Rust로 작성된 Oxide 엔진 추가, Lightning CSS 사용하도록 변경.
v4 로드맵 언급
WebKit Features in Safari 17.4 | WebKit
webkit.org/blog/15063/webkit-features-in-safari-17-4/
Safari 17.4 변경점에 대해.
HTML, <input type="checkbox" switch> 지원, 폼 세로 표시에 대응, <select> 구분에 <hr> 사용 가능.
CSS, @scope 지원, ::spelling-error와 ::grammar-error 추상 요소 지원, content: "foo" / "alt" 대체 텍스트 지원.
Web API, element.checkVisibility() 지원, AbortSignal.any() 지원.
JS, ES2024 Promise.withResolvers()/Object.groupBy()/Map.groupBy() 지원.
Biome v1.6 | Biome
Biome v1.6 출시.
Astro/Svelte/Vue 파일 내 JS/TS 분석 지원, biome.jsonc 지원.
atributePosition 옵션 추가, 규칙 업데이트
Announcing TypeScript 5.4 - TypeScript
devblogs.microsoft.com/typescript/announcing-typescript-5-4/
TypeScript 5.4 출시.
클로저로 인한 Narrowing 결과 개선, NoInfer Utility Type 추가,
--module preserve 추가.
ES2024 Object.groupBy/Map.groupBy 지원, Import Attributes 지원.
target: "ES3"나 out 옵션 같은 비권장되어있는 옵션은 5.5에서 삭제 예정.
WinterJS 1.0 · Blog · Wasmer
Spidermonkey 기반 WinterJS-compatible한 JavaScript Runtime인 WinterJS 1.0 출시.
Release v4.1.0 · honojs/hono
github.com/honojs/hono/releases/tag/v4.1.0
Hono v4.1.0 출시.
WebSocket Helper 추가, Body Limit Middleware 추가, 출력 타겟 ES2022으로 변경
읽을거리
풀스크래치로 이해하는 OpenID Connect (1) 인가 엔드포인트 편 - 엠스리테크블로그
www.m3tech.blog/entry/2024/03/05/150000
OpenID Connect의 ID Provider를 TypeScript로 구현하며 연재
"react-strict-dom", why it's so great? | Szymon Rybczak
szymonrybczak.dev/blog/react-strict-dom
react-strict-dom에 대해.
React Native for Web 접근에는 React Native의 primitive를 웹에 맞게 변환하는 호환 Shim이 상당히 큼.
react-strict-dom은 역으로 접근하는 것을 선택해し, DOM API 서브셋를 네이티브 츠겡서 다룸.
Why Should You Care About Package Metadata Interoperability? | OpenJS Foundation
openjsf.org/blog/package-metadata-interoperability-collab-space-intro
OpenJS에서 package.json 메타데이터 호환 운용성 향상하기 위한 워킹 그룹 발족.
- openjs-foundation/package-metadata-interoperability-collab-space: The goal of the Package Metadata Interoperability Collab Space is to improve how JavaScript developers define their packages across the ecosystem. The group is currently working to better understand package.json and how developers use it to define their projects.
- OpenJS Launches New Collaboration to Improve Interoperability of JavaScript Package Metadata - Socket
Ultimate Guide to Visual Testing with Playwright
www.browsercat.com/post/ultimate-guide-visual-testing-playwright
Playwright 사용한 Visual Regression Testing에 대하여
Speedometer 3.0: The Best Way Yet to Measure Browser Performance | WebKit
webkit.org/blog/15131/speedometer-3-0-the-best-way-yet-to-measure-browser-performance/
웹브라우저 엔진 벤치 마크 Speedometer 3.0 출시.
동기와 비동기처리 실행 시간을 보다 더 정확히 측정, HTTP Archive나 npm 다운로드 수 기반으로 이용되고 있는 프레임워크 조절.
또한, 지금까지는 TodoMVC 이용했지만, Next.js/Nuxt 사용한 미디어사이트나 그래피컬한 대시보드, CodeMirror와 TipTap 사용한 에디터도 테스트 가능
소프트웨어, 도구, 라이브러리
rolldown-rs/rolldown: Fast Rust bundler for JavaScript with Rollup-compatible API.
github.com/rolldown-rs/rolldown
Rollup 호환을 목표로하는 JavaScript Bundler.
edmundhung/conform: A type-safe form validation library utilizing web fundamentals to progressively enhance HTML Forms with full support for server frameworks like Remix and Next.js.
Remix나 Next.js에서 서버 처리 대응한 폼 라이브러리.
Zod 같은 것과 조합함으로 서버측에서 검증이나 React의 useFormState와 조합해 동작
도서
Eloquent JavaScript
Eloquent JavaScrip 4판(2024) 공개
