recursal/MDN huggingface dataset:
パケット
====

パケット、またはネットワークパケットはは、ネットワーク上で送られる整形されたデータの塊です。パケットはユーザーデータと制御情報を含みます。ユーザーデータは*ペイロード*として知られています。制御情報はペイロードを送るための制御情報です。この制御情報は、送信元と送信先のネットワークアドレス、順序情報、エラー検知コードで構成されており、通常パケットのヘッダーとフッターで見られます。

パケットに含まれるもの
-----------

### ホップ制限

ホップとは、パケットがあるネットワークから次のネットワークに渡されるときに発生するものです。これは、パケットが通過するたびに 1 ずつ減少するフィールドで、 0 になると失敗してパケットは破棄されます。

時間が経つにつれ、パケット数は閉回路内を循環する原因となり、循環するパケット数は蓄積され、最終的にはネットワークの失敗につながることになります。

### 誤り検出訂正

誤り検出訂正とは、データを受信者に送信する際に発生する誤りを検出して訂正するためのコードです。誤り訂正には、後方誤り訂正と前方誤り訂正の２種類があります。後方誤り訂正とは、受信機が送信機に対してデータ単位全体の再送信を要求する場合です。前方誤り訂正は、受信機が自動的に誤りを訂正する誤り訂正符号を使用する場合です。

送信側では、パケットが送信される前に計算が行われます。宛先で受信すると、チェックサムが再計算され、パケット内のチェックサムと比較されます。

### 優先度

このフィールドは、どのパケットが他のパケットよりも高い優先度を持つべきかを示します。優先度の高いキューは、ネットワークが混雑しているときに、優先度の低いキューよりも早く空になります。

### アドレス

ネットワークパケットをルーティングする際には、送信元ホストの送信元アドレスと受信先ホストの送信先アドレスの 2 つのネットワークアドレスが必要になります。

### ユーザーデータ - ペイロード

ペイロードとは、アプリケーションに代わって運ばれるデータのことである。ペイロードの長さは通常可変で、ネットワークプロトコルや場合によっては経路上の機器によって設定される最大値までの長さがあります。

使用したリファレンス
----------

* https://en.wikipedia.org/wiki/Network\_packet
* https://en.wikipedia.org/wiki/Hop\_(networking)
* https://www.techradar.com/news/computing/how-error-detection-and-correction-works-1080736
Round Trip Time (ラウンドトリップタイム)
=============================

**ラウンドトリップタイム (RTT)** とは、データパケットが宛先に送信されるのにかかる時間と、そのパケットの確認応答が発信元で受信されるのにかかる時間の長さです。ネットワークとサーバー間の RTT は、`ping` コマンドを使用して計測できます。


```bash
$ ping example.com
PING example.com (216.58.194.174): 56 data bytes
64 bytes from 216.58.194.174: icmp\_seq=0 ttl=55 time=25.050 ms
64 bytes from 216.58.194.174: icmp\_seq=1 ttl=55 time=23.781 ms
64 bytes from 216.58.194.174: icmp\_seq=2 ttl=55 time=24.287 ms
64 bytes from 216.58.194.174: icmp\_seq=3 ttl=55 time=34.904 ms
64 bytes from 216.58.194.174: icmp\_seq=4 ttl=55 time=26.119 ms
--- google.com ping statistics ---
5 packets transmitted, 5 packets received, 0.0% packet loss
round-trip min/avg/max/stddev = 23.781/26.828/34.904/4.114 ms
```


上記の例は、最終行に平均ラウンドトリップタイムが 26.8ms と表示されています。

関連情報
----

* Time to First Byte (TTFB)
* レイテンシー
EXIF
====

**Exchangeable Image File Format (EXIF)** は、マルチメディアファイルのメタデータをファイル内に埋め込む方法を定めた規格です。例えば画像の場合、次のような情報を記述した EXIF データを含んでいることがあります。ピクセル単位の幅や高さ、解像度、シャッタースピード、絞り、 ISO 設定、撮影日など。

関連情報
----

* EXIF (Wikipedia)
* CIPA 規格類, including "CIPA DC-008-2019 デジタルスチルカメラ用画像ファイルフォーマット規格 Exif 2.32"
Statement (文)
=============

コンピュータープログラミング言語では、**文**はタスクを実行するコード行です。すべてのプログラムは文の連続から成っています。

関連項目
----

### 一般知識

* Wikipedia の 文\_(プログラミング)
### 技術リファレンス

* JavaScript の文と宣言
Block (ブロック)
============

**ブロック**という用語は、文脈に応じていくつかの意味を持つことがあります。以下のものを参照してください。

Block (ブロック) (CSS)
ウェブページにおいて **ブロック** (block) は、新しい行、つまり、横書きでは前の要素の下、次の要素の上に現れる HTML のelementです（よく*ブロックレベル要素*として知られています）。例えば、 `p` は既定ではブロックレベル要素であり、それに対して `a` は*インライン要素*です。 — HTML ソース内で複数のリンクを互いに隣に置くことができ、出力時には互いに同じ行に表示されます。
Block (ブロック) (スクリプティング)
JavaScript では、ブロックは、中括弧 ("`{}`") で囲まれた関連するstatementの集合です。 たとえば、 `Statements/if...else` ブロックの後に文のブロックを置くことができます。これは、条件が真であればインタープリターがブロック内のコードを実行する必要があることを示し、条件が偽の場合はブロック全体をスキップします。
CORS-safelisted response header (CORS セーフリストレスポンスヘッダー)
======================================================

