JavaScript 【テクニカル・上級編】 文字列プリミティブとStringオブジェクトの差異 – JavaScript実践ガイド
こんにちは。現場の最前線でコードの澱（おり）と日々格闘しているフロントエンド・チーフアーキテクトだ。今日もコードレビューをしていて、若手の手によるこんなコードを見かけた。// レビューで見かけた「恐怖のコード」const userId = ...
frontendintronational
JavaScript CSS 【テクニカル・上級編】 :read-write 疑似クラス – CSS実践ガイド
編集可能を「監視する」ということ：`:read-write` が開くフロントエンドの深淵こんにちは。日々、CSSのセレクタがブラウザのパーサーをどう駆け抜け、レイアウトツリーをどう揺さぶっているかに思いを馳せているフロントエンド・アーキテク...
HTML 【テクニカル・上級編】リストアイテムの選択状態管理 – HTML実践ガイド
リストの選択状態管理、その「当たり前」を疑う ― `aria-selected` とDOMの深淵フロントエンドエンジニア諸君、リストの選択状態管理をどう実装しているだろうか？「`ul` と `li` を並べて、クリックされたら `activ...
React 【テクニカル・上級編】 カスタムフックにおける依存関係の管理と引数設計 – React実践ガイド
カスタムフック設計の極み：依存配列の迷宮と引数インターフェースの数学的解法やあ。日夜、V8エンジンの機嫌を取りながら、Reactのレンダリングパイプラインと格闘している君なら、一度はこんな絶望を味わったことがあるはずだ。「なぜ、このカスタム...
TypeScript 【テクニカル・上級編】 NoInferユーティリティ型による推論制御 – TypeScript実践ガイド
TypeScript 5.4の隠し玉：NoInferが生む「推論汚染」への防壁ブラウザのV8エンジンがJITコンパイルでミリ秒を削り出し、ReactのConcurrent Modeがレンダリングの優先順位制御に血道を上げる現代のフロントエン...
Webブラウザの仕組み 【テクニカル・上級編】 投機的パース（Speculative Parsing） – Webブラウザの仕組み実践ガイド
投機的パース（Speculative Parsing）：メインスレッドの足かせを外す、ブラウザエンジンの極限の裏技フロントエンドエンジニアの仕事とは、突き詰めれば「ブラウザという名の超高速かつ気まぐれなバーチャルマシンをいかに手なずけるか」...
JavaScript 【テクニカル・上級編】 @deprecatedによる非推奨の警告 – JavaScript実践ガイド
負債を美しく刈り取る技術：`@deprecated`で型チェックとRuntimeを制覇するフロントエンドのアーキテクチャがどれほど洗練されていなかろうと、プロダクトが成長し、市場の荒波をくぐり抜けていく過程において、「技術的負債」の蓄積を完...
CSS 【テクニカル・上級編】 :read-only 疑似クラス – CSS実践ガイド
`:read-only` 疑似クラスの深層：フォームの境界線を制するアーキテクチャこんにちは。日々、CSSのセレクタエンジンとブラウザの再描画パイプラインの最適化に情熱を燃やすフロントエンド・アーキテクトの私だ。モダンなWebアプリケーショ...
HTML 【実務・中級編】リストアイテムの選択状態管理 – HTML実践ガイド
リストの「選択」を極める：aria-selected を用いたアクセシブルな状態管理のベストプラクティス現場でフロントエンドを書いていると、「ただのリスト」に機能を持たせる場面に多々遭遇します。ドロップダウンの選択肢、タブ切り替え、あるいは...
React 【テクニカル・上級編】 カスタムフックへの状態ロジックの抽出と再利用 – React実践ガイド
状態の魔窟から抜け出すための流儀：カスタムフックによるロジック抽出の極意こんにちは。日夜コードベースの肥大化と戦い続けるフロントエンド・アーキテクトの皆さん。ふと気づけば、ひとつのコンポーネントが500行を超え、`useState` が乱立...