RN と Flutter で実行環境の互換性、段階配布の指標、復旧手順を確認する。
- モバイル公開のゲート：バイナリ・更新・ロールバック
- Flutter 機能テストの分担：Repository・Widget・実機
注文画面を例に、単体・Widget・統合テストの責務を切り分ける。
- React Native のネイティブ機能：API 境界と失敗の意味
スキャンや生体認証を権限、キャンセル、ライフサイクルまで含めて設計する。
- Flutter フォームの非同期検証：古い結果で新しい入力を上書きしない
入力の世代管理、防振、送信の重複防止、サーバーエラーの反映を扱う。
- React Native の通知遷移：プッシュとアプリ内受信箱を一致させる
前景・背景・コールドスタートで通知を重複排除し、サーバーの状態と照合する。
- モバイルのセッション管理：トークンと複数アカウントの分離
安全な保存、更新要求の一本化、ログアウト時の破棄を設計する。
- モバイルのディープリンク：ログイン後の遷移と外部入力の境界
React Native と Flutter のリンクを外部入力として検証し、重複起動も扱う。
- Flutter のフレーム落ち調査：重い Widget を特定する
profile モードとフレーム時間軸で build・layout・描画の負荷を分ける。
- React Native の長い一覧が重いとき：FlatList を調整する前に測る
本番に近いビルドで JS、レイアウト、画像の負荷を切り分ける。
- モバイル画面の状態設計：読み込み中・オフライン・古いデータ
スナップショットと通信状態を分け、React Native と Flutter で信頼できるデータを表示し続ける。
- Flutter のオフライン書き込みキュー：下書き・再試行・競合
ローカルキュー、冪等キー、競合状態、復旧手順を設計する。
- React Native の復帰時更新：古い一覧を表示しないために
AppState、リクエスト世代、サーバー側の版情報を使い、復帰後の画面データを検証する。
- DApp フロントエンドリアルタイムデータ購読アーキテクチャ：WebSocket、Reorg、マルチタブ同期
dApp フロントエンドのリアルタイムデータは WebSocket を繋ぐだけでは済まない。本記事では WS provider 購読 vs ポーリング vs indexing service の選定、切断再接続・再購読戦略、チェーン上の reorg の UI 状態での処理、BroadcastChannel によるマルチタブ同期、そして TanStack Query による購読と REST スナップショットの統合パターンを網羅する。
- Angular 23 Hydration 上級：インクリメンタルハイドレーションと Zoneless 実践
Angular 23 の hydration はもはや全量アクティベーションだけではない。本記事では @defer hydrate トリガー、選択的ハイドレーション境界、zoneless との連携、TBT/INP 測定、コンテンツページとダッシュボードの異なる戦略について、マーケティングサイトの移行における実データと落とし穴の経験を記録する。
- フロントエンド契約テスト：Consumer-Driven Contract で API ドリフトを終結させる
mock 単体テストと手動統合テストがバックエンド API の変更を繰り返し見逃すとき、Consumer-Driven Contract Testing は契約の定義権をフロントエンドに委ねる。本記事では Pact と OpenAPI の 2 つの路線から、4 フロントエンドが BFF を共有するチームでの導入過程、落とし穴、そして成果を記録する。
- pnpm Monorepo 依存関係自動アップグレード：Renovate 設定と CI ゲート実践
pnpm monorepo で依存関係の自動アップグレードを導入するには、Renovate を入れるだけでは不十分だ。本記事ではグループ化戦略、automerge の段階分け、lockfile-only 更新、CI ゲート（typecheck/テスト/bundle size）、breaking change codemod 統合、セキュリティ脆弱性対応フローを網羅し、チームでの実際の推進データも付す。
- CSS Style Queries 実践：カスタムプロパティで駆動するコンポーネントバリアント
CSS Style Queries（@container style(...)）が Baseline 2026 に到達し、ついにカスタムプロパティの値に基づいてスタイルを適用できるようになった。本記事は実際の使い方に焦点を当てる：class に頼らないテーマ切り替え、custom property で駆動するコンポーネントバリアント、@property との連携、そしてフォールバック戦略。
- Vue SSR Streaming レンダリング：2026 年のストリーミングアーキテクチャと選択的 Hydration
Vue SSR は Vapor の時代において vue-server-renderer から renderToStream + 選択的 Hydration へと進化している。本記事では内部管理システムの CSR から公開サイトの SSR への移行経験をもとに、ストリーミングレンダリング、hydration mismatch のデバッグ、CDN edge streaming 統合などの核心的な課題を網羅する。
- React Router 7 Framework Mode 移行記録：SPA + API からフルスタックフレームワークへ
内部ダッシュボードを従来の SPA + Express API アーキテクチャから React Router 7 framework mode に移行した全過程を記録。routes.ts 設定、loader/action のデータフロー設計、single-fetch と typegen、hydration の罠、Error Boundary UX、そして declarative mode を使い続けるべきタイミングについても論じる。
- Long Animation Frame API 実践：帰属の盲点から INP 精密最適化へ
PerformanceObserver long-animation-frame（LoAF）API は Long Task API の帰因不能という核心的な欠陥を解決する。本記事では LoAF のフィールドの意味、本番環境での収集方法を解説し、サードパーティスクリプトのブロッキング、長いレンダリングパス、スタイル・レイアウトスラッシングの 3 つの実例を通じて、LoAF を活用した INP 最適化の方法を示す。
1 / 76