JSer.info #657 - Fresh 1.4 출시했습니다.
사전 컴파일로 페이징 로딩 개선, <head>/<head>/<body> 태그 가능하도록, _layout 파일 지원 추가합니다.
또한, defineRoute/defineLayout/defineApp 함수 추가, 라우트 그룹 개념 추가되었습니다.
Chrome 117 beta 출시했습니다.
CSS 애니메이션 개선, CSS Subgrid 지원, ECMAScript Stage 3 Object.groupBy/Map.groupBy 구현, Iterator Helpers 구현이 추가됩니다.
Bun 0.8.0 출시했습니다.
--inspect에서 WebKit의 Insector를 사용하는 Debugger 지원됩니다.
또한, bun update 의존 관계 업데이트 지원, Node.js 호환성 향상으로 SvelteKit/Nuxt 지원됩니다.
그 외로는, Fetch API의 response body streaming 지원, File constructor 지원도 추가됩니다.
To support JSer.info
- 😘 Recommend JSer.info to your friends!
- ❤️ Support @azu on GitHub Sponsors/JSer.info Sponsors
- 🐦 Follow @jser_info on X(Twitter)
헤드라인
Fresh 1.4 – Faster Page Loads, Layouts and More
Fresh 1.4 출시.
사전 컴파일로 페이지 로딩 개선, <head>/<head>/<body> 태그 정의 사용가능, _layout 파일 지원.
defineRoute/defineLayout/defineApp 함수 추가, 라우트 그룹추가
Release v29.6.3 · jestjs/jest
github.com/jestjs/jest/releases/tag/v29.6.3
Jest v29.6.3 출시.
@types/node 의존 삭제, watch mode에서 항시 worker 사용하도록 변경, minor 버전에 도입된 mock과 관련해서 파괴적 변경 revert
Release v3.5.0 · honojs/hono
github.com/honojs/hono/releases/tag/v3.5.0
Hono v3.5.0 출시.
Security Headers 미들웨어 추가, Cookie 헬퍼 추가, Zod OpenAPI 미들웨어 추가.
queries, c.runtime(), app.handleEvent() 비권장으로
Chrome 117 beta - Chrome Developers
developer.chrome.com/en/blog/chrome-117-beta/
Chrome 117 beta 출시.
CSS @starting-style 규칙, overlay 프로퍼티, transition-behavior 프로퍼티 지원.
CSS Grid에 subgrid 구현, text-wrap: pretty 지원.
ECMAScript Stage 3 Object.groupBy/Map.groupBy 구현, Iterator Helpers 구현.
Clear-Site-Data 헤더 값으로 "clientHints"와 "*" 구현.
HATWG URL 표준에 맞게 URL 파서 수정.
Origin Trials으로 Shared Brotli, WebSQL의 deprecation trial.
unload 이벤트 비권장으로 변경
Release v9.0.0-alpha.0 · reduxjs/react-redux
github.com/reduxjs/react-redux/releases/tag/v9.0.0-alpha.0
React-Redux v9.0.0-alpha.0 출시.
React 18, Redux 5가 필수 항목이 됨.
CJS/ESM의 dual package 대응, UMD 빌드 삭제, Server Component 호환성 개선
Bun v0.8.0 | Bun Blog
Bun v0.8.0 출시.
--inspect로 Debugger 지원, bun update로 의존관계 업데이트 지원, SvelteKit/Nuxt 지원.
Fetch API의 response body streaming 지원, File constructor 지원
Rspack 0.3 Release Announcement - Rspack
www.rspack.dev/blog/announcing-0.3.html
Rspack 0.3 출시.
CSS 동작을 webpack에 맞추는 옵션 experiments.css = true 추가, post-css loader 변경.
Web Worker 지원, builtin:swc-loader 지원, RSPACK_PROFILE=ALL에서 프로파일 얻을 수 있도록
Release v2.3.0 · parcel-bundler/watcher
github.com/parcel-bundler/watcher/releases/tag/v2.3.0
@parcel/watcher 2.3.0 출시.
FreeBSD 지원, Wasm 백엔드 @parcel/watcher-wasm 패키지 추가
읽을거리
Debugging speculation rules - Chrome Developers
developer.chrome.com/en/blog/debugging-speculation-rules/
Chromeの 개발자 도구로 speculationrules한 prefetch 디버그 방법에 대하여
Long Animation Frames API - Chrome Developers
developer.chrome.com/en/articles/long-animation-frames/
Long Task API에서는 50ms 이상 점유하는 태스크가 있다는 것만 알라 불완전 정보였음.
Long Animation Frames API은 이 결점은 개선해, INP 개선에 도움되는 정보를 제공하는 목적으로 추가됨.
Long Animation Frames API에 포함되어 있는 정보(Attributes)나 이를 사용한 디버그 방법에 대하여.
Patterns for Reactivity with Modern Vanilla JavaScript | Frontend Masters
frontendmasters.com/blog/vanilla-javascript-reactivity/
JavaScript에서 Reactive한 처리를 어떻게 구현하는가에 대하여.
EventTarget과 CustomEvent를 사용한 PubSub/Observer 패턴, Proxy를 사용한 리엑티브한 객체, Signal.
그리고 DOM MutationObserver이나 IntersectionObserver같은 API에 대하여
웹사이트, 서비스, 문서
alvarlagerlof/rsc-parser: A parser for the React Server components when sent over the network
github.com/alvarlagerlof/rsc-parser
React Server Component(RSC) 디버그 브라우저 확장 기능.
RSC 네트워크 리퀘스트를 파싱하고 페이로드 가시화
Alt Text Hall of Fame – Celebrating well-written image descriptions.
alt text에 대한 웹사이트.
왜 필요하고 구체적으로 어떻게 작성하는가 상세한 예시로 설명
