JSer.info #628 - Bun v0.5가 릴리스 됐다.
package.json의 workspaces를 이용한 설치를 지원한다.
node:dns, node:tls, node:net, node:readline을 지원하는 등 Node.js와의 호환성 강화.
또, 모듈 해결(resolution) 시의 식별자 우선 순위 변경이 포함됐다.
Remix v1.11.0가 릴리스 됐다.
defer를 사용해 응답 대기 시간을 줄일 수 있도록, @remix-run/css-bundle을 이용한 CSS 파일 가져오기, CSS Modules, Vanilla Extract 지원.
또, Remix v2에서 도입 예정인 Flat Routes를 opt-in으로 이용할 수 있다.
Fixing a Memory Leak in a Production Node.js App에서는 Node.js 기반 웹 애플리케이션에서 발생한 메모리 누수의 원인을 어떻게 조사하고 수정해 나갔는지 이야기 한다.
본문 내 라이브 디버깅 영상에서는 Node.js의 Memory Profilter(Chrome DevTools)를 이용하여 메모리 누수 원인을 찾는 과정을 보여준다.
heap snapshots을 이용한 메모리 누수 디버깅, autocannon라는 HTTP 벤치마크 도구를 사용하요 지속적으로 요청을 보내 문제 상황을 재현하는 방법을 소개한다.
To support JSer.info
- 😘 Recommend the website to your friends!
- 💸 Support @azu on GitHub Sponsors>
- 🐦 Follow @jser_info on Twitter
헤드라인
Bun v0.5 | Bun Blog
Bun 0.5.0 릴리스.
workspaces 설치 지원.
node:dns, node:tls, node:net, node:readline를 지원하는 등 Node.js와의 호환성 강화.
모듈 해결(resolution) 시의 식별자 우선 순위 변경 등.
Release v2.0.0-alpha.1 · reduxjs/redux-toolkit
github.com/reduxjs/redux-toolkit/releases/tag/v2.0.0-alpha.1
Redux Toolkit v2.0.0-alpha.1 릴리스.
ESM 형식과 CJS 형식을 지원하는 듀얼 패키지로 변경, thunk 함수를 redux-thunk 패키지로 이동.
v2 정식 버전에는 Immer 10을 포함할 예정이다.
Q1 Roadmap · Issue #17475 · denoland/deno
github.com/denoland/deno/issues/17475
Deno의 2023 Q1 로드맵.
deno.json에 직접 import map을 삽입할 수 있도록 개선, type=module의 package.json 지원, node: prefix 지원.
deno.land/x 에서 semver 버전 지정 지원, deno bundle를 Deprecate로 하고 deno pack 추가.
Safari 16.3 Release Notes | Apple Developer Documentation
developer.apple.com/documentation/safari-release-notes/safari-16_3-release-notes
Safari 16.3 릴리스.
fetch()로 Content-Encoding: gzip 컨텐츠를 다운로드 할 때의 문제 수정, Cross-Origin-Embedder-Policy 버그 수정.
CSP에 prefetch-src 디렉티브 추가.
Release v29.4.0 · facebook/jest
github.com/facebook/jest/releases/tag/v29.4.0
Jest v29.4.0 릴리스.
equal 알고리즘을 사용자가 정의할 수 있도록 하는 expect.addEqualityTesters() 추가, 객체의 속성을 목(mock)하는 jest.replaceProperty() 추가 등.
Release v1.11.0 · remix-run/remix
github.com/remix-run/remix/releases/tag/remix%401.11.0
Remix 1.11.0 릴리스.
defer를 사용해 응답 대기를 줄일 수 있도록, @remix-run/css-bundle을 이용한 CSS 파일 가져오기, CSS Modules. Vanilla Extract 지원.
Flat Routes를 opt-in으로 사용할 수 있도록 변경.
아티클
Next.js 기반 애플리케이션 컴파일 속도를 약 100배 개선한 이야기(일본어)
zenn.dev/mkt/articles/543669021d9a1e
Next.js의 빌드 속도 문제 원인을 .next/trace의 트레이스 데이터를 보고 분석하는 방법 소개.
Why Not document.write()? – CSS Wizardry – Web Performance Optimisation
csswizardry.com/2023/01/why-not-document-write/
document.write()가 왜 느린지 분석 및 설명하는 글.
Why Is My Jest Test Suite So Slow? | by Steven Lemon | Jan, 2023 | Bits and Pieces
blog.bitsrc.io/why-is-my-jest-suite-so-slow-2a4859bb9ac0
Jest 테스트의 성능 병목 현상을 알아보는 방법 소개.
부팅 시간, jsdom 로드. 캐시, 테스트 파일 로드, 실제 테스트 실행 시간 분석.
Node.js의 프로파일러를 사용해 어디에 문제가 있는지 알아보는 방법을 소개한다.
Fixing a Memory Leak in a Production Node.js App
kentcdodds.com/blog/fixing-a-memory-leak-in-a-production-node-js-app
Node.js의 애플리케이션에서 메모리 누수가 발생했을 때 실제로 어떻게 디버깅하여 문제를 발견했는지 소개하는 글.
본문 내 영상을 보면 처음에는 shiki가 사용하는 vscode-oniguruma에서 메모리 해제 처리를 하지 않는 것이 문제라고 판단하고 Worker에서 처리하도록 변경한다.
하지만 실제로는 express-http-proxy에서 요청 URL을 저장하고 있었고 Image CDN의 URL이 너무 길어서 메모리를 필요 이상 점유하게 된 게 원인으로 분석된다.
SSSVG: An Interactive SVG Reference | fffuel
인터렉티브하게 속성을 조절해가며 SVG 태그를 살펴볼 수 있는 래퍼런스 사이트.
Optimize Time to First Byte
Time to First Byte (TTFB)의 개선을 주제로 한 글.
Serving-Timing 헤더를 사용한 정보 구체화, CDN 이용, 페이지 리다이렉트를 피하기, SSR 시에 Streaming Server Rendering을 사용하기.
Service Worker를 사용한 캐시 전략, 103 Early Hints 등을 다루고 있다.
사이트, 서비스, 문서
amandaghassaei/gpu-io: A GPU-accelerated computing library for physics simulations and other mathematical calculations
github.com/amandaghassaei/gpu-io
WebGL 2.0 기반으로 개발된 GPU 가속 처리 라이브러리.
소프트웨어, 도구, 라이버러리
Brooooooklyn/canvas: High performance skia binding to Node.js. Zero system dependencies and pure npm packages without any postinstall scripts nor node-gyp.
github.com/Brooooooklyn/canvas
네이티브 에드온을 사용한 skia backend의 Canvas API 구현 라이브러리.
아키텍처 환경에 맞춰 optionalDependencies로 prebuild의 Skia를 포함한 바이너리가 다운로드 되므로 시스템에 따라 사전에 의존 모듈을 추가로 설치할 필요가 없다.