*CORS セーフリストレスポンスヘッダー* は、CORS レスポンスに含まれる HTTP ヘッダーで、クライアントスクリプトに公開しても *安全* であると見なされます。セーフリストに含まれたレスポンスヘッダーのみがウェブページで利用できます。

既定では以下のレスポンスヘッダーがセーフリストに含まれます。

* `Cache-Control`
* `Content-Language`
* `Content-Length`
* `Content-Type`
* `Expires`
* `Last-Modified`
* `Pragma`

`Access-Control-Expose-Headers` ヘッダーを使用して追加のヘッダーをセーフリストに追加することができます。

**メモ:** `Content-Length` は既定のセーフリストではありませんでした。 [参照]

例
-

### セーフリストの拡張

`Access-Control-Expose-Headers` ヘッダーを使用して、CORS セーフリストレスポンスヘッダーのリストを拡張することができます。
```

Access-Control-Expose-Headers: X-Custom-Header, Content-Encoding
```

関連情報
----

* HTTP
* HTTP headers
* `Access-Control-Expose-Headers`
* 用語集
    + CORS
    + CORS セーフリストリクエストヘッダー
    + 禁止ヘッダー名
    + リクエストヘッダー
BiDi (双方向)
==========

**BiDi** (BiDirectional、双方向) は、右から左および左から右に向かって書くテキストの両方を含む文書を指します。両方の方向性が同じパラグラフで発生しても、各言語のテキストは適切な方向性で表示されなくてはなりません。

より詳しく知る
-------

### 一般知識

* Wikipedia 上の 双方向テキスト
### 技術文書

* Bidi アプリの開発
High-level programming language (高水準言語)
=======================================

高水準言語は、コンピューターの命令の詳細を**大幅に抽象化**します。人間が容易に理解できるように設計されているため、別のソフトウェアで翻訳する必要があります。低水準言語とは異なり、自然言語要素を使用したり、コンピューティングシステムの大半の領域を自動化（または完全に隠蔽）して、低水準言語に比べて開発プロセスをより簡単で理解しやすいものにします。提供される抽象化の量によって、プログラミング言語がいかに「高水準」であるかが定義されます。

マシンコードに自動的に変換可能だが人間のロジックに近い言語のアイデアは、1950 年代にコンピューターサイエンスに導入されました。特に **John Backus**（IBM）の仕事のおかげで、最初の高水準言語 Fortran が広く流通しました。この革新により、Backus はチューリング賞を受賞しました。
GPU
===

GPU (Graphics Processing Unit) は、コンピューターの構成要素で、CPU (Central Processing Unit) に似ています。モニター上のグラフィックス (2D と 3D の両方) の描画に特化しています。
XInclude
========

XInclude は、文書に他の文書または他の文書の一部を含められるようにする、包含タグを定めた W3C 勧告です。他の XML ファイルやテキストファイルからコンテンツを取り込むことができます。

主要なブラウザーは、XInclude の仕組みを標準ではサポートしていません。

関連情報
----

* XInclude standard
* `XPath`
API
===

API (Application Programming Interface) とは、あるソフトウェアプログラム(アプリケーション)が、他のソフトウェアやハードウェア等、外部とやりとりをするために備えている機能や規則の集まりです - 人間のユーザーインターフェイスと比較されます。API は、それを提供するアプリケーションと、第 3 者のソフトウェアやハードウェアといった他の項目との間の、単純な契約(インターフェイス)です。

Web 開発においては、API と言えば一般的にはコーディング上の取り決めです (例えば メソッド 、プロパティ 、 events、URL) が挙げられます。ブラウザーのコンポーネントやユーザーのコンピューター上にあるソフトやハード、第 3 者のウェブサイトやサービスとやり取りするアプリケーションを開発するには API を使います。

例えば:

* getUserMediaAPI はユーザーの Webcam から音声やビデオを利用することを可能とし、例えばビデオや音声の記録や、それらを電話会議の他のユーザーに流したり、ビデオから静止画を取り出すなどの方法で開発者の望むままに利用されます。
* Geolocation API はデバイスで有効なあらゆるサービス（例えば GPS など）を用いてユーザーの位置情報を取得でき、例えば Google Maps API と組み合わせることでユーザーの位置をカスタマイズした地図にプロットし、そのエリアにどのような観光名所があるか表示することを可能とします。
* Twitter APIs はウェブページに最新のツイートを表示するなど、ユーザーの Twitter アカウントからデータを取り出すために利用されています。
* Web Animations API は画像を動かしたり回転させるなど、Web ページの一部をアニメーションにするために利用されています。
関連項目
----

### 一般知識

* Wikipedia 上の記事「API 」
### 技術リファレンス

* Web API リファレンス
Graceful degradation (グレースフルデグラデーション)
=====================================

