JSer.info #665 - Web Components 라이브러리 Lit 3.0가 출시되었습니다.
Lit 3는, IE11 지원 종료, 최소 실행 환경을 ES2021 지원하는 브라우저로 변경했습니다.
Lit 2.0에서 비권장된 API 삭제, Stage 3 Decorator 대응했습니다.
또한, 새롭게 Lit 템플릿 컴파일러 공개, Preact Signals 통합하는 패키지도 공개했습니다.
Chrome 118 출시되었습니다.
Chrome 118에서는 CSS의 @scope 규칙 지원합니다.
Media Query에서 JavaScript가 유효한지 판단하는 scripting 추가, DevTools의 "Sources" 패널 개선, zstd의 Content-Encoding 지원이 있습니다.
Write your own Zod에서는, Zod 같은 스키마 기반 검증을 어떻게 동작하는가 해설합니다.
mini Zod로 불리는 귀여운 Zod 클론 코딩하면서, 스키마 객체에서 자료형을 Infer하는 방법, 검증 구현 방법에 대해 해설합니다.
To support JSer.info
- 😘 Recommend JSer.info to your friends!
- ❤️ Support @azu on GitHub Sponsors/JSer.info Sponsors
- 🐦 Follow @jser_info on X(Twitter)
헤드라인
Lit Launch Day: Lit 3.0, Labs graduations, a compiler and more! – Lit
lit.dev/blog/2023-10-10-lit-3.0/
Lit 3.0 출시.
IE11 지원 종료, 최소 실행환경을 ES2021 지원하는 브라우저로 변경.
Lit 2.0에서 비권장이었던 API 삭제, Stage 3의 Decorator에 대응.
새로히 Lit 템플릿 컴파일러 공개, Preact Signals 통합하는 패키지 공개.
Bun v1.0.5 | Bun Blog
Bun v1.0.5 출시.
Fetch 메모리 누수 수정, bun run --if-present 지원, package-lock.json을 bun.lockb으로 변환해주는 bun pm migrate 명령어 추가.
peerDependencies을 자동으로 설치하도록 변경
Release v2.10.0 · parcel-bundler/parcel
github.com/parcel-bundler/parcel/releases/tag/v2.10.0
Parcel v2.10.0 출시.
지연 컴파일 대상 지정할 수 있는 --lazy [glob]와 --lazy-excludes 추가.
Rust 모듈을 하나의 패키지 매니저로 함으로 중복 Crates 삭제해 사이즈 경감, 또한 병렬 처리 효율적으로 하게 성능 개선됨.
Fresh 1.5: Partials, client side navigation and more
Fresh 1.5 출시.
화면 전환 해당 영역을 파편해서 얻을 수 있는 <Partial> 추가.
현재 경로와 일치하는 <a> 요소에 data-current 추가, 커스텀 빌드 타겟을 지정할 수 있는 build.target 객체 추가.
esbuild 사용해서 bundle 파일 분석해서 메타파일 생성 기능 지원, 에러 오버레이 지원
Bun v1.0.6 | Bun Blog
Bun v1.0.6 출시.
npm의 overrides 필드, yarn의 resolutions 필드 지원.
Electron 27.0.0 | Electron
www.electronjs.org/blog/electron-27-0
Electron 27.0.0 지원.
macOS 10.13/10.14 지원 종료, ipcRenderer.sendTo() API 비권장화
Astro 3.3: Picture component | Astro
Astro 3.3 출시.
<picture /> 컴포넌트 추가, 신택스 하이라이트에 사용했던 라이브러리를 shiki에서 shikiji로 변경
Vite (Unstable) (dev branch) | Remix
remix.run/docs/en/dev/future/vite
Remix의 Vite 지원.
Vite의 플러그인으로 Remix가 동작할 수 있게끔.
Release v4.1.0 · rollup/rollup
github.com/rollup/rollup/releases/tag/v4.1.0
Rollup v4.1.0 출시.
객체를 갖는 객체를 비트 플러그로 관리해서 메모리 소비량을 경감하는 개선 포함.
New in Chrome 118 - Chrome for Developers
developer.chrome.com/en/blog/new-in-chrome-118/
Chrome 118 변경점 관련.
CSS의 @scope 규칙 지원, Media Query에서 JavaScript가 유효한지 판단하는 scripting 추가.
DevTools으 "Sources" 패널 개선, zstd의 Content-Encoding 지원.
읽을거리
Limit the reach of your selectors with the CSS `@scope` at-rule - Chrome for Developers
developer.chrome.com/articles/at-scope/
CSS @scope 관련한 글.
@scope 덕에 셀렉터 범위를 제한할 수 있으며, 스코프는 특별히 영향없음.
또한, @scope { }와 루트 지정없이 지정할 수 있는 scoped style을 다루는 prelude-less @scope에 대해서도 다룬다
What's New in DevTools (Chrome 118) - Chrome for Developers
developer.chrome.com/blog/new-in-devtools-118/
Chrome 118 개발자 모드 변경점에 대해.
local overrides 개선, 코드 검색 개선, Sources 패널 개선, Lighthouse 11으로 업데이트
Write your own Zod
zackoverflow.dev/writing/write-your-own-zod
Zod 같은 스키마 검증을 만드는 방법에 대해서.
Zod 같이 스키마 객체에서 자료형을 Infer하는 방법, 검증 구현에 대해.
Flat config rollout plans - ESLint - Pluggable JavaScript Linter
eslint.org/blog/2023/10/flat-config-rollout-plans/
앞으로 Config 파일에 관련하여.
ESLint 9에서는 eslint.config.js의 Flat Config가 기본이 되어, .eslintrc.* 형식은 비권장이 됨.
.eslinrc.* 지원은 ESLint 10에서 삭제 예정.
소프트웨어, 도구, 라이브러리
react-hookz/web: React hooks done right, for browser and SSR.
서버렌더링할 때 동작하는 React Hooks 콜렉션 라이브러리.
react-use 계승을 의식하며 제작되었음
elbywan/zap: Another [insert blazing fast synonyms] JavaScript package manager
Crystal 언어로 작성된 npm 패키지 매니저.
