All the latest

「モード」をコンポーネントに持たせない理由

2026.09.08

...のではなく、検証可能な場所へ移動した——この記事が実際に語っているのは、それだけです。この考え方は、Reactのコンポーネントに限りません。APIの振る舞い、ドメインロジック、状態機械の分岐にも、同じ...

RefactoringTestingAI

ClaudeMixで扱う技術一覧

2026.06.03

...eデータベースです。スキーマ設計や運用に関する記事を扱います。 Remix RemixおよびReact Router関連技術です。 SSR サーバーサイドレンダリングです。初期表示やパ...

AI

Remix v3 設計判断シリーズ

2026.05.28

React Router v7 / Remix を使って ClaudeMix を構築する中で、「当たり前」とされてきた実装パターンをひとつずつ問い直した考察記録。 ナビゲーションにJS...

Rendering

蜘蛛は巣を張る前に全経路を知っている:Prerender Spider が問い直したSSRの必然性

2026.05.22

...ではない。SSRの汎用性が、静的コンテンツへの静的配信という自然な選択を見えにくくした。 ③ React Router v7 のprerenderは何を優先したのか react-route...

Performance

ブラウザに教えるのか、ブラウザが発見するのか:modulepreload が問い直した依存解決の責務

2026.05.18

...チャンクの存在を知るタイミング】にある。 entry.js を実行する → 「react が必要」と発見 → fetch → react を実行する ...

Performance

色を決めるためにJSを待つな:light-dark() が問い直したテーマ制御の責務

2026.05.15

...alStorage を読む。 useEffect で document に属性を付ける。 Reactがその属性を見て、色を切り替える。 私もそうしていた。 それが「当たり前」だと思っ...

Performance

フレームを先に送れ:HTML Streaming が問い直した「送る単位」の設計判断

2026.05.11

...来ない。そして一気に来た。 SSRが速いのではない。SSRは「全部終わったら速い」だった。 React RouterのHTMLストリーミングを調べたとき、「送る単位を変える」という発想があるこ...

PerformanceRendering

ナビゲーションにJSはいらないのか:Checkbox Hackが問い直した制御の所有者

2026.05.08

...するナビゲーションドロワーは、動く。テストも書ける。チームにも説明しやすい。 問題は、それが 【Reactのハイドレーション完了を前提にしている】 ことだ。 【Hydrationギャップ】...

Rendering

AIに「修正して」と言っている限りバグは直らない

2026.05.04

... 【思想衝突】 AI Delegation vs Problem Framing Reactive Fix vs Structured Comparison AIが消費し...

Testing

API firstのメール基盤:Resendがメール認証に選ばれるシンプルな理由

2026.04.27

...ザクショナルメールが不要な人。 メールテンプレートをHTMLファイルで管理することに問題がなく、React Emailへの移行に関心がない人。 もし一つでも当てはまらないなら、読み進める価...

Compute

React Router v7 移行で typecheck が壊れる4つの原因(Remix v2 → v7)

2026.04.24

はじめに React Router v7 に移行すると、 build は通るのに typecheck が壊れます。 原因はコードではなく、 v7 の仕様変更と型生成方式の変更です。 R...

Routing

React Router v7 移行後、wrangler pages dev で起きる2つの環境問題

2026.04.20

はじめに React Router v7 への移行をAIが完了させた翌朝、 wrangler pages dev でbare-import警告が出始め、Windowsではキャッシュロックで古...

Deployment

アトミック・レンダリング:Lighthouse最適化が露出させるUIの時間的不整合と、Edge時代の可視化制御設計

2026.04.13

...げる副作用を生むことがあります。 本記事では、この問題の本質を「時間的不整合の可視化」と定義し、Reactにおける堅牢な画像表示コンポーネントの設計思想、「アトミック・レンダリング」について解説し...

RenderingPerformance

100点の「神話」を解体する:Remix + Vite が直面する PSI の実用上の上限と賢い撤退戦略

2026.04.03

...バイルではLCPが1秒を切れません。 PSIのSlow 4Gシミュレーション(RTT 150ms)とReactのランタイムコスト(約300〜360 KiB)が構造的な上限を作っており、実装で解決できな...

Performance

E2Eテストを「文言の呪縛」から解放する:extractTestId による契約の分離

2026.03.30

...data-testid='blog-header'])で記述したいという要望がありました。 しかし、Reactコンポーネントの data-testid 属性には、純粋なID値(例:blog-heade...

TestingRefactoring

E2Eテストメイン記事

2026.03.06

...ges シンタックスハイライト負荷 (TypeScript/JSX) import React, { useState, useEffect, useMemo } from '...

Testing

Lighthouse 99点で止めた理由 - 100点を追わないパフォーマンス最適化戦略

2026.03.02

...込み: -750ms JSバンドル: 257 kB → 260 kB に分割 vendor-react: 201 kB vendor-remix: 51 kB vendor: 8 kB...

Performance

AIにRemixを任せる前に知っておくこと ― Reactの歴史がSSRで牙を剥くとき

2026.02.13

...秒待っても発火しませんでした。 原因はコードの論理ではなく、親コンポーネントの再レンダリングのたびにReactがコンポーネントを再マウントしていたことです。 key={loaderData.flash...

Rendering

Lighthouse JavaScript最適化の壁 - 削減できなかった39 KiBから学んだこと

2026.01.30

...46%削減)が成功したので、同じアプローチでJavaScriptも削減できると思いました。しかし、 React.lazy() 、 manualChunks 、 prefetch="none" を順番...

PerformanceRefactoring

claude rules 公式まとめ

2026.01.23

...iptファイル src/components/*.tsx 特定ディレクトリ直下のReactコンポーネント src//*.{ts,tsx} src 配下の ...

AI

AIと育てる型定義 Part 5: UIとデータ層を繋ぐ『生きた仕様書』の完成

2025.12.29

...// ... and more - } - const PostsSection: React.FC<PostsSectionProps> = ({...}) => ...

Refactoring

Cloudflare Workers における React Hooks エラーとの戦い:重複バンドル問題の深堀り

2025.12.19

...や「useState is null」が出ることがあります。 原因はライブラリのバージョンではなく、React がビルドに重複して含まれる「重複バンドル問題」です。 React × Cloudfl...

RenderingDeploymentCompute