**グレースフルデグラデーション** (上品な劣化) とは設計哲学の一つで、最新のブラウザーで動作するように新しいウェブサイトやアプリケーションを構築するものの、古いブラウザーでも、良いものでなくても基本的なコンテンツや機能を引き続き提供する使用方法で代替できるようにしようとすることを目指したものです。

ポリフィルを使用して JavaScript で不足している機能を構築することは可能ですが、 CSS のカスケードや HTML の代替の振る舞いなど、可能な限りスタイル付けやレイアウトなどの機能の代替案を用意する必要があります。いくつかの良い事例は、一般的な HTML と CSS の問題の扱いで見ることができます。

これは、ウェブサイトが複数の未知のユーザーエージェントからアクセスされるという状況下で、ウェブ開発者が最良の可能性を持ったウェブサイトを開発することに集中できるようにするために有用なテクニックです。プログレッシブエンハンスメントは関連していますが、異なります。これはよくグレースフルデグラデーションとは反対の方向に向いているとよく見られます。実際には、両方のアプローチが有効であり、互いに補完することができます。

1. Wikipedia 上の Graceful degradation (英語)
2. 一般的な HTML と CSS の問題への対処
3. 機能検出の実装
4. MDN Web Docs 用語集
    1. グレースフルデグラデーション
    2. ポリフィル
    3. プログレッシブエンハンスメント
Grid Areas (グリッド領域)
===================

**グリッド領域**はグリッド上で一つ以上の グリッドセル からなる長方形の領域です。グリッド領域は線指定による配置や名前付きグリッド領域で領域を定義すると作成されます。

![ハイライトされたグリッド領域を示す画像](/ja/docs/Glossary/Grid_Areas/1_grid_area.png)

グリッド領域はその性質上、必ず長方形の領域となります。例えば T 字型や L 字型のグリッド領域を作ることはできません。

例
-

次の例ではグリッドコンテナーに 2 つのグリッドアイテムを含み、これらに `grid-area` プロパティで名前を付け、グリッド上に `grid-template-areas` を使ってレイアウトしています。これによりグリッドセルと 4 つ含むものと、2 つ含むものの 2 つのグリッド領域ができます。
```

\* {
  box-sizing: border-box;
}

.wrapper {
  border: 2px solid #f76707;
  border-radius: 5px;
  background-color: #fff4e6;
}

.wrapper > div {
  border: 2px solid #ffa94d;
  border-radius: 5px;
  background-color: #ffd8a8;
  padding: 1em;
  color: #d9480f;
}
```



```css
.wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: 100px 100px;
  grid-template-areas:
    "a a b"
    "a a b";
}
.item1 {
  grid-area: a;
}
.item2 {
  grid-area: b;
}
```



```html
<div class="wrapper">
  <div class="item1">Item</div>
  <div class="item2">Item</div>
</div>
```

関連情報
----

### プロパティリファレンス

* `grid-template-columns`
* `grid-template-rows`
* `grid-auto-rows`
* `grid-auto-columns`
* `grid-template-areas`
* `grid-area`
### 参考資料

* CSS グリッドレイアウトガイド: *グリッドレイアウトの基本概念*
* CSS グリッドレイアウトガイド: *グリッドテンプレート領域*
* Definition of Grid Areas in the CSS Grid Layout specification
Robots.txt
==========

Robots.txt は通常、ウェブサイトのルートに配置されているファイルです。このファイルは、クローラー からウェブサイトへのアクセスを許可するか、禁止するかを決定します。

例えば、サイト管理者はクローラーが特定のフォルダー（とそこに含まれるすべてのファイル）にアクセスしたり、特定ファイルをクロールするのを禁止でき、通常はこれらのファイルが他の検索エンジンによってインデックスされることを防ぐために使われます。

詳細情報
----

### 一般的な知識

* Wikipedia 上の Robots.txt
* https://developers.google.com/search/reference/robots\_txt
* 標準ドラフト仕様: https://tools.ietf.org/html/draft-rep-wg-topic
* https://www.robotstxt.org/
Specification
=============

**specification** とは、製品を出荷する前にどのような機能や属性を含める必要があるかを詳しく説明したドキュメントです。 Web を説明する文脈において "specification" という用語 (多くの場合 "spec" と略される) は、一般にオープンな Web テクノロジーの完全なセットを構成する言語、技術、または API を説明するドキュメントを意味します。

関連項目
----

### 一般知識

* Wikipedia 上の 仕様
### 技術リファレンス

* Open Web platform specifications
Web standards (ウェブ標準)
=====================

ウェブ標準は国際標準化団体によって策定される、 ウェブ の仕組み (またときには インターネット を制御する方法) を定義する規則です。

 いくつかの標準化団体がウェブのさまざまな側面を定義する責任があり、すべての標準はウェブを最大限に利用可能でアクセス可能に保つために調整する必要があります。
 ウェブ標準は、現在の状況を改善し、新しい状況に適応するために進化しなければなりません。

次のリストはウェブサイトやネットワークシステムが準拠しなければならない標準の一部です:

