このページの中だけを絞ります。ページは移りません。
実装の混同されやすい語
実装で境界が曖昧になりやすい語の対。全 72 組・24 語。
| この語 | と混同されやすい語 | 違い |
|---|---|---|
| BEM | Utility-First（ユーティリティファースト） | 単一の役割のクラスを組み合わせる |
| OOCSS / SMACSS | 別の設計手法 | |
| Component（コンポーネント） | コンポーネントは部品そのもの | |
| Box Model（ボックスモデル） | Margin（マージン） | マージンは層の一つ |
| フォーマッティングコンテキスト | 要素の配置の文脈 | |
| Logical Property（論理プロパティ） | 方向を論理的に指定する仕組み | |
| Bundle Size（バンドルサイズ） | ページの総重量 | 画像やフォントを含む全体 |
| Render Blocking（レンダリングブロック） | 描画を止める性質 | |
| INP | 操作への応答時間 | |
| Cascade Layer（カスケードレイヤー） | Specificity（詳細度） | 詳細度はセレクタの重み |
!important | 別の層で強制的に優先する | |
| ファイルの読み込み順 | 記述順による決定 | |
| Cascade（カスケード） | Specificity（詳細度） | 詳細度はカスケードの一段階 |
| 継承 | 親の値が子に引き継がれる仕組み | |
| Cascade Layer（カスケードレイヤー） | レイヤーは優先順位を明示する仕組み | |
| CLS（Cumulative Layout Shift） | Jank（ジャンク） | ジャンクは動きのカクつき |
| LCP | LCP は描画までの時間 | |
| Core Web Vitals | Lighthouse スコア | 開発環境での測定値 |
| TTFB | サーバー応答の速さ。中核指標には含まれない | |
| Usability（ユーザビリティ） | 使いやすさ全般 | |
| Critical CSS（クリティカルCSS） | インラインスタイル | style 属性への直書き |
| Render Blocking（レンダリングブロック） | 描画を止める性質 | |
| Bundle Size（バンドルサイズ） | JavaScript の大きさ | |
| DPR（デバイスピクセル比） | 解像度 | 画面全体の画素数 |
| PPI / DPI | 物理的な密度（1インチあたりの画素数） | |
| Viewport（ビューポート） | 表示領域の大きさ | |
| Flexbox | CSS Grid | グリッドは2方向を制御する |
float | 旧来の回り込みの仕組み | |
inline-block | 旧来の横並び手法 | |
| Graceful Degradation（グレースフルデグラデーション） | Progressive Enhancement（プログレッシブエンハンスメント） | 基本から上乗せする |
| フォールバック | 代替値そのもの | |
| ポリフィル | 機能を補う実装を追加する | |
| Hydration（ハイドレーション） | レンダリング | 画面に描画すること |
| SSG（静的サイト生成） | HTML を事前に生成する方式 | |
| 部分ハイドレーション | 必要な部分だけを対象にする方式 | |
| Image Format（画像フォーマット） | srcset / sizes | 解像度ごとの出し分け |
| 解像度 | 画素数 | |
| 圧縮率 | 品質と大きさの調整 | |
| INP（Interaction to Next Paint） | FID | 最初の操作の遅延のみ。廃止された |
| Jank（ジャンク） | ジャンクは継続的な動きのカクつき | |
| TTFB | サーバーの応答時間 | |
| Lazy Loading（遅延読み込み） | preload | 優先的に先読みする |
| コード分割 | JavaScript を分けて読み込む | |
| 無限スクロール | 内容を追加読み込みする | |
| LCP（Largest Contentful Paint） | FCP（First Contentful Paint） | 最初に何かが描画される時間 |
| TTFB | サーバーの最初の応答 | |
| 読み込み完了 | すべての資源の取得完了 | |
| Logical Property（論理プロパティ） | 物理プロパティ | 画面上の上下左右で指定する |
direction / writing-mode | 書字方向を設定するプロパティ | |
| Progressive Enhancement（プログレッシブエンハンスメント） | Graceful Degradation（グレースフルデグラデーション） | 完全版を作ってから劣化に対応する |
| ポリフィル | 未対応環境に機能を補う実装 | |
| Mobile First（モバイルファースト） | 画面幅についての順序 | |
| Render Blocking（レンダリングブロック） | Bundle Size（バンドルサイズ） | ファイルの大きさ |
| TTFB | サーバー応答の速さ | |
| パーサーブロック | HTML の解析自体を止める | |
| Specificity（詳細度） | Cascade（カスケード） | カスケードは決定の仕組み全体 |
| 記述順 | 詳細度が同じときの決定要因 | |
!important | 詳細度とは別の層で優先される | |
| srcset / sizes | <picture> | 形式や構図の出し分け |
| Image Format（画像フォーマット） | 保存形式の選択 | |
CSS の background-image | 背景画像。image-set() を使う | |
| SSG（静的サイト生成） | 方式 | 生成のタイミング |
| SSG | ビルド時 | |
| SSR | リクエスト時（サーバー） | |
| CSR | リクエスト時（ブラウザ） | |
| ISR | ビルド時＋一定間隔で再生成 | |
| TTFB（Time to First Byte） | LCP | LCP は描画までの時間 |
| FCP | 最初の描画までの時間 | |
| レイテンシ | 通信の往復時間 | |
| Utility-First（ユーティリティファースト） | BEM | BEM は意味ベースの命名 |
| インラインスタイル | style 属性への直書き | |
| Design Token（デザイントークン） | トークンは値の定義 |