HTML 【実務・中級編】dl/dt/ddタグのセマンティックな使い分け – HTML実践ガイド
脱・「用語辞典」！``タグを使いこなす、セマンティックHTMLの極意現場でコードレビューをしていると、未だに「`dl`は用語と定義を書くためのものでしょ？」という誤解に出くわします。もちろん間違いではありませんが、それは``が持つポテンシャ...
frontendintronational
HTML React 【テクニカル・上級編】 プリミティブ値の依存配列による制御 – React実践ガイド
依存配列におけるプリミティブ値の罠：`Object.is`の厳密性と、私たちが踏み抜く「見えない再実行」の地雷原こんにちは。日々、ReactのレンダリングパイプラインとDOMの調停に頭を悩ませているアーキテクチャ・スペシャリストの皆さん。今...
TypeScript 【テクニカル・上級編】 ReturnTypeによる戻り値の型取得 – TypeScript実践ガイド
こんにちは。大規模なTypeScript製アプリケーションのコードベースと日々格闘していると、「なぜこの型を二重に定義しているんだ……」と、夜中に天井を見上げたくなる瞬間が訪れます。特に、APIクライアントのレスポンス型や、サードパーティ製...
Webブラウザの仕組み 【テクニカル・上級編】 CSS Containment仕様（containプロパティ） – Webブラウザの仕組み実践ガイド
CSS Containmentの深層：ブラウザレンダリングの「局所化」がもたらすアーキテクチャの革命ブラウザのレンダリングパイプラインと日々格闘しているシニアエンジニアなら、一度は次のような絶望感を味わったことがあるはずだ。「なぜ、たった1...
JavaScript 【テクニカル・上級編】 String.prototype.codePointAt() – JavaScript実践ガイド
サロゲートペアという名の爆弾：`String.prototype.codePointAt()` で文字列処理の解像度を極限まで高める方法こんにちは。日々、数百万行規模のフロントエンド・アーキテクチャの最適化と、ブラウザの限界性能を引き出すこ...
CSS 【テクニカル・上級編】 default疑似クラス – CSS実践ガイド
`:default` 疑似クラス：静的初期値と動的状態の境界線を制するアーキテクチャこんにちは。日々、CSSの仕様書とブラウザのレンダリングパイプラインを肴にコーヒーを飲んでいるフロントエンド・アーキテクトだ。今回は、フォームコンポーネント...
HTML 【入門編】dl/dt/ddタグのセマンティックな使い分け – HTML実践ガイド
「リスト」は「箇条書き」だけじゃない！dl/dt/ddタグでWebサイトを賢く整理するコツHTMLを学び始めると、最初にぶつかるのがリストタグですよね。``（中身がない箇条書き）や ``（順序がある箇条書き）は、メニューを作るときによく使う...
React 【テクニカル・上級編】 クリーンアップ関数の仕組み – React実践ガイド
クリーンアップ関数の真実：メモリリークと非同期の亡霊を断ち切るアーキテクチャこんにちは。フロントエンドの現場で日々、DOMの樹海と非同期処理の荒波を泳ぎ回っているエンジニアなら、一度は目にしたことがあるはずです。「Can't perform...
TypeScript 【テクニカル・上級編】 ConstructorParametersによるコンストラクタ引数の型取得 – TypeScript実践ガイド
こんにちは。フロントエンドの最前線で、日々TypeScriptの型システムとV8エンジンの機嫌を取り続けているチーフアーキテクトだ。今回は、基本の型カテゴリの一つである「タプル型」の応用形でありながら、メタプログラミングやDI（依存性注入）...
Webブラウザの仕組み 【テクニカル・上級編】 requestAnimationFrameとレンダリングサイクルの同期 – Webブラウザの仕組み実践ガイド
requestAnimationFrameとレンダリングサイクルの完全同期：60fpsのその先へこんにちは。日々ブラウザのレンダリングパイプラインとメモリ上のGC（ガベージコレクション）の挙動に思いを馳せているフロントエンド・アーキテクチャ...