We've been building a bridge. You can hear Ryan talk about this announcement at React Conf 🎥 For nearly 4 years we've been working on Remix, a fullstack framework built on web standards to help you build better websites and applications. React Router has always been Remix's largest dependency after React itself. The two projects are so closely aligned that we updated React Router to include Remix
React Aria Components は Adobe によって提供されている Headless UI コンポーネントライブラリです。振る舞いや国際化に, アクセシビリティに関する機能を備えており、Button や Input, TextField, Label などのシンプルな要素から、DatePicker や ComboBox などの様々なコンポーネントが提供されています。 今回は React Aria Components の設計について紹介します。 React Aria Components のコンポーネントの設計 React Aria Components の API はコンポジションを中心に設計されています。これにより、パターン間で共通のコンポーネントを共有することも、個別に使用することも可能です。なお、コンポジションについては React Component Compos
React Compiler is a new experimental compiler that we’ve open sourced to get early feedback from the community. It still has rough edges and is not yet fully ready for production. React Compiler requires React 19 Beta. React Compiler is a new experimental compiler that we’ve open sourced to get early feedback from the community. It is a build-time only tool that automatically optimizes your React
React Router とは React Router のルートのマッチング React Router のドキュメントのRanking Routesのセクションを例として説明します。 以下の 5 つのパスパターンを取り得るアプリケーションがあるとして、/teams/newというパスが与えられたときに、どのパスパターンがマッチするでしょうか。 [ "/", "/teams", "/teams/:teamId", "/teams/:teamId/edit", "/teams/new", ]; React Router はここからさらにルートをランク付けし、最終的に/teams/newを最もマッチするルートとして採用します。 どのようにルートをランク付けするか ランク付けというのは、ルートがどれだけパスにマッチするかを評価することです。React Router は、ルートのパスパターンと与えら
この記事はlocation-stateをconformに対応させるために開発した、@location-state/conformの紹介記事です。 location-stateとは location-stateは履歴位置に同期する状態管理ライブラリです。主にNext.jsをサポートしています。 Next.jsなどを採用している場合、ページ内のuseStateは遷移時のunmountで状態が破棄され、ブラウザバック時には復元されません。そのため、アコーディオンやform要素の状態はブラウザバック時にはリセットされてしまいます。これはNext.jsに限らず、ReactやVueなどをベースにしたモダンなフロントエンドフレームワークを採用して、クライアントサイドルーティングが発生する場合に起きがちな挙動です。クライアントサイドルーティングが不在なMPAでは、bfcacheやブラウザ側の復元処理によっ
React Compiler を試す
はじめに 先日 React Compiler がオープンソース化されました。 ソースコードはこちら。 公式ドキュメントにも React Compiler のページが追加されています。 この記事では React Compiler を簡単に試してみたいと思います。React Compiler の登場背景や詳しい解説などは、公式ドキュメントや React チームのブログを参照してください。(タイトルに React Labs とついているブログで詳しく書かれています) 検証 React Compiler は useMemo や useCallback、React.memo を使わずとも、無駄な再レンダリングを抑制してくれるコンパイラです。それが本当に機能するのか、簡単なサンプルを作成して検証します。 まずプロジェクトを作成します。今回は手軽な Vite を使用しますが、Next.js や Webp
Have you ever thought about why a specific piece of technology gets popular? Usually there's never a single reason, but I do have a theory that I think is one of the primary drivers. I call it The 5 O'Clock Rule. With The 5 O'Clock Rule, the level of abstraction for solving a problem will bubble up until it allows the average developer to stop thinking about the problem. Unfortunately, it doesn't
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Merging Remix and React Router
拡張性に優れた React Aria のコンポーネント設計
React Compiler – React
React Routerはルートをどうランク付けしているか
@location-state/conformをリリースした
Why React Query?