* **IETF** (Internet Engineering Task Force): インターネット標準 (STD) であり、特に、URI、HTTP、MIME の設定と使用を管理しています。
* **W3C**: マークアップ言語 (HTMLなど) 、スタイル定義 (CSS)、 DOM、アクセシビリティ の仕様を策定しています。
* **IANA** (Internet Assigned Numbers Authority): 名前や番号の登記を管理しています。
* **Ecma インターナショナル:** 特に JavaScript 向けのスクリプティング標準の策定。
* **ISO** (International Organization for Standardization、国際標準化機構): 文字エンコーディング、ウェブサイトの管理、ユーザーインターフェイス設計などを含む、多種多様な標準を管理しています。
関連項目
----

### 一般知識

* Wikipedia の ウェブ標準
Dynamic typing (動的型付け)
======================

**動的型付け言語**では、(JavaScript のように) インタプリターが実行時に、変数の値 に基づいて、変数 にデータ型 を割り当てます。

関連項目
----

### これについて学習する

* JavaScript のデータ型とデータ構造
### 一般知識

* Wikipedia の 型システム
Digest
======

ダイジェストはメッセージ全体からハッシュ関数によって生成された小さな値です。理想的にはダイジェストは即座に計算でき、不可逆であり、予測不可能なため、メッセージが改ざんされたかどうかの判定に利用することができます。

ダイジェストを使用して、下記のようないくつかのタスクを実行できます:

* 非暗号化アプリケーション（例えば、ハッシュテーブルのインデックス、重複データの検出やファイルの一意な識別に使用されるフィンガープリントなど）
* メッセージの整合性の検証（改ざんされたメッセージは異なるハッシュ値を持ちます）
* パスワードを解読されないようにしつつも、チェックできるように保存できます（これをより安全に行うためには、パスワードに salt を付与する必要もあります）。
* 擬似乱数の生成
* 暗号鍵の生成

衝突や予測可能性を避けるために、ユースケースに適したハッシュ関数を選択することが重要です。

関連項目
----

* ハッシュ関数
* Wikipedia の ハッシュ関数
Script-supporting element (スクリプト対応要素)
=====================================

HTML 文書において、**スクリプト対応要素**はページの表示やレイアウトに直接貢献しない要素です。その代わり、スクリプト自体やスクリプトからのみ使用される情報を持っています。これらの要素は重要な場合もありますが、ページのスクリプトが正確に作用しなければ表示されているページに影響しません。

スクリプト対応要素は `<script>` 及び `<template>` の 2 つしかありません。

技術リファレンス
--------

詳しくは透過的コンテンツモデルを参照してください。
Syntax (構文)
===========

構文は、正しく構造化されたコードを構成する文字の必要な組み合わせと順序を指定します。構文は一般に、文法とそれを書く上で適用される規則、例えば Python にはインデントの要件などを含みます。

構文は言語によって異なります (たとえば、HTML と JavaScript では構文が異なります)。しかし、例えば「オペランド 演算子 オペランド」の規則が JavaScript と python で共通であるように、構文の面では言語間でいくらかの類似点を持つことがあります。これは、 2 つの言語が構文を共有していることを意味するものではありません。

構文は、プログラミング言語 (コンピューターへの指示) とマークアップ言語 (文書構造情報) の両方に適用されます。

構文は順序と構造のみを管理します。命令は、意味論の領域で意味をもたなければなりません。

コードを正しくコンパイルするには、正しい構文を使用する必要があります。そうでない場合は、構文エラーが発生します。括弧が抜けているなどの小さなエラーなら、ソースコードのコンパイルを続けることができます。

フレームワークは、シンプルで読みやすく簡潔な結果を生成する場合、「クリーン」な構文を持つと言われています。コードベースで「たくさんの構文」が使用されている場合、同じ機能を実現するにはさらに多くの文字が必要です。

関連項目
----

### 一般知識

* Wikipedia 上の Syntax (プログラミング言語) （英語）
Jank
====

**Jank** は、メインスレッドで長いタスクを実行したり、レンダリングをブロックしたり、バックグラウンドプロセスでプロセッサパワーを浪費したりすることによって、ユーザーインターフェイスの低速化を引き起こすことを指します。
Clickjacking
============

クリックジャッキングとは、ウェブサイトの利用者をだまして、悪意のあるリンクを無意識にクリックさせるインターフェイスベースの攻撃です。クリックジャッキングでは、攻撃者は、ウェブサイト内のボタンや正規のページに悪意のあるリンクを埋め込みます。攻撃が仕込まれたサイトでは、ユーザーが正規のリンクをクリックするたびに、攻撃者はそのユーザーの機密情報を取得し、最終的にインターネット上でのユーザーのプライバシーを侵害することになります。

クリックジャッキングは、Content Security Policy (frame-ancestors) の実装と、Set-Cookie 属性の実装により防ぐことができます。

さらに学ぶ
-----

* ウェブセキュリティ：クリックジャックからの保護
* Wikipedia 上の Clickjacking （英語）
* OWASP 上の Clickjacking （英語）
XHR (XMLHttpRequest)
====================

`XMLHttpRequest` (XHR) とは AJAX リクエストを作成する JavaScript API です。これはブラウザー とサーバー との間のネットワークリクエストの送信を可能にするメソッドです。.

詳しく学習する
-------

### 一般知識

* Wikipedia での XMLHttpRequest
* Synchronous vs. Asynchronous Communications
### 技術リファレンス

* `XMLHttpRequest` オブジェクト
* XMLHttpRequest の使い方についての MDN ドキュメント
Transient activation (一時的な有効化)
==============================

