JSer.info #718 - React v19がリリースされました。

2年半ぶりのメジャーリリースとなります。
非同期遷移を扱うアクションの概念の追加とuseActionState/useFormStatus/useOptimistic/use APIの追加が行わなわれています。
また、react-domにprerender APIの追加、Server ComponentとServer Actionの追加が行われています。

そのほかの改善として、refをpropsとして渡す際にforwardRefは不要に、Hydration Errorの改善、ref callbackがcleanup関数を返せるようになりました。
<title>/<meta>/<link>などのメタタグをサポート、<link rel=stylesheet>や<script async={true} src=...>のサポートも追加されています。
また、リソースのpreload APIのサポート、Custom Elementをサポートなども行われています。

Next.jsは15.1でReact v19のStableをサポートしています。

Next.js 15.1 | Next.js

Astro 5.0がリリースされました。

Content Layerの改善、Server Islands/astro:envをStableに、Vite 6へアップデートなどが行われています。

HTTP Archiveのデータを元にしたウェブのステータスをまとめたレポートであるThe 2024 Web Almanacがリリースされました。

The 2024 Web Almanac

HTML/CSS/JavaScript/Performance/Accessibility/SEO/Securityなど幅広い項目にわたって調査されたレポートがまとめられています。

JSer.infoをサポートするには

😘 知り合いにJSer.infoをおすすめする
❤️ GitHub Sponsorsで@azuのスポンサーになる
🐦 X(Twitter)で@jser_infoをフォローする

JSer.info Sponsors

JSer.info SponsorsはGitHub SponsorsとしてJSer.infoを支援してくれている方々です。

ヘッドライン

React v19 – React

react.dev/blog/2024/12/05/react-19

React ReleaseNote

React 19リリース。
非同期遷移を扱うアクションの概念の追加とuseActionState/useFormStatus/useOptimistic/use APIの追加。
react-domにprerender APIの追加、Server ComponentとServer Actionの追加。
refをpropsとして渡す際にforwardRefは不要に、Hydration Errorの改善、ref callbackがcleanup関数を返せるように。
<title>/<meta>/<link>などのメタタグをサポート、<link rel=stylesheet>や<script async={true} src=...>をサポート。
リソースのpreload APIのサポート、Custom Elementをサポートなど

ECMAScript proposal updates @ 2024-12 | ECMAScript Daily

ecmascript-daily.github.io/ecmascript/2024/12/08/ecmascript-proposal-update

ECMAScript news

2024年12月のTC39ミーティングでのECMAScript Proposalのステータス変更のまとめ。
Sync Importsの追加、Error.isErrorがStage 3に、Intl.DurationFormatがStage 4となるなど

Astro 5.0 | Astro

astro.build/blog/astro-5/

astro ReleaseNote

Astro 5.0リリース。
Content Layerの改善、Server Islands/astro:envをStableに、Vite 6へアップデートなど

astro/packages/astro/CHANGELOG.md at main · withastro/astro

Next.js 15.1 | Next.js

nextjs.org/blog/next-15-1

Next.js ReleaseNote

Next.js 15.1リリース。
React 19 Stableに対応、Source Mapsの改善、エラースタックトレースの改善。
実験的な機能としてforbidden()とunauthorized()を追加、<link>と<style>のインライン化の対応。

アーティクル

改めて学ぶ satisfies 演算子

zenn.dev/okkun/articles/ed6f146e03c60a

TypeScript article

TypeScriptのsatisfies演算子の使い方について

ニコニコ生放送のアプリケーションにRspackを導入している話

zenn.dev/thiry/articles/0f671d086b2fb0

webpack rspack article

webpackからrspackへの移行について。
css modules周りのいくつかの動作の問題があるが、ほとんどの部分でwebpackと互換性がある状態でbundleのパフォーマンスが改善できたという話

Introducing Nuxt Icon v1 · Nuxt Blog

nuxt.com/blog/nuxt-icon-v1-0

Nuxt article

Nuxt Icon v1.0リリース。
アイコンロードの方法の比較とNuxt Iconでの実装について。
imgタグ/Webフォント/インラインSVG/動的なAPI/コンポーネント/CSSアイコンのアプローチの比較。
Nuxt Iconで時はCSSモードとSVGモードを両方サポートし、アイコンごとに切り替えられる。