translate: 20240227 article (#1170)

_i18n/ko/_posts/2024/2024-02-27-firefox-123-remix-2.7.0remix-vite-is-stable-2023node.js.md

@@ -0,0 +1,246 @@
+---
+title: "2024-02-27: Firefox 123, Remix 2.7.0(Remix Vite is Stable), Node.js 2023"
+author: "azu"
+translator: rewrite0w0
+layout: post
+date: 2024-02-27T06:40:44.988Z
+category: JSer
+tags:
+- nodejs
+- TypeScript
+- React
+- tool
+- Electron
+
+---
+
+JSer.info #682 - Firefox 123가 출시되었어요.
+
+- [Firefox 123.0, See All New Features, Updates and Fixes](https://www.mozilla.org/en-US/firefox/123.0/releasenotes/)
+- [Firefox 123 for developers - Mozilla | MDN](https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/123)
+
+`<template>`요소가 `shadowrootmode` 속성 지원, `Date.parse()` 호환성 향상, 103 Early Hints `rel=preload` 지원되어요.
+또한, 실험적 기능으로 Web Codecs API 지원이 추가되었어요.
+
+---
+
+Remix 2.7가 출시되었어요.
+
+- [Remix Vite is Now Stable | Remix](https://remix.run/blog/remix-vite-stable)
+
+Remix 2.7에는 SPA 모드가 Stable으로, `base` 옵션 지원, Remix Vite가 Cloudflare Pages 지원, Server Bundles 지원이 있어요.
+
+- [Remix 2.7 Stable에서 Cloudflare Pages의 Vite 대응 실현 방법 분석](https://zenn.dev/chimame/articles/e5bf3a18b7d4de)
+
+클라이언트 코드와 서버 코드 분리하는 구조로 `.server/` 지원, `vite-env-only`에서 서버에서만 이용 가능하도록 마크할 수 있어요.
+또한, Vite 5.1.0부터 지원된 `.css?url`에 대응, 빌드 결과의 출력과 Vite 호환성 개선도 있었어요.
+
+---
+
+[Node.js 2023 Year in An Article](https://blog.rafaelgss.dev/nodejs-2023-year-in-review)는, 2023년 Node.js 본체 개발에 대해 정리했어요.
+
+Node.js 커밋수랑 출시 횟수, CITGM 에코시스템  테스트, Node.js 바이너리 크기와 증가된 의존 관계, QUIC/OpenSSL 3.0.x 비용, 퍼포먼스 개선.
+또한, Permission Model, 보안 관련 출시, `.env`나 WebSocket client 등 새로운 기능에 대해서도 다뤄집니다.
+
+----
+
+{% include inline-support.html %}
+
+----
+
+<h1 class="site-genre">헤드라인</h1>
+
+----
+
+## Release v0.25.0 · nodejs/corepack
+[github.com/nodejs/corepack/releases/tag/v0.25.0](https://github.com/nodejs/corepack/releases/tag/v0.25.0 "Release v0.25.0 · nodejs/corepack")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">nodejs</span> <span class="jser-tag">tool</span> <span class="jser-tag">ReleaseNote</span></p>
+
+corepack v0.25.0 출시.
+내부적으로 Node.js Built-in `fetch` 사용하도록, `corepack cache {clean,clear}` 추가.
+`COREPACK_ENABLE_UNSAFE_CUSTOM_URLS=1` 플래그가 유효라면, `packageManager`에 커스텀 URL 지정 가능하도록.
+`COREPACK_ENABLE_DOWNLOAD_PROMPT=1`으로 캐시에 없는 package manager 다운로드할 때 프롬프트 보이도록.
+
+
+----
+
+## Electron 29.0.0 | Electron
+[www.electronjs.org/blog/electron-29-0](https://www.electronjs.org/blog/electron-29-0 "Electron 29.0.0 | Electron")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">Electron</span> <span class="jser-tag">ReleaseNote</span></p>
+
+Electron 29.0.0 출시.
+Chromium 122, Node.js 20.9.0, V8 12.2으로 업그레이드.
+renderer process 이용 가능한 `webUtils` 모듈 추가, `ipcRenderer` 그 자체를 `contextBridge` 공개되지 않도록 변경
+
+- [Release electron v29.0.0 · electron/electron](https://github.com/electron/electron/releases/tag/v29.0.0 "Release electron v29.0.0 · electron/electron")
+
+----
+
+## Firefox 123.0, See All New Features, Updates and Fixes
+[www.mozilla.org/en-US/firefox/123.0/releasenotes/](https://www.mozilla.org/en-US/firefox/123.0/releasenotes/ "Firefox 123.0, See All New Features, Updates and Fixes")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">Firefox</span> <span class="jser-tag">ReleaseNote</span></p>
+
+Firefox 123 출시.
+`<template>` 요소가 `shadowrootmode` 속성 지원, `Date.parse()` 호환성 향상, 103 Early Hints `rel=preload` 지원.
+실험적 기능으로 Web Codecs API 지원
+
+- [Firefox 123 for developers - Mozilla | MDN](https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/123 "Firefox 123 for developers - Mozilla | MDN")
+
+----
+
+## Announcing TypeScript 5.4 RC - TypeScript
+[devblogs.microsoft.com/typescript/announcing-typescript-5-4-rc/](https://devblogs.microsoft.com/typescript/announcing-typescript-5-4-rc/ "Announcing TypeScript 5.4 RC - TypeScript")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">TypeScript</span> <span class="jser-tag">ReleaseNote</span></p>
+
+TypeScript 5.4 RC 출시.
+클로저로 인한 Narrowing 결과 개선, `NoInfer` Utility Type 추가.
+ES2024 `Object.groupBy`/`Map.groupBy` 지원, Import Attributes 지원.
+`target: "ES3"`이나 `out`옵션 등 같은 비권장화된 옵션은 5.5에서 삭제될 예정.
+
+- [Feedback: 5.0 deprecations · Issue #51909 · microsoft/TypeScript](https://github.com/microsoft/TypeScript/issues/51909 "Feedback: 5.0 deprecations · Issue #51909 · microsoft/TypeScript")
+
+----
+
+## Release v1.24.0 · parcel-bundler/lightningcss
+[github.com/parcel-bundler/lightningcss/releases/tag/v1.24.0](https://github.com/parcel-bundler/lightningcss/releases/tag/v1.24.0 "Release v1.24.0 · parcel-bundler/lightningcss")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">CSS</span> <span class="jser-tag">Tools</span> <span class="jser-tag">ReleaseNote</span></p>
+
+Lightning CSS v1.24.0 출시.
+`light-dark()` fallback 대응, CSS system colors 지원, Custom Properties와 `@keyframes` deduplication(dedupe) 대응
+
+
+----
+
+## Bun v1.0.29 | Bun Blog
+[bun.sh/blog/bun-v1.0.29](https://bun.sh/blog/bun-v1.0.29 "Bun v1.0.29 | Bun Blog")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">Bun</span> <span class="jser-tag">ReleaseNote</span></p>
+
+Bun v1.0.29 출시.
+`string-width` 호환 API `Bun.stringWidth(string)` 추가, Bun Shell으로 `2>&1`와 `&>` 지원
+
+
+----
+
+## Deno 1.41: smaller deno compile binaries
+[deno.com/blog/v1.41](https://deno.com/blog/v1.41 "Deno 1.41: smaller deno compile binaries")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">deno</span> <span class="jser-tag">ReleaseNote</span></p>
+
+Deno v1.41 출시.
+`deno compile` 생성하는 바이너리 크기 절감, Linux ARM64 지원, Node.js 호환성 개선
+
+- [Release v1.41.0 · denoland/deno](https://github.com/denoland/deno/releases/tag/v1.41.0 "Release v1.41.0 · denoland/deno")
+
+----
+
+## facebook/react-strict-dom: React Strict DOM (RSD) is a subset of React DOM, imperative DOM, and CSS that supports web and native targets
+[github.com/facebook/react-strict-dom](https://github.com/facebook/react-strict-dom "facebook/react-strict-dom: React Strict DOM (RSD) is a subset of React DOM, imperative DOM, and CSS that supports web and native targets")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">React</span> <span class="jser-tag">DOM</span> <span class="jser-tag">iOS</span> <span class="jser-tag">Android</span> <span class="jser-tag">library</span></p>
+
+웹과 네이티브 지원 목적 React DOM 서브셋 구현
+
+
+----
+
+## Remix Vite is Now Stable | Remix
+[remix.run/blog/remix-vite-stable](https://remix.run/blog/remix-vite-stable "Remix Vite is Now Stable | Remix")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">Remix</span> <span class="jser-tag">vite</span> <span class="jser-tag">ReleaseNote</span></p>
+
+Remix 2.7.0 출시.
+SPA모드 Stable, `base` 옵션 지원, Remix Vite가 Cloudflare Pages 지원, Server Bundles 지원.
+클라이언트 코드와 서버 코드 분리하는 구조 `.server/` 지원, `vite-env-only`로 서버에서만 이용가능하게끔 마크.
+Vite 5.1.0에 지원된 `.css?url`에 대응, 빌드 결과 출력과 Vite 호환성 개선
+
+- [Remix 2.7 Stable에서 Cloudflare Pages의 Vite 대응 실현 방법 분석](https://zenn.dev/chimame/articles/e5bf3a18b7d4de "Remix 2.7 Stable에서 Cloudflare Pages의 Vite 대응 실현 방법 분석")
+
+----
+
+## 만능CDN - 협력회사
+[funnull.com/Partner/](https://funnull.com/Partner/ "만능CDN - 협력회사")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">polyfill</span> <span class="jser-tag">news</span> <span class="jser-tag">webservice</span></p>
+
+https://polyfill.io/ 이 Funnull CDN(만능CDN) 운영하는 Funnull에 매각되어, 2024-02-24 이후 운용은 Funnull이 함.
+
+- [Jake on X: &amp;quot;I&#039;ve been in discussions with Funnull for many months and they will be the new maintainers and operators of the GitHub repo, which remains open source, and as of 24 Feb, they&#039;re starting to provide the service for https://t.co/29YaS03zrD.&amp;quot; / X](https://twitter.com/JakeDChampion/status/1761315227008643367 "Jake on X: &amp;amp;quot;I&amp;#039;ve been in discussions with Funnull for many months and they will be the new maintainers and operators of the GitHub repo, which remains open source, and as of 24 Feb, they&amp;#039;re starting to provide the service for https://t.co/29YaS03zrD.&amp;amp;quot; / X")
+- [Polyfill.io가 중국에 매각된 배경과 대응책은? - 로보인 블로그](https://roboin.io/article/2024/02/26/polyfill-io-sells-to-chinese-company-what-you-need-to-know/ "Polyfill.io가 중국에 매각된 배경과 대응책은? - 로보인 블로그")
+
+----
+<h1 class="site-genre">읽을거리</h1>
+
+----
+
+## JSDoc as an alternative TypeScript syntax
+[alexharri.com/blog/jsdoc-as-an-alternative-typescript-syntax](https://alexharri.com/blog/jsdoc-as-an-alternative-typescript-syntax "JSDoc as an alternative TypeScript syntax")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">TypeScript</span> <span class="jser-tag">article</span></p>
+
+TypeScript를 JSDoc cheker로 이용하는 이야기.
+TypeScript에서 자료형 정의와 JSDoc에서 자료형 정의 작성 방법 비교 및 소개.
+
+
+----
+
+## TanStack Router（&amp; Query）은 SPA 개발이 추구하던 것이었다✨【React 라우팅과 데이터 페칭】
+[zenn.dev/aishift/articles/ad1744836509dd](https://zenn.dev/aishift/articles/ad1744836509dd "TanStack Router（&amp; Query）은 SPA 개발이 추구하던 것이었다✨【React 라우팅과 데이터 페칭】")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">React</span> <span class="jser-tag">JavaScript</span> <span class="jser-tag">article</span></p>
+
+TanStack Router 소개 글
+
+
+----
+
+## Using localStorage in Modern Applications - A Comprehensive Guide | RxDB - JavaScript Database
+[rxdb.info/articles/localstorage.html](https://rxdb.info/articles/localstorage.html "Using localStorage in Modern Applications - A Comprehensive Guide | RxDB - JavaScript Database")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">article</span></p>
+
+localStorage API에 대하여.
+localStorage은 동기적인 API로 크기나 저장에 제한이 있지만, 소소한 값은 빠르게 읽고 쓰기 가능.
+어떤 경우 이용할 것인가 / 하지 않을 것인가, IndexedDB 같은 것과 비교
+
+
+----
+
+## Node.js 2023 Year in An Article
+[blog.rafaelgss.dev/nodejs-2023-year-in-review](https://blog.rafaelgss.dev/nodejs-2023-year-in-review "Node.js 2023 Year in An Article")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">nodejs</span> <span class="jser-tag">article</span></p>
+
+Node.js의 2023년에 대해.
+Node.js 출시, CITGM 에코시스템 테스트, Node.js 바이너리 사이즈 증가와 의존관계, QUIC/OpenSSL 3.0.x 비용, 퍼포먼스 개선.
+Permission Model, 보완 관련 출시, `.env`이나 WebSocket client 등 새로운 기능
+
+
+----
+<h1 class="site-genre">소프트웨어, 도구, 라이브러리</h1>
+
+----
+
+## fabiospampinato/fast-string-width: A fast function for calculating the visual width of a string once printed to the terminal.
+[github.com/fabiospampinato/fast-string-width/tree/main](https://github.com/fabiospampinato/fast-string-width/tree/main "fabiospampinato/fast-string-width: A fast function for calculating the visual width of a string once printed to the terminal.")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">library</span></p>
+
+`Intl.Segmenter` 사용하지 않는 `string-width` 구현 라이브러리
+
+
+----
+
+## unadlib/mutability: A JavaScript library for transactional mutable updates
+[github.com/unadlib/mutability](https://github.com/unadlib/mutability "unadlib/mutability: A JavaScript library for transactional mutable updates")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">library</span></p>
+
+Immer처럼 API 제공하는 mutative 사용, 트랜잭션 롤백 기능 갖은 객체 갱신하는 라이브러리.
+객체 갱신 처리중에 예외가 발생하는 경우, 그 전까지의 객체 갱신은 파기 됨.
+
+- [unadlib/mutative: Efficient immutable updates, 2-6x faster than naive handcrafted reducer, and more than 10x faster than Immer.](https://github.com/unadlib/mutative "unadlib/mutative: Efficient immutable updates, 2-6x faster than naive handcrafted reducer, and more than 10x faster than Immer.")
+
+----
+<h1 class="site-genre">도서</h1>
+
+----
+
+## 실전 Next.js —— App Router으로 진화하는 Web 애플리케이션 개발 : 서적안내 | 기술평가사
+[gihyo.jp/book/2024/978-4-297-14061-8](https://gihyo.jp/book/2024/978-4-297-14061-8 "실전 Next.js —— App Router으로 진화하는 Web 애플리케이션 개발 : 서적안내 | 기술평가사")
+<p class="jser-tags jser-tag-icon"><span class="jser-tag">Next.js</span> <span class="jser-tag">book</span></p>
+
+2024년 3월 16일 발매
+Next.js 관련한 서적
+
+
+----