JSer.info #643 - Next.js 13.4 출시되었습니다.
App Router가 Stable이 되었습니다.
App Router에 관련한 참고 자료는 적지만 다음 문서나 글에서 참고할 수 있습니다.
Next.js 13.4에서는 Turbopack를 Beta로 변경, 실험적 기능으로 Server Actions 추가 등도 있습니다.
Firefox 113.0 출시되었습니다.
CSS color()/lab()/lch() 등 지원, CSS 셀렉터 of <selector> 구문 지원 등이 추가되었습니다.
또한, Compression Streams API 지원 , Android에서 AV1 video codec 지원 등도 추가되었습니다.
그 외로는 접근성 엔진 리뉴얼하여, 스크린 리더 등 사용 할 때 성능 개선 등이 있습니다.
상세한 개선 내용은 다음 글에서 확인해주세요.
- Firefox 113 Significantly Boosts Accessibility Performance - Mozilla Accessibility
- Cache the World: Turbo Charging Firefox Accessibility Performance and Maintainability | Jantrid
To support JSer.info
- 😘 Recommend JSer.info to your friends!
- ❤️ Support @azu on GitHub Sponsors/JSer.info Sponsors
- 🐦 Follow @jser_info on X(Twitter)
헤드라인
Blog - Next.js 13.4 | Next.js
Next.js 13.4 출시.
App Router Stable으로, Turbopack Beta로 변경.
실험적 기능으로 Server Actions 추가 등
Astro 2.4 | Astro
Astro 2.4 출시.
scopedStyleStrategy 옵션 추가, <Code /> 컴포넌트 개선, SSR 할 때도 사이트맵 지원.
플러그 조건 middleware 지원 , CSS 인라인화 지원 등
Release v0.1.10 · web-infra-dev/rspack
github.com/web-infra-dev/rspack/releases/tag/v0.1.10
rspack 0.1.10 출시.
compilation.modules 지원 , splitChunks 옵션 호환성 개선, Angular 초기 지원 추가 등
Release v8.4.0 · pnpm/pnpm
github.com/pnpm/pnpm/releases/tag/v8.4.0
pnpm v8.4.0 출시.
pnpm publish --provenance 지원 등
Firefox 113.0, See All New Features, Updates and Fixes
www.mozilla.org/en-US/firefox/113.0/releasenotes/
Firefox 113 출시.
CSS color()/lab()/lch() 등 지원 , of <selector> 구문 지원.
Compression Streams API 지원 , AV1 video codec 지원.
접근성 엔진 리뉴얼로 인한 스크린 리더 등 사용 시에 성능 개선 등.
- Firefox 113 for developers - Mozilla | MDN
- Firefox 113 Significantly Boosts Accessibility Performance - Mozilla Accessibility
- Cache the World: Turbo Charging Firefox Accessibility Performance and Maintainability | Jantrid
읽을거리
Origin Private File System 사용해서 브라우저 상의 파일을 고속으로 조작해보자
zenn.dev/cybozu_frontend/articles/origin-private-file-system
Origin Private File System 기본 사용 방법에 대하여
5 Lessons Learned From Taking Next.js App Router to Production - Inngest Blog
www.inngest.com/blog/5-lessons-learned-from-taking-next-js-app-router-to-production
Next.js App Router에 대하여.
클라이언트에서 캐시와 서버 사이드에서 캐시, Search Parameter 다루기, 폴더 구조, 교육 자료에 대하여.
Chromium Blog: An Update on the Lock Icon
blog.chromium.org/2023/05/an-update-on-lock-icon.html
Chrome 117에서 자물쇠 아이콘 대신 조절 아이콘으로 변경한 이야기
Cache the World: Turbo Charging Firefox Accessibility Performance and Maintainability | Jantrid
www.jantrid.net/2022/12/22/Cache-the-World/
Firefox 113의 접근성 엔진 리뉴얼 상세.
Quantum에서 퍼포먼스 저하되던 것을 캐시를 사용함으로 개선한 구조.
접근성 트리 캐시하고 그 캐시를 동기하는 구조에 대하여
웹사이트, 서비스, 문서
Unlighthouse - Site-wide Google Lighthouse · Unlighthouse
웹사이트를 크롤링해서 Lighthouse 스캔을 한데 모은 도구.
크롤 대상을 라우팅에서 정의할 수 있으며, 결과를 정리한 레포트 생성해줌.
소프트웨어, 도구, 라이브러리
natemoo-re/ultramatter: <1kB frontmatter parser that supports a reasonable subset of YAML
github.com/natemoo-re/ultramatter
frontmatter를 파서하는 귀여운 라이브러리.
YAML 서브셋만 다뤄서 파일 크기를 잘게해줌.
vadimdemedes/ink-ui: 💄 Ink-redible command-line interfaces made easy
github.com/vadimdemedes/ink-ui
Ink 사용한 터미널 대상 UI 컴포넌트.
대화형 입력 폼, 선택지, 로딩,
알람, 목록 표기 등 컴포넌트
도서
React Application Architecture for Production | Packt
www.packtpub.com/product/react-application-architecture-for-production/9781801070539
React 애플리케이션 개발에 대한 책.
저자는 bulletproof-react 저자
- PacktPublishing/React-Application-Architecture-for-Production: React Application Architecture for Production, published by Packt
- alan2207/bulletproof-react: 🛡️ ⚛️ A simple, scalable, and powerful architecture for building production ready React applications.