**一時的な有効化** (または「ユーザーによる一時的な有効化」) とは、ユーザーが最近ボタンを押したか､マウスを動かしたか､メニューを使用したか､他の何らかの操作をしたことを表すウインドウの状態です｡

 この状態は、ウェブ API がユーザーによる操作がきっかけの時にのみ機能するようにするための機構として利用されることがあります。
 例えば、スクリプトは *一時的な有効化* を必要とするポップアップを自由に出すことはできません。すなわち、UI 要素のイベントハンドラーをきっかけとして出す必要があります。

*一時的な有効化* を必要とする API の例は､ユーザーによる有効化によって制御される機能 を参照してください｡

プログラムから現在のウインドウの一時的な有効化の状態を参照するには､`UserActivation.isActive` プロパティを参照します｡

**メモ:** 一時的な有効化は (他の操作によって更新されなければ) タイムアウトによって無効になり､API によって「消費される」こともあります｡最初にセットされた後はリセットされないユーザーによる有効化は、粘着的な有効化を参照してください。

関連情報
----

* HTML Living Standard > Transient activation
* 粘着的な有効化
* `UserActivation.isActive`
DTLS (Datagram Transport Layer Security)
========================================

**Datagram Transport Layer Security** (**DTLS**) とは、データグラムベースの通信を安全にするためのプロトコルです。ストリーム中心の Transport Layer Security (TLS) に基づいており、類似の水準のセキュリティーを提供します。一般的なデータグラムプロトコルと同様に、DTLSはメッセージが届く順番は愚か、メッセージが届くかどうかさえ保証しません。しかしながら、DTLSはデータグラムプロトコルの恩恵 ―― 特に低いオーバーヘッドや、レイテンシーの縮小 ――ももたらします。

こうした特徴は DTLS が活躍する最もありふれた領域、WebRTC において有用です。WebRTC に関連するすべてのプロトコルは DTLS で通信を暗号化することが求められています。これには SCTP (en-US)や SRTP (en-US)、 STUN も含まれます。

詳細情報
----

* Datagram Transport Layer Security (*Wikipedia*)
* 仕様:
    + RFC 9147: The Datagram Transport Layer Security (DTLS) Protocol Version 1.3
    + RFC 6347: Datagram Transport Layer Security Version 1.2
* 関連する仕様
    + RFC 5763: Framework for Establishing a Secure Real-time Transport Protocol (SRTP) Security Context Using DTLS
    + RFC 5764: DTLS Extension to Establish Keys for the Secure Real-time Transport Protocol (SRTP)
    + RFC 6083: DTLS for Stream Control Transmission Protocol (SCTP)
    + RFC 8261: Datagram Transport Layer Security (DTLS) Encapsulation of SCTP Packets
    + RFC 7350: Datagram Transport Layer Security (DTLS) as Transport for Session Traversal Utilities for NAT (STUN)
    + RFC 7925: TLS / DTLS Profiles for the Internet of Things
Unix time (UNIX 時間)
===================

UNIX 時間はタイムスタンプを表す方法の一つで、通常、 UNIX 元期の開始（1970 年 1 月 1 日午前 0 時 (UTC)）からの秒数で定義されます。うるう秒は無視されます。

ウェブプラットフォームでは、 UNIX 時間がタイムスタンプに使用され、 UNIX 元期の開始からのミリ秒数として与えられます。

関連情報
----

* UNIX 時間（ウィキペディア）
* うるう秒（ウィキペディア）
Advance measure
===============

**advance measure** は字体がとるすべての間隔で、記述方向（横書き・縦書き）によって水平方向または垂直方向の間隔を表します。カーソルがある文字の手前から背後までを進む距離と等しいです。

 この用語は幾つかの CSS の `<length>` の単位の定義で使われます。
 *advance measure* における単位 `ch` は文字 "0" の書体の幅または高さを表し、記述方向（横書き・縦書き）によります。同様に単位 `ic` は文字 "水" の書体の幅または高さを表します。

関連情報
----

* `<length>`
Netscape Navigator
==================

Netscape Navigator または、単に Netscape は、1990 年代の主要なブラウザーでした。Netscape は Mosaic をベースにして作られており、開発チームは、Mosaic のコードを書いていたプログラマーである Marc Andreessen によって率いられていました。

Netscape のおかげで、ウェブはテキストのみの表現に留まらず、よりグラフィカルになりました。多くのブラウジング機能は、Netscape が導入したことによって標準化していきました。Netscape は読み込み中にウェブページを表示したり、JavaScript によってフォームやインタラクティブなコンテンツを可能にしたり、セッション情報を Cookie に保存したりすることを可能としました。しかし、ネットスケープの技術的優位性と初期の高いシェアにもかかわらず、1990 年代後半には、Internet Explorer によって急速に市場シェアを奪われました。

詳細情報
----

### 基礎知識

* Wikipedia 上の記事 Netscape\_Navigator\_(ネットスケープコミュニケーションズ)
Progressive web apps (プログレッシブウェブアプリ)
====================================

