TypeScript 【テクニカル・上級編】 keyof演算子によるキーの抽出 – TypeScript実践ガイド
フロントエンドの荒波をくぐり抜け、日夜V8エンジンの機嫌やコンパイル速度と格闘している猛者の皆さん、こんにちは。今回はTypeScriptの型システムにおける「隠れた名刀」、`keyof`演算子について深掘りしよう。「オブジェクトのキーをユ...
frontendintronational
TypeScript Webブラウザの仕組み 【テクニカル・上級編】 リソース優先度（Priority Hints）の制御 – Webブラウザの仕組み実践ガイド
リソース優先度のチューニングは、現代フロントエンドの「最後のフロンティア」であるブラウザのレンダリングエンジン（BlinkやWebkitなど）のソースコードを覗いたことがある者なら誰しも、ネットワーク層とパーサーの間で行われている、あの血の...
JavaScript 【テクニカル・上級編】 Symbol.toPrimitiveによるカスタム型変換 – JavaScript実践ガイド
フロントエンドの荒波をくぐり抜けてきた君なら、JavaScriptの「暗黙の型変換（Type Coercion）」が引き起こすカオスに、一度や二度どころか、幾度となく頭を抱えたことがあるはずだ。`` が空文字になり、`"` に化け、`{} ...
CSS 【テクニカル・上級編】 :lang()擬似クラス – CSS実践ガイド
`:lang()`擬似クラスの深層：属性セレクタの呪縛を断ち、レンダリング・パイプラインを最適化するアーキテクチャフロントエンドの現場で長くCSSを書いていると、DOMの構造変化や動的な言語切り替え（i18n）に翻弄されるフェーズが必ずやっ...
HTML 【入門編】リストアイテムのキーボード操作とフォーカス管理 – HTML実践ガイド
皆さん、こんにちは！世界最高峰のフロントエンド・スペシャリストであり、技術メディアの主筆ライターとして、今日も皆さんのWeb制作ライフがもっと楽しく、もっと奥深くなるようなお話をしていきましょう！Webサイトを作っていると、つい見た目のデザ...
Propsによるデータの受け渡し（チルドレン属性、コンポーネントへの型付け） 【テクニカル・上級編】 styleとclassNameのProps設計 – React実践ガイド
こんにちは。フロントエンドの最前線で、日々DOMのうごめきとReactの調停アルゴリズム（Reconciliation）の機嫌を取り続けているシニアアーキテクトだ。今回は、Reactコンポーネント設計において誰もが一度は頭を悩ませる「`st...
TypeScript 【テクニカル・上級編】 マップ型（Mapped Types）の基礎 – TypeScript実践ガイド
マップ型（Mapped Types）の深層：型レベルのメタプログラミングで堅牢なドメインモデルを構築するこんにちは、フロントエンド・アーキテクトの領域で日々TypeScriptの型チェッカーと格闘している者です。実務で巨大なWebアプリケー...
Webブラウザの仕組み 【テクニカル・上級編】 ブラウザのプリロードスキャナ（Preload Scanner）の仕組み – Webブラウザの仕組み実践ガイド
プリロードスキャナの内部アーキテクチャ：なぜあなたのWebサイトは「見えないボトルネック」で失速するのかこんにちは。ブラウザの内部構造やレンダリングエンジンの挙動を追いかけるのが生きがいのようなエンジニアなら、一度は「なぜHTMLのパースは...
JavaScript 【テクニカル・上級編】 プリミティブのラッパーオブジェクト – JavaScript実践ガイド
プリミティブのラッパーオブジェクト：V8エンジンを唸らせるJSの裏側と型判定の罠こんにちは。日々ブラウザのタイムラインとメモリプロファイルに目を光らせているフロントエンド・アーキテクチャの住人なら、一度はJavaScriptの「型」の気まぐ...
CSS 【テクニカル・上級編】 nth-child(an+b of selector) の構文 – CSS実践ガイド
CSSの進化は、時に私たちフロントエンドエンジニアを狂喜乱舞させ、そして時に「これまでのハックは何だったんだ」と深い虚無感を与えてくれます。中でも `:nth-child()` の拡張構文である `:nth-child(an+b of se...