Skip to content

Commit f2bc981

Browse files
authored
translate: 2024-04-26 article (#1189)
1 parent ff88fed commit f2bc981

2 files changed

+241
-1
lines changed

_i18n/ja/_posts/2024/2024-04-26-electron-30-firefox-125-node.js-22-react-19-beta-typescript-5.5-beta.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -133,7 +133,7 @@ Server Component/Server Actionのサポート、`forwardRef`が不要となる
133133
Hydrationのエラーの表示の改善、`<Context>`自体が`<Context.Provider>`としての機能を持つように変更、`ref`のcleanup処理を定義できるように。
134134
`useDeferredValue`の第二引数に初期値をサポート、`<title>`などのメタデータタグのサポート、`<link ref=stylesheet>`でのスタイルシートのサポート。
135135
`<script async={true}>`のサポート、`preload`などの`<link rel=preload>`を扱う関数を追加。
136-
React 18ではサードパーティによってHTMLが改変されたときはHydration時にレンダリングし直すことで消えていたが、残るように変更、Custme Elementのサポートなど。
136+
React 18ではサードパーティによってHTMLが改変されたときはHydration時にレンダリングし直すことで消えていたが、残るように変更、Custom Elementのサポートなど。
137137

138138

139139
----
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,240 @@
1+
---
2+
title: "2024-04-26: Electron 30, Firefox 125, Node.js 22, React 19 Beta, TypeScript 5.5 Beta"
3+
author: "azu"
4+
translator: rewrite0w0
5+
layout: post
6+
date: 2024-04-26T02:31:56.430Z
7+
category: JSer
8+
tags:
9+
- React
10+
- Electron
11+
- Firefox
12+
- JSON
13+
- Tools
14+
15+
---
16+
17+
JSer.info #690 - Electron 30.0.0가 출시되어요.
18+
19+
- [Electron 30.0.0 | Electron](https://www.electronjs.org/blog/electron-30-0)
20+
21+
V8 12.4, Chromium 124, Node.js 20.11.1으로 업데이트.
22+
File System API 지원, Cross Origin iframe에 Permission Policy 사용하도록 변경, `WebContentsView`/`BaseWindow` 폐기도 있어요.
23+
24+
---
25+
26+
Firefox 125가 출시되어요.
27+
28+
- [Firefox 125.0.1, See All New Features, Updates and Fixes](https://www.mozilla.org/en-US/firefox/125.0.1/releasenotes/)
29+
- [Firefox 125 for developers - Mozilla | MDN](https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/125)
30+
31+
`Intl.Segmenter` 지원, Popover API 지원, AV1 코덱 지원, Wasm의 Multi Memory 지원이 추가되어요.
32+
33+
---
34+
35+
Node.js 22가 출시되어요.
36+
37+
- [Node.js — Node.js 22 is now available!](https://nodejs.org/en/blog/announcements/v22-release-announce)
38+
39+
Node.js 22.x은 2024-10-29에 [LTS](https://github.com/nodejs/release#release-schedule)이 될 예정이 있는 메이저 버전이에요.
40+
41+
V8 12.4으로 업데이트, `require()`에서 ESM 모듈 로드 지원하는 `--experimental-require-module` 플래그 추가가 있어요.
42+
또한 npm run-script 실행하는 `node --run <script>` 추가, `node --watch` 플래그 추가, WebSocket 기본적으로 유효, `node:fs``glob` 추가가 있어요.
43+
그 외로는, Stream의 High Water Mark 기본값을 16KiB에서 64KiB로 변경했어요.
44+
45+
---
46+
47+
React 19 Beta가 출시되어요.
48+
49+
- [React 19 Beta – React](https://react.dev/blog/2024/04/25/react-19)
50+
51+
Action 개념 도입과 `useActionState`/`useFormStatus` 추가가 있어요.
52+
낙관적 갱신을 다루는 `useOptimistic`, Promise를 unwrap하는 `use` 추가되어요.
53+
Server Component/Server Action 지원, `forwardRef`가 필요하지 않도록 변경되어요.
54+
55+
---
56+
57+
TypeScript 5.5 Beta가 출시되어요.
58+
59+
- [Announcing TypeScript 5.5 Beta - TypeScript](https://devblogs.microsoft.com/typescript/announcing-typescript-5-5-beta/)
60+
61+
함수에서 type predicates 추론이 가능해져, `Array.prototype.filter` 필터링을 간결하게 쓸 수 있어요.
62+
63+
- [The Making of a TypeScript Feature: Inferring Type Predicates](https://effectivetypescript.com/2024/04/16/inferring-a-type-predicate/)
64+
65+
JSDoc에서 `@import {foo} from "foo"` 지원, 정규표현 기본적 구문 체크 지원, `isolatedDeclarations` 지원이 추가되어요.
66+
또한, `out`이나 `target: ES3` 등 비권장이 된 옵션 무효화되어, `ignoreDeprecations` 옵션 지정하지 않으면 이용할 수 없어요.
67+
68+
69+
70+
----
71+
72+
{% include inline-support.html %}
73+
74+
----
75+
76+
<h1 class="site-genre">헤드라인</h1>
77+
78+
----
79+
80+
## Electron 30.0.0 | Electron
81+
[www.electronjs.org/blog/electron-30-0](https://www.electronjs.org/blog/electron-30-0 "Electron 30.0.0 | Electron")
82+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">Electron</span> <span class="jser-tag">ReleaseNote</span></p>
83+
84+
Electron 30 출시.
85+
V8 12.4, Chromium 124, Node.js 20.11.1으로 업데이트.
86+
File System API 지원, Cross Origin iframe에 Permission Policy 사용하도록 변경, `WebContentsView`/`BaseWindow` 폐기
87+
88+
89+
----
90+
91+
## Firefox 125.0.1, See All New Features, Updates and Fixes
92+
[www.mozilla.org/en-US/firefox/125.0.1/releasenotes/](https://www.mozilla.org/en-US/firefox/125.0.1/releasenotes/ "Firefox 125.0.1, See All New Features, Updates and Fixes")
93+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">Firefox</span> <span class="jser-tag">ReleaseNote</span></p>
94+
95+
Firefox 125 출시.
96+
`Intl.Segmenter` 지원, Popover API 지원, AV1コーデック 지원, Wasm의 Multi Memory 지원
97+
98+
- [Firefox 125 for developers - Mozilla | MDN](https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/125 "Firefox 125 for developers - Mozilla | MDN")
99+
- [WebAssembly/multi-memory: Multiple per-module memories for Wasm](https://github.com/WebAssembly/multi-memory "WebAssembly/multi-memory: Multiple per-module memories for Wasm")
100+
101+
----
102+
103+
## Node.js — Node.js 22 is now available!
104+
[nodejs.org/en/blog/announcements/v22-release-announce](https://nodejs.org/en/blog/announcements/v22-release-announce "Node.js — Node.js 22 is now available!")
105+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">nodejs</span> <span class="jser-tag">ReleaseNote</span></p>
106+
107+
Node.js 22 출시.
108+
V8 12.4으로 업데이트, `require()`에서 ESM 모듈 로드 지원하는 `--experimental-require-module` 플래그 추가.
109+
npm run-script 실행하는 `node --run <script>` 추가, `node --watch` 플래그 추가, WebSocket 기본적으로 유효, `node:fs``glob` 추가.
110+
Stream의 High Water Mark 기본값을 16KiB에서 64KiB로 변경.
111+
112+
113+
----
114+
115+
## React Native 0.74 - Yoga 3.0, Bridgeless New Architecture, and more · React Native
116+
[reactnative.dev/blog/2024/04/22/release-0.74](https://reactnative.dev/blog/2024/04/22/release-0.74 "React Native 0.74 - Yoga 3.0, Bridgeless New Architecture, and more · React Native")
117+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">React</span> <span class="jser-tag">iOS</span> <span class="jser-tag">Android</span> <span class="jser-tag">ReleaseNote</span></p>
118+
119+
React Native 0.74 출시.
120+
레이아웃 엔진 Yoga 3.0로 업그레이드, Bridgeless가 기본값으로 변경, `onLayout`에서 State 갱신 배치화되도록.
121+
Android의 최소 SDK 버전 (Android 6.0)으로 변경, PropTypes 삭제
122+
123+
124+
----
125+
126+
## React 19 Beta – React
127+
[react.dev/blog/2024/04/25/react-19](https://react.dev/blog/2024/04/25/react-19 "React 19 Beta – React")
128+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">React</span> <span class="jser-tag">ReleaseNote</span></p>
129+
130+
React 19 Beta 출시.
131+
Action 개념 도입 및 `useActionState`/`useFormStatus` 추가.
132+
낙관적 갱신을 다루는 `useOptimistic`, Promise를 unwrap하는 `use` 추가.
133+
Server Component/Server Action 지원, `forwardRef`가 필요하지 않게 변경.
134+
Hydration 에러 표시 개선, `<Context>` 자체가 `<Context.Provider>`으로 기능을 갖도록 변경, `ref`의 cleanup 처리 정의 가능함.
135+
`useDeferredValue`의 제2인수 초기화 지원, `<title>` 같은 메타 태그 지원, `<link ref=stylesheet>`에서 스타일시트 지원.
136+
`<script async={true}>` 지원, `preload` 등에서 `<link rel=preload>` 다루는 함수 추가.
137+
React 18에서는 서드파티에 의해 HTML이 수정되면 Hydration 시 다시 렌더링하여 사라지던 것을 남아있도록 변경, Custom Element 지원 등으로 변경.
138+
139+
140+
----
141+
142+
## Release Version 2.0.0 · quilljs/quill
143+
[github.com/quilljs/quill/releases/tag/v2.0.0](https://github.com/quilljs/quill/releases/tag/v2.0.0 "Release Version 2.0.0 · quilljs/quill")
144+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">library</span> <span class="jser-tag">ReleaseNote</span></p>
145+
146+
Quill 2.0 출시.
147+
TypeScript 빌트인 지원, `registry` 추가, 도큐멘트 모델과 동기적으로 InputEvent 사용하도록 변경.
148+
149+
- [Announcing Quill 2.0 - Knock Down Silos by Slab](https://slab.com/blog/announcing-quill-2-0/ "Announcing Quill 2.0 - Knock Down Silos by Slab")
150+
151+
----
152+
153+
## What’s new in Apollo Client 3.10 | Apollo GraphQL Blog
154+
[www.apollographql.com/blog/whats-new-in-apollo-client-3-10](https://www.apollographql.com/blog/whats-new-in-apollo-client-3-10 "What’s new in Apollo Client 3.10 | Apollo GraphQL Blog")
155+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">GraphQL</span> <span class="jser-tag">JavaScript</span> <span class="jser-tag">library</span> <span class="jser-tag">ReleaseNote</span></p>
156+
157+
Apollo Client 3.10 출시.
158+
`@apollo/client/testing/experimental`에 MSW 연계해서 스키마 주도 테스트 하는 `createTestSchema` 추가, `client.watchFragment` 추가.
159+
`createQueryPreloader`를 Stable으로 변경
160+
161+
- [Release v3.10.0 · apollographql/apollo-client](https://github.com/apollographql/apollo-client/releases/tag/v3.10.0 "Release v3.10.0 · apollographql/apollo-client")
162+
163+
----
164+
165+
## Announcing TypeScript 5.5 Beta - TypeScript
166+
[devblogs.microsoft.com/typescript/announcing-typescript-5-5-beta/](https://devblogs.microsoft.com/typescript/announcing-typescript-5-5-beta/ "Announcing TypeScript 5.5 Beta - TypeScript")
167+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">TypeScript</span> <span class="jser-tag">ReleaseNote</span></p>
168+
169+
TypeScript 5.5 출시.
170+
함수에서 type predicates 추론 가능하도록, `Array.prototype.filter` 등에서 필터링 간결하게 작성 가능.
171+
JSDoc에서 `@import {foo} from "foo"` 지원, 정규표현 기본적 구문 체크 지원, `isolatedDeclarations` 지원.
172+
설정 파일 내에 `${configDir}` 템플릿 값 지원.
173+
`typescript` 패키지 크기 절감, Named Import 지원, `transpileDeclaration` API 추가.
174+
`out`이나 `target: ES3` 같이 비권장 옵션 무효화, `ignoreDeprecations` 옵션 지정하지 않으면 사용할 수 없도록 변경
175+
176+
- [The Making of a TypeScript Feature: Inferring Type Predicates](https://effectivetypescript.com/2024/04/16/inferring-a-type-predicate/ "The Making of a TypeScript Feature: Inferring Type Predicates")
177+
178+
----
179+
<h1 class="site-genre">읽을거리</h1>
180+
181+
----
182+
183+
## Rspack v1.0 Release Plan · web-infra-dev/rspack · Discussion #6315
184+
[github.com/web-infra-dev/rspack/discussions/6315](https://github.com/web-infra-dev/rspack/discussions/6315 "Rspack v1.0 Release Plan · web-infra-dev/rspack · Discussion #6315")
185+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">rspack</span> <span class="jser-tag">article</span></p>
186+
187+
Rspack 로드맵.
188+
2024년 7월 Rspack 1.0 출시 예정
189+
190+
191+
----
192+
193+
## HTML attributes vs DOM properties - JakeArchibald.com
194+
[jakearchibald.com/2024/attributes-vs-properties/](https://jakearchibald.com/2024/attributes-vs-properties/ "HTML attributes vs DOM properties - JakeArchibald.com")
195+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">HTML</span> <span class="jser-tag">DOM</span> <span class="jser-tag">JavaScript</span> <span class="jser-tag">article</span></p>
196+
197+
HTML 속성과 DOM 프로퍼티 차이에 대하여.
198+
속성과 프로퍼티 타입 차이, 대소문자 구별, Reflection에 대하여.
199+
Preact/Vue이나 React 같은 UI 프레임워크에서의 취급 등
200+
201+
202+
----
203+
<h1 class="site-genre">슬라이드, 영상</h1>
204+
205+
----
206+
207+
## LavaMoat/LavaDome: Secure DOM trees isolation and encapsulation leveraging ShadowDOM
208+
[github.com/LavaMoat/LavaDome](https://github.com/LavaMoat/LavaDome "LavaMoat/LavaDome: Secure DOM trees isolation and encapsulation leveraging ShadowDOM")
209+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">WebComponents</span> <span class="jser-tag">security</span> <span class="jser-tag">library</span></p>
210+
211+
Shadow DOM 사용해 같은 Origin에서 실행되고 있는 JavaScript에서 접근 할 수 없는 DOM 다루는 라이브러리
212+
213+
214+
----
215+
<h1 class="site-genre">웹사이트, 서비스, 문서</h1>
216+
217+
----
218+
219+
## React의 규칙 – React
220+
[ja.react.dev/reference/rules](https://ja.react.dev/reference/rules "React의 규칙 – React")
221+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">React</span> <span class="jser-tag">docue</span> <span class="jser-tag">translate</span></p>
222+
223+
Rules of React 일본어 번역.
224+
React 애플리케이션을 작성할 때 규칙에 대해 언급되어있음
225+
226+
- [Rules of React – React](https://react.dev/reference/rules "Rules of React – React")
227+
228+
----
229+
<h1 class="site-genre">소프트웨어, 도구, 라이브러리</h1>
230+
231+
----
232+
233+
## JSON Fixer
234+
[jsonfixer.com/](https://jsonfixer.com/ "JSON Fixer")
235+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">JSON</span> <span class="jser-tag">Tools</span></p>
236+
237+
JSON스러운 것을 JSON으로 수정해주는 도구
238+
239+
240+
----

0 commit comments

Comments
 (0)