プログレッシブウェブアプリは、ウェブアプリ開発の現代的な姿を表す用語です。これには検索エンジンによる見つけやすさ、URL を使用したリンク、複数の形式要素で動作することなど、ウェブのあらゆる優れた部分を活用した標準的なウェブサイト/アプリを利用し、最新の API (Service Workers や Push など) やネイティブアプリに由来するさまざまな利点をより一般的にもたらす機能を提供すること含みます。

これらの機能は、インストール可能で、オフラインで動作し、簡単に同期できてユーザーがサーバーに簡単に再接続できます。

詳細情報
----

* MDN 上の アプリセンター (en-US)
* Google Developers 上の Progressive web apps
Deserialization (デシリアライズ)
=========================

下位レベルのフォーマット（例えば、ネットワークを介して転送された、またはデータストアに格納された）が、読み取り可能なオブジェクトまたは他のデータ構造に変換されるプロセス。

たとえば、JavaScript では、`JSON.parse()` 関数を呼び出すことで、JSON 文字列をオブジェクトにデシリアライズすることができます。

より詳しく知る
-------

### 一般知識

* Wikipedia 上の シリアライズ
XHTML
=====

**XHTML** は、 HTML 文書のうち XML の構文規則に適合して書かれたものを指すために歴史的に使用されてきた用語です。

詳細情報
----

* XHTML
IMAP
====

IMAP (Internet Message Access Protocol) は、電子メールの取得と保存に使用されるプロトコルです。 POP3 より新しい IMAP では、サーバー上のフォルダとルールが可能です。

POP3 とは異なり IMAP では、1 つのメールボックスへの複数同時接続が可能です。 メールボックスにアクセスするクライアントは、他のクライアントからの状態変更に関する情報を受け取ることができます。 IMAP はまた、クライアントが接続を維持し、必要に応じて情報を受け取るモードを提供します。

Mark Crispin は、1986 年に *Interim Mail Access Protocol* として IMAP を開発しました。 IMAP4 リビジョン 1 は、RFC 3501 で定義されている最新バージョンです。

より詳しく知る
-------

* RFC 3501
* POP3
* IMAP on Wikipedia
HPKP
====

**HPKP** (HTTP 公開鍵ピンニング、 HTTP Public Key Pinning) は、偽造された証明書による MITM 攻撃のリスクを減らすために、特定の暗号化公開鍵を特定のウェブサーバーに関連付けるようにウェブクライアントに指示するセキュリティ機能です。

より詳しく知る
-------

* `Public-Key-Pins` (en-US)
* `Public-Key-Pins-Report-Only` (en-US)
* RFC 7469 （英語）
* Wikipedia 上の HTTP Public Key Pinning （英語）
Fetch directive (フェッチディレクティブ)
=============================

**CSP のフェッチディレクティブ**は `Content-Security-Policy` ヘッダーで使用され、特定のリソース種別の読み込み先を制御します。たとえば、 `script-src` では、開発者は信頼できるスクリプトのソースを許可してページ上で実行できるようし、 `font-src` では、ウェブフォントのソースを制御できます。

すべてのフェッチディレクティブは `default-src` で代替することができます。つまり、フェッチディレクティブが CSP ヘッダーにない場合、ユーザーエージェントは `default-src` ディレクティブを探します。

完全な一覧についてはフェッチディレクティブを参照してください。

関連情報
----

* 用語集
    + CSP
    + 報告ディレクティブ
    + 文書ディレクティブ
    + ナビゲーションディレクティブ
* リファレンス
    + https://www.w3.org/TR/CSP/#directives-fetch
    + `upgrade-insecure-requests`
    + `block-all-mixed-content`
    + `require-sri-for` 
    非推奨
    + `Content-Security-Policy`
DTMF (Dual-Tone Multi-Frequency signaling)
==========================================

