Skip to content

Commit 780904d

Browse files
2024-05-12のJS: Headless UI v2.0 for React、Astro v4.8、外部パッケージに依存せずにNode.jsで使えるようになった機能 (#1192)
* Update 692 draft * Update 692 draft * Update 692 draft * Update 692 draft * Update 692 draft * Update 692 draft * Update 692 draft * Update 692 draft * Update 692 draft * Update 692 draft * Update 692 draft * Update 692 draft * Update 692 draft * Update 692 draft * Update 692 draft * Update 692 draft * Update 692 draft * Update _i18n/ja/_posts/2024/2024-05-12-headless-ui-v2.0-for-react-astro-v4.8-node.js.md * Delete _i18n/ja/_posts/2024/2024-05-12-692draft.md * Update _i18n/ja/_posts/2024/2024-05-12-headless-ui-v2.0-for-react-astro-v4.8-node.js.md --------- Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
1 parent 77a536e commit 780904d

File tree

1 file changed

+218
-0
lines changed

1 file changed

+218
-0
lines changed
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,218 @@
1+
---
2+
title: "2024-05-12のJS: Headless UI v2.0 for React、Astro v4.8、外部パッケージに依存せずにNode.jsで使えるようになった機能"
3+
author: "azu"
4+
layout: post
5+
date: 2024-05-12T06:47:28.714Z
6+
category: JSer
7+
tags:
8+
- test
9+
- nodejs
10+
- bundler
11+
- vite
12+
- Hono
13+
14+
---
15+
16+
JSer.info #692 - Headless UI v2.0 for Reactがリリースされました。
17+
18+
- [Headless UI v2.0 for React - Tailwind CSS](https://tailwindcss.com/blog/headless-ui-v2)
19+
20+
Floating UIのanchor指定をサポート、Checkboxコンポーネント、Fieldsetコンポーネント、Comboboxが`virtual` propsをサポートなどの変更が含まれています。
21+
22+
---
23+
24+
Astro 4.8がリリースされました。
25+
26+
- [Astro 4.8 | Astro](https://astro.build/blog/astro-480/)
27+
28+
実験的な機能としてAstro Actions、Request Rewritingの追加が行われています。
29+
また、パフォーマンスの改善や`injectRoute`のバグ修正などの変更が含まれています。
30+
31+
---
32+
33+
[Node.js の進化に伴い不要となったかもしれないパッケージたち](https://zenn.dev/morinokami/articles/npm-uninstall)という記事では、外部パッケージで提供されていた機能の一部がNode.jsにも実装されていることについて紹介されています。
34+
35+
- Fetch API
36+
- `.env`ファイルの読み込み
37+
- `util.styleText`
38+
- `node:test`
39+
- `--watch`フラグ
40+
- `glob`
41+
- `util.parseArgs`
42+
43+
などについて紹介されています。
44+
45+
----
46+
47+
{% include inline-support.html %}
48+
49+
----
50+
51+
<h1 class="site-genre">ヘッドライン</h1>
52+
53+
----
54+
55+
## Release v0.21.0 · evanw/esbuild
56+
[github.com/evanw/esbuild/releases/tag/v0.21.0](https://github.com/evanw/esbuild/releases/tag/v0.21.0 "Release v0.21.0 · evanw/esbuild")
57+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">bundler</span> <span class="jser-tag">ReleaseNote</span></p>
58+
59+
esbuild v0.21.0リリース。
60+
Stage 3のDecorator Proposalのサポート、プライベートメソッドの最適化、バグ修正など
61+
62+
63+
----
64+
65+
## Release v1.6.0 · vitest-dev/vitest
66+
[github.com/vitest-dev/vitest/releases/tag/v1.6.0](https://github.com/vitest-dev/vitest/releases/tag/v1.6.0 "Release v1.6.0 · vitest-dev/vitest")
67+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">vite</span> <span class="jser-tag">test</span> <span class="jser-tag">ReleaseNote</span></p>
68+
69+
vitest v1.6.0リリース。
70+
`--standalone`グラフのサポート、Snapshotをカスタマイズできる`snapshotEnvironment` オプションの追加。
71+
`browser.testerScripts``browser.indexScripts`オプションの追加。
72+
73+
74+
----
75+
76+
## Release v4.3.0 · honojs/hono
77+
[github.com/honojs/hono/releases/tag/v4.3.0](https://github.com/honojs/hono/releases/tag/v4.3.0 "Release v4.3.0 · honojs/hono")
78+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">Hono</span> <span class="jser-tag">ReleaseNote</span></p>
79+
80+
Hono v4.3.0リリース。
81+
Responseに対するクライアント側での型推論の改善、`hono/jsx`のReactとの互換性改善、`createFactory`の追加など
82+
83+
84+
----
85+
86+
## Astro 4.8 | Astro
87+
[astro.build/blog/astro-480/](https://astro.build/blog/astro-480/ "Astro 4.8 | Astro")
88+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">astro</span> <span class="jser-tag">ReleaseNote</span></p>
89+
90+
Astro 4.8リリース。
91+
実験的な機能としてAstro Action、Request Rewritingの追加。
92+
パフォーマンスの改善や`injectRoute`のバグ修正など
93+
94+
95+
----
96+
97+
## Node.js — Node v20.13.0 (LTS)
98+
[nodejs.org/en/blog/release/v20.13.0](https://nodejs.org/en/blog/release/v20.13.0 "Node.js — Node v20.13.0 (LTS)")
99+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">nodejs</span> <span class="jser-tag">ReleaseNote</span></p>
100+
101+
Node.js v20.13.0リリース。
102+
Bufferの`base64``base64url`のパフォーマンス改善、`CustomEvent``node --watch`をStableに変更、`fs/promises`のスタックトレースの追加など
103+
104+
105+
----
106+
107+
## Release v1.44.0 · microsoft/playwright
108+
[github.com/microsoft/playwright/releases/tag/v1.44.0](https://github.com/microsoft/playwright/releases/tag/v1.44.0 "Release v1.44.0 · microsoft/playwright")
109+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">playwright</span> <span class="jser-tag">ReleaseNote</span></p>
110+
111+
playwright v1.44.0リリース。
112+
アクセシビリティ用のAssertionを追加、`page.addLocatorHandler``noWaitAfter`オプションを追加、`page.removeLocatorHandler`メソッドを追加。
113+
前回失敗したテストだけを実行する`--last-failed`フラグの追加など
114+
115+
116+
----
117+
118+
## Release v2.3.0 · mswjs/msw
119+
[github.com/mswjs/msw/releases/tag/v2.3.0](https://github.com/mswjs/msw/releases/tag/v2.3.0 "Release v2.3.0 · mswjs/msw")
120+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">JavaScript</span> <span class="jser-tag">test</span> <span class="jser-tag">library</span></p>
121+
122+
msw 2.3.0リリース。
123+
ハンドラー内でのnhandled exceptionは500エラーとなるように変更、`unhandledException`イベントを追加など
124+
125+
126+
----
127+
128+
## Release v9.0.0 · sindresorhus/execa
129+
[github.com/sindresorhus/execa/releases/tag/v9.0.0](https://github.com/sindresorhus/execa/releases/tag/v9.0.0 "Release v9.0.0 · sindresorhus/execa")
130+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">nodejs</span> <span class="jser-tag">ReleaseNote</span></p>
131+
132+
execa v9.0.0リリース。
133+
zx的なTemplate Literalでのコマンド実行をサポート、行ごとに出力を処理できるように、入力や出力のフィルター、`verbose`モードの改善など
134+
135+
- [Execa 9: our biggest release. Execa runs commands in your scripts. | by ehmicky | Medium](https://medium.com/@ehmicky/execa-9-release-d0d5daaa097f "Execa 9: our biggest release. Execa runs commands in your scripts. | by ehmicky | Medium")
136+
137+
----
138+
139+
## Bun v1.1.8 | Bun Blog
140+
[bun.sh/blog/bun-v1.1.8](https://bun.sh/blog/bun-v1.1.8 "Bun v1.1.8 | Bun Blog")
141+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">Bun</span> <span class="jser-tag">ReleaseNote</span></p>
142+
143+
Bun v1.1.8リリース。
144+
`process.on("uncaughtException")``process.on("unhandledRejection")`のサポート。
145+
`node:zlib`でBrotli APIをサポート、Bun APIがExplicit Resource Managementをサポートなど
146+
147+
148+
----
149+
150+
## Headless UI v2.0 for React - Tailwind CSS
151+
[tailwindcss.com/blog/headless-ui-v2](https://tailwindcss.com/blog/headless-ui-v2 "Headless UI v2.0 for React - Tailwind CSS")
152+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">React</span> <span class="jser-tag">library</span> <span class="jser-tag">ReleaseNote</span></p>
153+
154+
Headless UI v2.0リリース。
155+
Floating UIのanchor指定をサポート、Checkboxコンポーネント、Fieldsetコンポーネント、Comboboxが`virtual` propsをサポートなど
156+
157+
158+
----
159+
160+
## Release 7.0.0 · jasonkuhrt/graphql-request
161+
[github.com/jasonkuhrt/graphql-request/releases/tag/7.0.0](https://github.com/jasonkuhrt/graphql-request/releases/tag/7.0.0 "Release 7.0.0 · jasonkuhrt/graphql-request")
162+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">GraphQL</span> <span class="jser-tag">library</span> <span class="jser-tag">ReleaseNote</span></p>
163+
164+
graphql-request 7.0リリース。
165+
cross-fetchのpolyfillを削除、Pure ESMに変更など
166+
167+
168+
----
169+
<h1 class="site-genre">アーティクル</h1>
170+
171+
----
172+
173+
## Node.js の進化に伴い不要となったかもしれないパッケージたち
174+
[zenn.dev/morinokami/articles/npm-uninstall](https://zenn.dev/morinokami/articles/npm-uninstall "Node.js の進化に伴い不要となったかもしれないパッケージたち")
175+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">nodejs</span> <span class="jser-tag">article</span></p>
176+
177+
Node.jsのコアモジュールなどに実装されたパッケージの機能紹介。
178+
Fetch API、`.env`のロード、`util.styleText``node:test``--watch`フラグ、`glob``util.parseArgs`などについて
179+
180+
181+
----
182+
183+
## TypeScript の型検査にかかる時間を短縮した話
184+
[zenn.dev/knowledgework/articles/speedup-typecheck](https://zenn.dev/knowledgework/articles/speedup-typecheck "TypeScript の型検査にかかる時間を短縮した話")
185+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">TypeScript</span> <span class="jser-tag">article</span></p>
186+
187+
TypeScriptの型チェックのパフォーマンスチェックと改善について
188+
189+
190+
----
191+
192+
## Misconceptions about CSS Specificity – Bram.us
193+
[www.bram.us/2024/05/05/misconceptions-about-css-specificity/](https://www.bram.us/2024/05/05/misconceptions-about-css-specificity/ "Misconceptions about CSS Specificity – Bram.us")
194+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">CSS</span> <span class="jser-tag">article</span></p>
195+
196+
CSSのSpecificityについて
197+
198+
199+
----
200+
201+
## Monitor Third-Party Resources that Impact UX with Playwright
202+
[www.checklyhq.com/blog/how-playwright-can-monitor-third-party-resources/](https://www.checklyhq.com/blog/how-playwright-can-monitor-third-party-resources/ "Monitor Third-Party Resources that Impact UX with Playwright")
203+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">browser</span> <span class="jser-tag">test</span> <span class="jser-tag">article</span></p>
204+
205+
PlaywrightのRequest Block/Delayを使ってユーザー影響のあるサードパーティスクリプトを特定する方法について
206+
207+
208+
----
209+
210+
## Why Patching Globals Is Harmful - kettanaito.com
211+
[kettanaito.com/blog/why-patching-globals-is-harmful](https://kettanaito.com/blog/why-patching-globals-is-harmful "Why Patching Globals Is Harmful - kettanaito.com")
212+
<p class="jser-tags jser-tag-icon"><span class="jser-tag">Fetch</span> <span class="jser-tag">JavaScript</span> <span class="jser-tag">article</span> <span class="jser-tag">opinion</span></p>
213+
214+
Global APIにmonkey patchする弊害について。
215+
Fetch APIの仕様を各種上書きしているReact/Next.js/Bunについて
216+
217+
218+
----

0 commit comments

Comments
 (0)