**Dual-Tone Multi-Frequency** (**DTMF**) シグナリングは、キーパッド上で押されているボタンを表すために可聴音を使用するシステムです。 米国ではしばしば「タッチトーン」と呼ばれています（パルスダイヤルから DTMF への移行が開始されたときにタッチトーンの商標が使用されたので）。 DTMF は、数字 [0] 〜 [9] と、文字 [A] 〜 [D] と、記号 [#] と [\*] を送信することができます。 いくつかの電話のキーパッドは、電話網による制御シグナリングのために典型的に使用される文字を含みます。

コンピュータは、モデムにダイヤルするとき、または電話会議または他の目的のためにメニューシステムにコマンドを送信するときに、DTMF を利用することができます。

より詳しく知る
-------

### 一般知識

* Wikipedia 上の DTMF
* Wikipedia 上の ダイヤルパルス
WebIDL
======

**WebIDL** は、ウェブアプリケーションプログラミングインターフェイス (API) を構成するデータ型、インターフェイス、メソッド、プロパティ、およびその他のコンポーネントを記述するために使用されるインターフェイス記述言語です。これは、特定のプログラミング言語に依存しないやや定式化された構文を使用しているため、API のコンポーネントを JavaScript 互換の構造にマップすることが可能な一方で、各 API を構築するために使用される基礎となるコードは、どの言語であっても最適に記述できます。

WebIDL はウェブのほぼすべての API 仕様で使用されており、その標準的な形式および構文のため、ウェブブラウザーを作成するプログラマーは、どのように API を実装するコードを書くかにかかわらず、ブラウザーが相互に互換性があることを容易に確認できます。

関連項目
----

### 技術情報

* Specification
* Information contained in a WebIDL file
* WebIDL bindings
* WebIDL (英語)
Gutter (溝)
==========

**溝** (Gutters) もしくはアレーはコンテンツトラック間に空間を開けることです。CSS グリッドレイアウトで `column-gap`、`row-gap`、`gap` プロパティを使うと溝が作成されます。

例
-

下の例では 3 列 2 行のトラックを持つグリッドを、列トラックの間には 20 ピクセルの、列トラックの間には `20px` のすき間を空けています。
```

\* {
  box-sizing: border-box;
}

.wrapper {
  border: 2px solid #f76707;
  border-radius: 5px;
  background-color: #fff4e6;
}

.wrapper > div {
  border: 2px solid #ffa94d;
  border-radius: 5px;
  background-color: #fff8f8;
  padding: 1em;
  color: #d9480f;
}
```



```css
.wrapper {
  display: grid;
  grid-template-columns: repeat(3, 1.2fr);
  grid-auto-rows: 45%;
  column-gap: 20px;
  row-gap: 20px;
}
```



```html
<div class="wrapper">
  <div>One</div>
  <div>Two</div>
  <div>Three</div>
  <div>Four</div>
  <div>Five</div>
</div>
```


グリッドのサイズ決定においては、溝によるすき間は通常のグリッドトラックのように扱われますが、すき間の中には何も配置できません。すき間の分だけその場所のグリッドラインのサイズが増えるように振る舞うため、そのラインの後のグリッドアイテムはすき間の後から始まるように配置されます。

トラックに余白を生じさせる原因は `row-gap` と `column-gap` プロパティだけではありません。マージン、パディング、ボックス配置の余白分配プロパティなどいずれも視覚上のすき間を作ります。したがって、追加の余白をこれらの方法で一切作らないデザインをしていない限り、 `row-gap` および `column-gap` プロパティと「溝サイズ」が一致するようには見えません。

関連情報
----

### プロパティリファレンス

* `column-gap`
* `row-gap`
* `gap`
### 参考情報

* CSS グリッドレイアウトガイド: *グリッドレイアウトの基本概念*
* CSS グリッドレイアウト仕様における溝の定義
Number
======

JavaScript において、 **Number** は 倍精度64ビット浮動小数点形式 (IEEE 754) を持つ数値データ型です。その他のプログラミング言語では、それ以外の数値型もあります。たとえば、 Integer、Float、Double、Bignum などです。

詳細情報
----

### 基礎知識

* Wikipedia 上の記事「データ型」
### 技術リファレンス

* JavaScript のデータ構造 : Number
* JavaScript のグローバルオブジェクト `Number`

* MDN 用語集
    + JavaScript
    + Primitive
* `Number`
* JavaScript データ型とデータ構造
W3C
===

*World Wide Web Consortium* (W3C) は、ウェブに関するルールや枠組みを整備する国際団体です。

W3C は 350 を超える加盟組織から成り、加盟組織は連帯してウェブ標準を開発し、ウェブの普及計画を遂行し、ウェブについて話し合うための開かれた場を整備しています。 W3C は業界の各企業に対して同じ W3C の標準を実装するよう働きかけています。

それぞれの標準は、草案 (Working Draft; WD)、勧告候補 (Candidate Recommendation; CR)、勧告案 (Proposed Recommendation; PR)、そして W3C 勧告 (W3C Recommendation; REC) の 4 つの段階を経て成熟していきます。

詳細情報
----

### 一般知識

* W3C のウェブサイト
* ウィキペディアの W3C の記事
Mobile First (モバイルファースト)
========================

**モバイルファースト**は、ある種の プログレッシブエンハンスメントで、ウェブ開発やウェブデザインにおいて、モバイル画面サイズのデザイン・開発をデスクトップ画面サイズのデザイン・開発より優先して注力するアプローチです。 モバイルファーストアプローチの根拠は、すべての画面サイズにおいて良いユーザー体験を提供することです — はじめに小さい画面でうまく動作するユーザー体験を作成して、その次にその上に画面サイズが増えるごとにもっと豊かなユーザー体験を与えていきます。 モバイルファーストアプローチは、デスクトップ画面サイズをデザインしてからその後に小さい画面サイズを追加する、古いアプローチと対照をなします。
TURN
====

**TURN** (Traversal Using Relays around NAT) は、Network Address Translator (NAT) やファイアウォールの内側からコンピューターがデータを受信および送信できるようにする プロトコル です。TURN は WebRTC で使用され、インターネット上の任意の 2 つのデバイスがピアツーピア接続できるようにします。

関連情報
----

* TURN （ウィキペディア）
* WebRTC プロトコル
* 仕様
* IPv6 に関する仕様の更新
Response header (レスポンスヘッダー)
===========================

**レスポンスヘッダー**は、 HTTP レスポンスで使用できる HTTP ヘッダーで、メッセージの内容には関連しないものです。 `Age`, `Location`, `Server` のようなレスポンスヘッダーは、レスポンスのものより詳細な文脈を提供するために使用されます。

レスポンスに現れるすべてのヘッダーが仕様書で*レスポンスヘッダー*に分類されている訳ではありません。例えば `Content-Length` ヘッダーは*表現メタデータヘッダー*であり、レスポンスメッセージの本文の長さを表します (そして、古いバージョンの仕様書ではエンティティヘッダーでした)。しかし、これらのエンティティヘッダーもそのような場面ではレスポンスヘッダーと呼ばれることがよくあります。

以下に、 `GET` リクエストの後のレスポンスヘッダーをいくつか示します。なお、正確に言えば、 `Content-Encoding` 及び `Content-Type` ヘッダーはエンティティヘッダーです。
```

200 OK
Access-Control-Allow-Origin: *
Connection: Keep-Alive
Content-Encoding: gzip
Content-Type: text/html; charset=utf-8
Date: Mon, 18 Jul 2016 16:06:00 GMT
Etag: "c561c68d0ba92bbeb8b0f612a9199f722e3a621a"
Keep-Alive: timeout=5, max=997
Last-Modified: Mon, 18 Jul 2016 02:36:04 GMT
Server: Apache
Set-Cookie: mykey=myvalue; expires=Mon, 17-Jul-2017 16:06:00 GMT; Max-Age=31449600; Path=/; secure
Transfer-Encoding: chunked
Vary: Cookie, Accept-Encoding
X-Backend-Server: developer2.webapp.scl3.mozilla.com
X-Cache-Info: not cacheable; meta data too large
X-kuma-revision: 1085259
x-frame-options: DENY
```


1. Learn more
    1. すべての HTTP ヘッダーの一覧
2. 用語集
    1. エンティティヘッダー
    2. ヘッダー
    3. レスポンスヘッダー
        1. フェッチメタデータレスポンスヘッダー
    4. リクエストヘッダー
Selector (セレクター) (CSS)
======================

**CSS セレクター**は CSS のルールの一部で、文書中のどの要素がルールと一致するかを記述します。一致した要素にはルールで指定されたスタイルが適用されます。

例
-

この CSS を見てください。


```css
p {
  color: green;
}

div.warning {
  width: 100%;
  border: 2px solid yellow;
  color: white;
  background-color: darkred;
  padding: 0.8em 0.8em 0.6em;
}

#customized {
  font:
    16px Lucida Grande,
    Arial,
    Helvetica,
    sans-serif;
}
```


ここでのセレクターは `"p"` （すべての `<p>` 要素内の文字列に緑色を適用）、 `"div.warning"` （`<div>` 要素でクラスが `"warning"` であるものがすべて警告ボックスのように見えるようにする）、 `"#customized"` （`"customized"` の ID を持つ要素の基本フォントを 16 ピクセルの高さの Lucida Grande またはいくつかの代替フォントに設定）です。

この CSS を次のような HTML に適用します。


```html
<p>This is happy text.</p>

<div class="warning">
  Be careful! There are wizards present, and they are quick to anger!
</div>

<div id="customized">
  <p>This is happy text.</p>

  <div class="warning">
    Be careful! There are wizards present, and they are quick to anger!
  </div>
</div>
```


結果的に、ページの内容は次のように整形されます。

関連情報
----

* CSS 入門内の CSS セレクターについての詳細
* 基本的なセレクター
    + 要素型セレクター `elementname`
    + クラスセレクター `.classname`
    + ID セレクター `#idname`
    + 全称セレクター `* ns|* *|*`
    + 属性セレクター `[attr=value]`
    + 状態セレクター `a:active, a:visited`
* グループ化セレクター
    + セレクターリスト `A, B`
* 結合子
    + 次兄弟結合子 `A + B`
    + 後続兄弟結合子 `A ~ B`
    + 子セレクター `A > B`
    + 子孫セレクター `A B`
* 擬似クラス・要素
    + 擬似クラス `:`
    + 擬似要素 `::`
ARPA
====

**.arpa** (address and routing parameter area) はインターネットインフラ関連の目的で使われるトップレベルドメインです。特に DNS 逆引き(IPアドレスからドメイン名を調べること)のために使われます。

詳細情報
----

### 一般知識

* 公式サイト
* Wikipedia 記事 .arpa
Guard (ガード)
===========

ガードは、`Fetch 仕様`で定義されている `Headers` オブジェクトの機能で、`set()` や `append()` などのメソッドがヘッダーのコンテンツを変更できるかどうかに影響します。 例えば、`immutable`（不変）ガードは、ヘッダーを変更できないことを意味します。 詳しくは、Fetch の基本概念: ガードを参照してください。
Long task
=========

**long task** とは、完了するまでに 50 ミリ秒以上かかるタスクです。 main UI thread が 50 ミリ秒以上ビジーである中断のない期間です。一般的な例では、長時間実行されるイベントハンドラ、高価なリフロー、その他の再レンダリングが含まれ、50 ミリ秒を超えるイベントループの異なるターン間でブラウザーが実行する作業が含まれます。

関連項目
----

* Long task API
Presto
======

Presto は、バージョン 15 までの Opera browser を強化する為に使用された独自のブラウザーレイアウトエンジンでした。それ以降の Opera browser は、 Blink レイアウトエンジンを使用する Chromium をベースにしています。

関連項目
----

* Wikipedia 上の Presto layout engine