Progressive Enhancement (プログレッシブエンハンスメント) - MDN Web Docs 用語集: ウェブ関連用語の定義

Progressive Enhancement (プログレッシブエンハンスメント)
=========================================

**プログレッシブエンハンスメント** (Progressive enhancement) とは、可能な限り多くのユーザーに不可欠なコンテンツと機能のベースラインを提供することを中心とした設計哲学であり、必要なすべてのコードを実行できる最新のブラウザーのユーザーに限り、最高の体験を提供します。

プログレッシブエンハンスメントの「プログレッシブ」とは、古いブラウザーや機能の限られた端末のユーザーには、よりシンプルでありながら良い使い勝手を実現し、同時に新しいブラウザーや機能が豊富な端末のユーザーには、より魅力的で充実したものへ**使い勝手を進化させる**設計であることを意味しているのです。

機能検出は、一般にブラウザーが高水準のコンテンツを処理できるかどうかを判断するために使用されます。 ポリフィル は JavaScript で欠けている機能を構築するためによく使用されます。

アクセシビリティに特別な注意を払うべきです。可能な限り、受け入れ可能な代替案が提供されるべきです。

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

関連情報
----

* Wikipedia 上の プログレッシブエンハンスメント
* What is Progressive Enhancement, and why it matters at freeCodeCamp
* Progressive Enhancement reading list 2021 at QuirksMode
* Understanding Progressive Enhancement by Aaron Gustafson; a 2008 *A List Apart* article which first "placed progressive enhancement at the forefront of web developer thinking"
* Inclusive Web Design For the Future with Progressive Enhancement (related article) by Steve Champeon and Nick Finck; a 2003 SXSW presentation cited by Aaron Gustafson as "unveiling a blueprint for a new way of approaching web development", and naming it "progressive enhancement"


Static typing (静的型付け) - MDN Web Docs 用語集: ウェブ関連用語の定義

Static typing (静的型付け)
=====================

**静的型付け**言語（例えば、Java, C, C++）とは、コンパイル時に変数の型がわかる言語です。静的型付け言語の多くは、プログラマが明示的に型を指定しなければなりませんが、 OCaml のように型推論によってプログラマが変数の型を指定しなくてもよい場合もあります。

関連情報
----

* ウィキペディアの「型システム」


Symmetric-key cryptography (共通鍵暗号) - MDN Web Docs 用語集: ウェブ関連用語の定義

Symmetric-key cryptography (共通鍵暗号)
==================================

共通鍵暗号は、暗号化と復号で同じ鍵を使用する暗号化アルゴリズムに使用される用語です。鍵はふつう、「共通鍵」または「秘密鍵」と呼ばれます。

これは通常、公開鍵暗号では鍵が一組で生成され、一方の鍵で変換が行われたものが、もう一方の鍵でしか逆変換できないのと対照されます。

共通鍵暗号は正しく扱われれば安全で、効率性も高いので、パフォーマンスに負の影響を与えずに大きなデータを暗号化するのに使用することができます。

現在使用されている共通鍵暗号アルゴリズムの多くはブロック暗号です。すなわち、データをブロック単位で暗号化します。それぞれのブロック長は固定長であり、アルゴリズムによって決まります。例えば、 AES は 16 バイトのブロックを使用します。ブロック暗号は常に *モード* とともに使用され、ブロック長よりも長いメッセージを安全に暗号化する方法を指定しています。例えば、 AES は暗号であるのに対し、 CTR, CBC, GCM はすべてモードです。適切ではないモードを使用したり、モードを誤って使用したりした場合は、基礎となる暗号化によって提供されるセキュリティが完全に損なわれることがあります。

* MDN Web Docs 用語集
    + 暗号利用モード
    + 暗号学
    + 暗号学的ハッシュ関数
    + 共通鍵暗号


caret (キャレット) - MDN Web Docs 用語集: ウェブ関連用語の定義

caret (キャレット)
=============

**キャレット** (テキストカーソルとも呼ばれる) は、テキスト入力が挿入される場所を示すために画面に表示されるインジケーターです。 ほとんどのユーザーインターフェイスは、細い縦線または点滅する文字サイズの四角形を使用してキャレットを表しますが、これはさまざまです。 テキスト内のこの位置は**挿入位置**と呼ばれます。「キャレット」という単語は、テキストの挿入位置をマウスカーソル (マウスポインター) と区別するためのものです。

ウェブ上では、`<input>` 要素と `<textarea>` 要素と、`contenteditable` 属性が設定されている要素の挿入位置を表すためにキャレットが使用され、要素の内容をユーザーが編集できるようにします。

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

### 一般知識

* Wikipedia 上の Caret navigation（英語）
* Wikipedia 上の キャレット
### キャレットに関連する CSS

要素の CSS の `caret-color` プロパティを適切な `<color>` 値に設定することで、特定の要素の編集可能なコンテンツのキャレットの色を設定できます。

### キャレットを表示する HTML 要素

これらの要素はテキスト入力フィールドまたはボックスを提供し、したがってキャレットを使用します。

* `<input type="text">`
* `<input type="password">`
* `<input type="search">`
* `<input type="date">`, `<input type="time">`, `<input type="datetime">`, and `<input type="datetime-local">`
* `<input type="number">`, `<input type="range">`
* `<input type="email">`, `<input type="tel">`, and `<input type="url">`
* `<textarea>`
* `contenteditable` 属性が設定された要素


Literal (リテラル) - MDN Web Docs 用語集: ウェブ関連用語の定義

Literal (リテラル)
==============

**リテラル**は JavaScript の値を表します。これらは（変数ではなく）固定値であり、スクリプト内に文字で提供されます。

* 配列リテラル
* 論理値リテラル
* 浮動小数点リテラル
* 数値リテラル
* オブジェクトリテラル
* 正規表現リテラル
* 文字列リテラル
例
-

### 文字列リテラル

文字列リテラルとは、0 文字以上の文字を二重引用符 (`"`) または単一引用符 (`'`) で括ったものです。文字列は同じ種類の引用符で括らなければなりません (つまり、どちらも単一引用符にするか、またはどちらも二重引用符にするかです)。

以下が文字列リテラルの例です。

```js
"foo";
"bar";
"1234";
"one line \n new line";
"Joyo's cat";
```

### オブジェクトリテラル

オブジェクトリテラルとは、プロパティ名とそれに関連付けられたオブジェクトの値とのペアを 0 個以上集めたリストです。波括弧 (`{}`) で囲んで表します。

以下にオブジェクトリテラルの例を示します。`car` オブジェクトの最初の要素には `myCar` プロパティが定義され、新規文字列 "`Toyota`" が割り当てられています。2 番目の要素、`getCar` プロパティには関数 `carTypes('Honda')` によって呼び出された結果が即座に割り当てられます。3 番目の要素、`special` プロパティには既存の変数 (`sales`) が使われています。

```js
const sales = "BMW";

function carTypes(name) {
  return name === "Honda" ? name : `Sorry, we don't sell ${name}.`;
}

const car = {
  myCar: "Toyota",
  getCar: carTypes("Honda"),
  special: sales,
};

console.log(car.myCar); // Toyota
console.log(car.getCar); // Honda
console.log(car.special); // BMW
```

関連情報
----

* Literal (Wikipedia)


Fallback alignment (代替配置) - MDN Web Docs 用語集: ウェブ関連用語の定義

Fallback alignment (代替配置)
=========================

CSS ボックス配置では、代替配置を要求された配置が実現できない場合に対処するために指定します。例えば、`justify-content: space-between` を指定した場合、複数の配置対象物が存在しなければなりません。存在しない場合は、代替配置が使用されます。これは、以下のように配置方法ごとに決まります。

first baseline

`start`

last baseline

`safe end`

Baseline

`start`

space-between

`flex-start` (start)

space-around

`center`

space-evenly

`center`

stretch

`flex-start` (start)

関連情報
----

* CSS ボックス配置


String (文字列) - MDN Web Docs 用語集: ウェブ関連用語の定義

String (文字列)
============

コンピュータープログラミング言語において、文字列 (string) とはテキストを表す連続した文字のことです。

JavaScript では、文字列はプリミティブ値の一つで、`String` オブジェクトが文字列プリミティブのラッパーオブジェクトになります。

関連項目
----

### 基礎知識

* Wikipedia 上の記事「文字列」
* JavaScript のデータ型とデータ構造


Usenet - MDN Web Docs 用語集: ウェブ関連用語の定義

Usenet
======

Usenet は、各投稿が多数のサーバーで複製されるインターネットディスカッションシステムです。当時のインターネットフォーラムに相当する Usenet は、掲示板システムの様に機能していました。

詳細情報
----

### 基礎知識

* Wikipedia 上の記事「Usenet」


CalDAV - MDN Web Docs 用語集: ウェブ関連用語の定義

CalDAV
======

CalDAV（Calendaring extensions to WebDAV）は、IETF によって標準化されたプロトコルであり、サーバーからカレンダーデータにリモートアクセスするために使用されます。

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

### 一般知識

* Wikipedia 上の CalDAV
### 技術文書

* RFC 4791: Calendaring extensions to WebDAV (CalDAV)
* RFC 6638: Scheduling Extensions to CalDAV


RSS - MDN Web Docs 用語集: ウェブ関連用語の定義

RSS
===

**RSS** (Really Simple Syndication) は、サイトの更新情報を配信するためにデザインされた XML ドキュメント形式です。RSS を購読すると、ウェブサイトはフィードと呼ばれる RSS ドキュメントで更新情報を RSS リーダーに送信するため、購読者はお気に入りのウェブサイトをすべて手動でチェックする必要がなくなります。

詳細情報
----

### 一般知識

* Wikipedia の RSS
### 技術リファレンス

* Latest specification


Bandwidth (帯域幅) - MDN Web Docs 用語集: ウェブ関連用語の定義

Bandwidth (帯域幅)
===============

帯域幅は、一定の時間内にデータ接続を通過できる情報量の尺度です。これは、通常、メガビット毎秒（Mbps）またはギガビット毎秒（Gbps）などのビット毎秒（bps）の倍数で測定されます。

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

* Wikipedia 上の Bandwidth（英語）
* Wikipedia 上の 帯域幅


Browser (ブラウザー) - MDN Web Docs 用語集: ウェブ関連用語の定義

Browser (ブラウザー)
===============

**ウェブブラウザー**または**ブラウザー**は、ウェブからページを取得して表示するプログラムで、ユーザーがハイパーリンクを通して更に他のページへアクセスできます。ブラウザーはユーザーエージェントの最もなじみ深い形です。

詳細情報
----

### ブラウザーをダウンロードする

* Mozilla Firefox
* Google Chrome
* Microsoft Edge
* Opera ブラウザー

1. MDN Web Docs 用語集
    1. ユーザーエージェント
2. 一般知識
    1. Wikipedia 上の記事: ウェブブラウザー
    2. ウェブの進化
3. HTTP ヘッダー
    1. `User-agent`


Certificate authority (認証局) - MDN Web Docs 用語集: ウェブ関連用語の定義

Certificate authority (認証局)
===========================

認証局 (CA) は、デジタル証明書とそれに関連する公開鍵に署名し、含まれる情報と鍵が正しいことを保証する組織です。

ウェブサイトのデジタル証明書については、この情報には少なくともデジタル証明書を要求した組織 (例: Mozilla Corporation)、そのサイト (例: mozilla.org)、および認証局が含まれます。

認証局は、インターネットの公開鍵基盤の一部で、ブラウザーがウェブサイトの身元を確認し、 SSL （および HTTPS）で安全に接続できるようにするものです。

**メモ:** ウェブブラウザーには、あらかじめ「ルート証明書」のリストが搭載されています。ブラウザーはこれらを使って、ウェブサイトの証明書がルート証明書に「チェインバック」する（つまり、ルート証明書の所有者や中間認証局に信頼されている）認証局によって署名されていることを確実にチェックすることができる。最終的に、このプロセスは、すべての認証局が証明書に署名する前に適切な身元確認を行うことに依存しています。

関連情報
----

* 認証局 (Wikipedia)
* 公開鍵基盤 (Wikipedia)
* Mozilla Included CA Certificate List


Flex アイテム - MDN Web Docs 用語集: ウェブ関連用語の定義

Flex アイテム
=========

Flex Container (`display: flex` または `display: inline-flex` が設定された要素) の直下の子要素が\*\*「flex アイテム」\*\*となります。

Flex コンテナ内で直下に続くテキストも flex アイテムになります。

関連項目
----

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

* `align-self`
* `flex-basis`
* `flex-grow`
* `flex-shrink`
* `order`
### 参考文献

* CSS フレックスボックスガイド: *フレックスボックスの基本概念*
* CSS フレックスボックスガイド: *フレックスアイテムの順序*
* CSS フレックスボックスガイド: *主軸方向のフレックスアイテムの比率の制御*


Inline-level content (インラインレベルコンテンツ) - MDN Web Docs 用語集: ウェブ関連用語の定義

Inline-level content (インラインレベルコンテンツ)
====================================

CSS において、インラインレイアウトに関係するコンテンツは**インラインレベルコンテンツ**と呼ばれます。ほとんどのテキストシーケンス、置換要素、および生成されたコンテンツは、デフォルトでインラインレベルです。

インラインレイアウトでは、テキスト、置換要素、その他のインラインボックスが混在したストリームを、行ボックスのスタックに断片化することでレイアウトされます。各行ボックスの中でインラインレベルのボックスは、書字方向に応じて互いに垂直または水平に整列されます。一般的には、テキストのベースラインによって整列されます。これは、CSSで変更することができます。

![inline layout](/ja/docs/Glossary/Inline-level_content/inline_layout.png)

**メモ:** HTML (*HyperText Markup Language*) の要素は従来、「ブロックレベル」要素または「インライン要素」の何れかに分類されてきました。これは表示特性であることから、現在は CSS において定義されています。

例
-

```html
<p>
  この span は<span class="highlight">インラインレベル要素</span>です。
  背景は、この要素の影響の始まりと終わりの両方を表示するように色付けされています。
  <input type="radio" /> や <input type="checkbox" /> のような input
  要素もインラインレベルコンテンツです。
</p>
```

この例では、`<p>` 要素にいくつかのテキストが含まれています。そのテキストの中に、インラインレベルの要素である `<span>` 要素と 2 つの `<input>` 要素があります。`<span>` が2行にまたがっている場合、2 つの行ボックスが生成されます。これらの要素はインラインであるため、段落は途切れることのないテキストフローの 1 つの段落として正しく表示されます：
```

body {
  margin: 0;
  padding: 4px;
  border: 1px solid #333;
}

.highlight {
  background-color: #ee3;
}
```

関連情報
----

* ブロックレベルコンテンツ
* インライン整形コンテキスト (en-US)
* `display`


minification - MDN Web Docs 用語集: ウェブ関連用語の定義

minification
============

**minification** とは、ブラウザーによるリソースの処理に影響を与えることなく、不要なデータや冗長なデータを削除する処理です。

minification には、コードコメント、空白、未使用コードの削除、変数名や関数名の短縮が含まれます。Minification はファイルサイズを削減することで、ウェブのパフォーマンスを向上させるために使用されます。一般的には、ビルド時に自動的に実行されます。

minification により人間にとって読みにくいコードになるので、開発者ツールにはコードに空白を戻して少しでも読みやすくすることができる「整形」 機能があります。


OpenSSL - MDN Web Docs 用語集: ウェブ関連用語の定義

OpenSSL
=======

OpenSSL は、SSL と TLS のオープンソースの実装です。

もっと学ぶ
-----

### 一般知識

* Wikipedia 上の OpenSSL
* 公式ウェブサイト


Whitespace (ホワイトスペース) - MDN Web Docs 用語集: ウェブ関連用語の定義

Whitespace (ホワイトスペース)
=====================

**ホワイトスペース**は他の文字の中で水平または垂直の空間を表すために使用される一連の文字です。HTML, CSS, JavaScript, その他のコンピューター言語でトークンを区切るためによく使用されます。ホワイトスペース文字とその使い方は言語によって様々です。

HTML での使い方
----------

HTML Living Standard では、 U+0009 TAB (タブ), U+000A LF (改行), U+000C FF (頁送り), U+000D CR (復帰), U+0020 SPACE (空白) の 5 文字を ASCII ホワイトスペースとして定めています。テキスト形式では、これら普通の空白文字として扱われ、連続したホワイトスペースは多くの場合、1 文字の空白にまとめられます (この動作は CSS の `white-space` プロパティで変更できます)。これらは要素内の要素名と引数、クラス名の区切り文字などとしても使用されます。

JavaScript での使い方
----------------

ECMAScript® 2015 言語仕様書では、いくつかの Unicode コードポイントをホワイトスペースとして定めています。 U+0009 CHARACTER TABULATION <TAB>, U+000B LINE TABULATION <VT>, U+000C FORM FEED <FF>, U+0020 SPACE <SP>, U+00A0 NO-BREAK SPACE <NBSP>, U+FEFF ZERO WIDTH NO-BREAK SPACE <ZWNBSP> および その他のカテゴリ "Zs" Unicode の他の "Separator, space" コードポイント <USP> に属するすべての文字です。これらの文字はふつう、コードの機能性には不要なものです。

1. 仕様書
    1. ASCII whitespace
    2. ECMAScript® 2015 言語仕様書
2. リファレンス
    1. ホワイトスペースは HTML、 CSS、 そして DOM 内でどう扱われるか
    2. `white-space`
3. Wikipedia 記事
    1. Whitespace character (英語)
4. 用語集
    1. Character


CORS - MDN Web Docs 用語集: ウェブ関連用語の定義

CORS
====

**CORS** (オリジン間リソース共有、 Cross-Origin Resource Sharing) は、 HTTP ヘッダーの転送で構成されるシステムであり、ブラウザーがオリジンをまたいだリクエストのレスポンスに、フロントエンドの JavaScript コードがアクセスすることをブロックするかどうかを決めるものです。

同一オリジンセキュリティポリシーは、既定でリソースへのオリジン間のアクセスを禁止しています。しかし、 CORS はウェブサーバーに、リソースへのオリジンをまたいだアクセスを許可すると言うことができるようにします。

理解を深める
------

### 一般知識

* MDN 上の オリジン間リソース共有 (CORS)
* Wikipedia 上の Cross-origin\_resource\_sharing （英語）
### CORS のヘッダー

`Access-Control-Allow-Origin`

レスポンスを共有してよいかどうかを示します。

`Access-Control-Allow-Credentials`

認証情報フラグが true の場合、リクエストに対するレスポンスを公開してよいかどうかを示します。

`Access-Control-Allow-Headers`

プリフライトリクエストへのレスポンスで使用され、実際のリクエストを行う際に使用してよい HTTP ヘッダーを示します。

`Access-Control-Allow-Methods`

プリフライトリクエストへのレスポンスで、リソースにアクセスするときに使用してよいメソッドを指定します。

`Access-Control-Expose-Headers`

レスポンスの一部としてどのヘッダーを公開してよいかを、ヘッダー名を列挙することで示します。

`Access-Control-Max-Age`

プリフライトリクエストの結果をキャッシュできる時間を示します。

`Access-Control-Request-Headers`

プリフライトリクエストを発行する際に、実際のリクエストを行う際に使用される HTTP ヘッダーをサーバーに知らせるために使用します。

`Access-Control-Request-Method`

プリフライトリクエストを発行する際に、実際のリクエストを行う際に使用される HTTP メソッドをサーバーに知らせるために使用します。

`Origin`

どのオリジンからアクセスしているかを示します。

### 技術リファレンス

* Fetch specification


WebGL - MDN Web Docs 用語集: ウェブ関連用語の定義

WebGL
=====

**WebGL** (*Web グラフィックライブラリー*) は、インタラクティブな 2D/3D グラフィックを描画する JavaScript API です。

Khronos グループ が WebGL をメンテナンスしていて、これは OpenGL ES 2.0 を元にしています。

HTML `<canvas>` 要素内で WebGL を実行できて、これがレンダリングサーフェスを提供します。

全ての主要ブラウザーは現在 WebGL をサポートしていますが、利用性は他の要素 (例 GPU サポート) にも依存します。

詳細
--

### 一般情報

* Wikipedia の WebGL
* Check for WebGL support
### 技術記事

* MDN の WebGL
* WebGL のサポート表


Base64 - MDN Web Docs 用語集: ウェブ関連用語の定義

Base64
======

**Base64** とは、バイナリーからテキストへの符号化を行う手法のグループであり、バイナリーデータを 64 を基数とする表現に変換することで、 ASCII 文字列で表すことができます。*Base64* という呼び方は、 MIME の Content-Transfer-Encoding における特定の符号化方式の名前に由来します。

Base64 符号化方式がよく使われるのは、テキストデータを扱うよう設計されたメディア上で、バイナリーデータを格納または転送する必要がある場合です。Base64 符号化により、転送中に変換されることなく、バイナリーデータがそのままであることを保証できます。Base64 は、MIME による電子メールや XML における複合型データの格納など、多くのアプリケーションで幅広く使われています。

ウェブにおける Base64 符号化のよくある用途の一つが、バイナリーデータを符号化することで data: URL に入れられるようにすることです。

JavaScript には、Base64 文字列のエンコードとデコードのそれぞれに対応した、次の 2 つの関数があります。

* `btoa()`: バイナリーデータの「文字列」から Base64 で符号化された ASCII 文字列を生成します ("btoa" は "binary to ASCII" と読んでください)。
* `atob()`: Base64 で符号化された文字列をデコードします ("atob" は "ASCII to binary" と読んでください)。

`atob()` と `btoa()` のアルゴリズムは、 RFC 4648 section 4 で定義されています。

なお、 `btoa()` はバイナリーデータを受け取ることを期待しているため、与えられた文字列に UTF-16 表現の 2 バイト以上を占める文字が含まれていると例外が発生します。詳しくは、 `btoa()` のドキュメントを参照してください。

#### 符号化によるサイズの増加

Base64 の 1 文字はデータのちょうど 6 ビット分を表します。そのため、入力される文字列やバイナリーファイルに含まれる 3 バイト（3×8 ビット = 24 ビット）は、4 桁の Base64 で表されます（4×6 = 24 ビット）。

このことにより、Base64 で表された文字列またはファイルは、元のサイズの 133% の大きさになると言えます（33% の増加）。エンコードされるデータが小さい場合は、さらに増加幅が大きくなります。例えば、`length === 1` である文字列 `"a"` は、エンコードされて `length === 4` の文字列 `"YQ=="` になり、これは 300% の増加です。

「Unicode 問題」
------------

JavaScript の文字列は 16 ビットでエンコードされているので、ほとんどのブラウザーでは、 Unicode 文字列に対して `window.btoa` を呼び出すと、文字が 8 ビット ASCII エンコード文字の範囲を超えた場合に `Character Out Of Range` という例外が発生します。この問題を解決するために、 2 つの使用可能な方法があります。

* 最初の方法は、文字列全体をエスケープしてからエンコードする方法です。
* もう 1 つは、 UTF-16 文字列を UTF-8 文字の配列に変換してからエンコードする方法です。

以下に、使用可能な2つの方法を示します。

### 解決策その 1 - 文字列をエンコードする前にエスケープする

```js
function utf8\_to\_b64(str) {
  return window.btoa(unescape(encodeURIComponent(str)));
}

function b64\_to\_utf8(str) {
  return decodeURIComponent(escape(window.atob(str)));
}

// Usage:
utf8\_to\_b64("✓ à la mode"); // "4pyTIMOgIGxhIG1vZGU="
b64\_to\_utf8("4pyTIMOgIGxhIG1vZGU="); // "✓ à la mode"
```

この解決策は Johan Sundström によって提案されたものです。

 もう一つの使用可能な解決策は、今では非推奨となっている 'unescape' と 'escape' 関数を使用しないものです。
 しかし、この方法では、入力文字列の base64 エンコーディングは行われません。
 `utf8_to_b64` と `b64EncodeUnicode` の出力の違いに注意してください。
 この代替手段を採用すると、他のアプリケーションとの相互運用性の問題が発生する可能性があります。

```js
function b64EncodeUnicode(str) {
  return btoa(encodeURIComponent(str));
}

function UnicodeDecodeB64(str) {
  return decodeURIComponent(atob(str));
}

b64EncodeUnicode("✓ à la mode"); // "JUUyJTlDJTkzJTIwJUMzJUEwJTIwbGElMjBtb2Rl"
UnicodeDecodeB64("JUUyJTlDJTkzJTIwJUMzJUEwJTIwbGElMjBtb2Rl"); // "✓ à la mode"
```

### 解決策その 2 - `atob()` と `btoa()` を `TypedArray` と UTF-8 を使用して書き直す

**メモ:** 以下のコードは、 ArrayBuffer を Base64 文字列から取得する場合、またはその逆の場合にも有用です（下記参照）。

```js
"use strict";
// Array of bytes to Base64 string decoding
function b64ToUint6(nChr) {
  return nChr > 64 && nChr < 91
    ? nChr - 65
    : nChr > 96 && nChr < 123
      ? nChr - 71
      : nChr > 47 && nChr < 58
        ? nChr + 4
        : nChr === 43
          ? 62
          : nChr === 47
            ? 63
            : 0;
}

function base64DecToArr(sBase64, nBlocksSize) {
  const sB64Enc = sBase64.replace(/[^A-Za-z0-9+/]/g, "");
  const nInLen = sB64Enc.length;
  const nOutLen = nBlocksSize
    ? Math.ceil(((nInLen \* 3 + 1) >> 2) / nBlocksSize) \* nBlocksSize
    : (nInLen \* 3 + 1) >> 2;
  const taBytes = new Uint8Array(nOutLen);

  let nMod3;
  let nMod4;
  let nUint24 = 0;
  let nOutIdx = 0;
  for (let nInIdx = 0; nInIdx < nInLen; nInIdx++) {
    nMod4 = nInIdx & 3;
    nUint24 |= b64ToUint6(sB64Enc.charCodeAt(nInIdx)) << (6 \* (3 - nMod4));
    if (nMod4 === 3 || nInLen - nInIdx === 1) {
      nMod3 = 0;
      while (nMod3 < 3 && nOutIdx < nOutLen) {
        taBytes[nOutIdx] = (nUint24 >>> ((16 >>> nMod3) & 24)) & 255;
        nMod3++;
        nOutIdx++;
      }
      nUint24 = 0;
    }
  }

  return taBytes;
}

/\* Base64 string to array encoding \*/
function uint6ToB64(nUint6) {
  return nUint6 < 26
    ? nUint6 + 65
    : nUint6 < 52
      ? nUint6 + 71
      : nUint6 < 62
        ? nUint6 - 4
        : nUint6 === 62
          ? 43
          : nUint6 === 63
            ? 47
            : 65;
}

function base64EncArr(aBytes) {
  let nMod3 = 2;
  let sB64Enc = "";

  const nLen = aBytes.length;
  let nUint24 = 0;
  for (let nIdx = 0; nIdx < nLen; nIdx++) {
    nMod3 = nIdx % 3;
    if (nIdx > 0 && ((nIdx \* 4) / 3) % 76 === 0) {
      sB64Enc += "\r\n";
    }

    nUint24 |= aBytes[nIdx] << ((16 >>> nMod3) & 24);
    if (nMod3 === 2 || aBytes.length - nIdx === 1) {
      sB64Enc += String.fromCodePoint(
        uint6ToB64((nUint24 >>> 18) & 63),
        uint6ToB64((nUint24 >>> 12) & 63),
        uint6ToB64((nUint24 >>> 6) & 63),
        uint6ToB64(nUint24 & 63),
      );
      nUint24 = 0;
    }
  }
  return (
    sB64Enc.substr(0, sB64Enc.length - 2 + nMod3) +
    (nMod3 === 2 ? "" : nMod3 === 1 ? "=" : "==")
  );
}

/\* UTF-8 array to JS string and vice versa \*/

function UTF8ArrToStr(aBytes) {
  let sView = "";
  let nPart;
  const nLen = aBytes.length;
  for (let nIdx = 0; nIdx < nLen; nIdx++) {
    nPart = aBytes[nIdx];
    sView += String.fromCodePoint(
      nPart > 251 && nPart < 254 && nIdx + 5 < nLen /\* six bytes \*/
        ? /\* (nPart - 252 << 30) may be not so safe in ECMAScript! So…: \*/
          (nPart - 252) \* 1073741824 +
            ((aBytes[++nIdx] - 128) << 24) +
            ((aBytes[++nIdx] - 128) << 18) +
            ((aBytes[++nIdx] - 128) << 12) +
            ((aBytes[++nIdx] - 128) << 6) +
            aBytes[++nIdx] -
            128
        : nPart > 247 && nPart < 252 && nIdx + 4 < nLen /\* five bytes \*/
          ? ((nPart - 248) << 24) +
            ((aBytes[++nIdx] - 128) << 18) +
            ((aBytes[++nIdx] - 128) << 12) +
            ((aBytes[++nIdx] - 128) << 6) +
            aBytes[++nIdx] -
            128
          : nPart > 239 && nPart < 248 && nIdx + 3 < nLen /\* four bytes \*/
            ? ((nPart - 240) << 18) +
              ((aBytes[++nIdx] - 128) << 12) +
              ((aBytes[++nIdx] - 128) << 6) +
              aBytes[++nIdx] -
              128
            : nPart > 223 && nPart < 240 && nIdx + 2 < nLen /\* three bytes \*/
              ? ((nPart - 224) << 12) +
                ((aBytes[++nIdx] - 128) << 6) +
                aBytes[++nIdx] -
                128
              : nPart > 191 && nPart < 224 && nIdx + 1 < nLen /\* two bytes \*/
                ? ((nPart - 192) << 6) + aBytes[++nIdx] - 128
                : /\* nPart < 127 ? \*/ /\* one byte \*/
                  nPart,
    );
  }
  return sView;
}

function strToUTF8Arr(sDOMStr) {
  let aBytes;
  let nChr;
  const nStrLen = sDOMStr.length;
  let nArrLen = 0;

  /\* mapping… \*/
  for (let nMapIdx = 0; nMapIdx < nStrLen; nMapIdx++) {
    nChr = sDOMStr.codePointAt(nMapIdx);

    if (nChr > 65536) {
      nMapIdx++;
    }

    nArrLen +=
      nChr < 0x80
        ? 1
        : nChr < 0x800
          ? 2
          : nChr < 0x10000
            ? 3
            : nChr < 0x200000
              ? 4
              : nChr < 0x4000000
                ? 5
                : 6;
  }

  aBytes = new Uint8Array(nArrLen);

  /\* transcription… \*/
  let nIdx = 0;
  let nChrIdx = 0;
  while (nIdx < nArrLen) {
    nChr = sDOMStr.codePointAt(nChrIdx);
    if (nChr < 128) {
      /\* one byte \*/
      aBytes[nIdx++] = nChr;
    } else if (nChr < 0x800) {
      /\* two bytes \*/
      aBytes[nIdx++] = 192 + (nChr >>> 6);
      aBytes[nIdx++] = 128 + (nChr & 63);
    } else if (nChr < 0x10000) {
      /\* three bytes \*/
      aBytes[nIdx++] = 224 + (nChr >>> 12);
      aBytes[nIdx++] = 128 + ((nChr >>> 6) & 63);
      aBytes[nIdx++] = 128 + (nChr & 63);
    } else if (nChr < 0x200000) {
      /\* four bytes \*/
      aBytes[nIdx++] = 240 + (nChr >>> 18);
      aBytes[nIdx++] = 128 + ((nChr >>> 12) & 63);
      aBytes[nIdx++] = 128 + ((nChr >>> 6) & 63);
      aBytes[nIdx++] = 128 + (nChr & 63);
      nChrIdx++;
    } else if (nChr < 0x4000000) {
      /\* five bytes \*/
      aBytes[nIdx++] = 248 + (nChr >>> 24);
      aBytes[nIdx++] = 128 + ((nChr >>> 18) & 63);
      aBytes[nIdx++] = 128 + ((nChr >>> 12) & 63);
      aBytes[nIdx++] = 128 + ((nChr >>> 6) & 63);
      aBytes[nIdx++] = 128 + (nChr & 63);
      nChrIdx++;
    } /\* if (nChr <= 0x7fffffff) \*/ else {
      /\* six bytes \*/
      aBytes[nIdx++] = 252 + (nChr >>> 30);
      aBytes[nIdx++] = 128 + ((nChr >>> 24) & 63);
      aBytes[nIdx++] = 128 + ((nChr >>> 18) & 63);
      aBytes[nIdx++] = 128 + ((nChr >>> 12) & 63);
      aBytes[nIdx++] = 128 + ((nChr >>> 6) & 63);
      aBytes[nIdx++] = 128 + (nChr & 63);
      nChrIdx++;
    }
    nChrIdx++;
  }

  return aBytes;
}
```

### テスト

```js
/\* Tests \*/

const sMyInput = "Base 64 \u2014 Mozilla Developer Network";

const aMyUTF8Input = strToUTF8Arr(sMyInput);

const sMyBase64 = base64EncArr(aMyUTF8Input);

alert(sMyBase64);

const aMyUTF8Output = base64DecToArr(sMyBase64);

const sMyOutput = UTF8ArrToStr(aMyUTF8Output);

alert(sMyOutput);
```

### 付録: Base64 文字列を Uint8Array または ArrayBuffer へデコード

これらの関数により、 Base64 エンコードされた文字列から Uint8Array や ArrayBuffer を作成することも可能です。

```js
// "Base 64 \u2014 Mozilla Developer Network"
const myArray = base64DecToArr(
  "QmFzZSA2NCDigJQgTW96aWxsYSBEZXZlbG9wZXIgTmV0d29yaw==",
);

// "Base 64 \u2014 Mozilla Developer Network"
const myBuffer = base64DecToArr(
  "QmFzZSA2NCDigJQgTW96aWxsYSBEZXZlbG9wZXIgTmV0d29yaw==",
).buffer;

alert(myBuffer.byteLength);
```

**メモ:** `base64DecToArr(sBase64[, nBlocksSize])` 関数は、バイト列の `Uint8Array` を返します。 16 ビット/ 32 ビット/ 64 ビットの生データのバッファーを構築することを目的とする場合、 `nBlocksSize` 引数を使用します。これは、 `uint8Array.buffer.bytesLength` プロパティの結果が倍数となるべきバイト数（ASCII、バイナリー列（すなわち、列内のそれぞれの文字を 1 バイトのバイナリーデータと見なす列）、 UTF-16 列では `2`、 UTF-32 列では `4`）を表します。


HTTP/3 - MDN Web Docs 用語集: ウェブ関連用語の定義

HTTP/3
======

**HTTP/3** は HTTP/2 に続く HTTP ネットワークプロトコル の今後のメジャーリビジョンです。 HTTP/3 の主なポイントは TCP の代わりに QUIC という新しい UDP (en-US) プロトコルを使用することです。

1. 一般知識
    1. MDN 上の HTTP
    2. Wikipedia 上の HTTP/3
2. 用語集
    1. HTTP
    2. HTTP/2
    3. Latency


Prerender - MDN Web Docs 用語集: ウェブ関連用語の定義

Prerender
=========

プリレンダリングを使用すると、コンテンツは先読みされ、ブラウザーによってバックグラウンドでレンダリングされます。これは、コンテンツが非表示の別のタブにレンダリングされた場合と同じです。ユーザーがプリレンダリングされたコンテンツに移動すると、現在のコンテンツがすぐにプリレンダリングされたコンテンツに置き換えられます。
```

<link rel="prerender" href="https://example.com/content/to/prerender">
```

関連情報
----

* 先読み


Pseudo-class - MDN Web Docs 用語集: ウェブ関連用語の定義

Pseudo-class
============

CSS では**擬似クラス**セレクターを使うことで、ドキュメントツリーからの情報ではなく、その状態によって、対象の要素を指定することができます。例えば、セレクター `a``:visited` は、ユーザーがすでに訪問したリンクだけに、スタイルを適用することができます。

関連項目
----

### 技術リファレンス

* Pseudo-class documentation (擬似クラス)


Synchronous (同期通信方式) - MDN Web Docs 用語集: ウェブ関連用語の定義

Synchronous (同期通信方式)
====================

同期 (*Synchronous*) とは、各当事者がメッセージを瞬時に（または可能な限り直ちに）受信（また必要な場合には処理および返信）するリアルタイムのコミュニケーションのことを指します。

人間での例としては電話が挙げられます。電話の通話中は、あなたは通話相手に直ちに返事をしやすいです。

プログラミングのコマンドの多くも同期的です。例えば、計算式を入力すると、環境は即座にその結果を返します（そうならないようにプログラムをしない限り）。

関連情報
----

* Asynchronous
* Synchronous and asynchronous requests （XMLHttpRequest() API を用いている）


Void element （空要素） - MDN Web Docs 用語集: ウェブ関連用語の定義

Void element （空要素）
==================

**空要素 (void element)** とは HTML における要素のうち、子ノード（すなわち子要素およびテキストノード）を**持つことができない**ものを指します。空要素には開始タグしかありません。空要素では終了タグを指定することができません。

また HTML においては、空要素に終了タグを置くことはできません。例えば、 `<input type="text"></input>` は不正な HTML です。一方、 SVG や MathML の要素で子ノードを保有することができないものは、開始タグ内で XML 自己完結型タグ構文を置く代わりに終了タグを使用することができます。

HTML、SVG、MathML の各仕様書は、それぞれの要素が何を含むことができるかを詳細に定義しています。従って、一部のタグの組み合わせは意味が失われます。

空要素が何らかの子を持つようにマークアップする方法はありませんが、 JavaScript でプログラム的に子ノードを DOM 内の要素に追加することができます。しかし、それは良い方法とは言えません。なぜなら、その結果は信頼できるものではないからです。

HTML には以下の空要素が存在します。

* `<area>`
* `<base>`
* `<br>`
* `<col>`
* `<embed>`
* `<hr>`
* `<img>`
* `<input>`
* `<link>`
* `<meta>`
* `<param>`
* `<source>`
* `<track>`
* `<wbr>`
自己完結型タグ
-------

*自己完結型タグ(`<tag />`)は HTML には存在しません。*\

HTML 要素の開始タグの末尾に `/` （スラッシュ）文字がある場合、 HTML パーサーはそのスラッシュ文字を無視します。 `<script>` や `<ul>` のような要素で終了タグが必要となる場合において、このことを忘れないようにして下さい。このような場合、開始タグの末尾にスラッシュを追加しても、要素は閉じられません。

しかし、コードフォーマッターの中には、 XHTML と互換性を持たせたり、読み取りやすくしたりするために、空の要素の開始タグに末尾のスラッシュ文字を追加するものがあります。例えば、 コードフォーマッターによっては、`<input type="text">` を `<input type="text" />` に変換するものがあります。

XML 、 XHTML や SVG の空要素では自己完結型タグが必要です (例、`<circle cx="50" cy="50" r="50" />`) 。

子ノードを保有できない SVG と MathML 要素の開始タグは、自己完結型であることをマークすることが許されています。このような場合、要素の開始タグが自己完結型とマークされていれば、その要素は終了タグを持つべきではありません。

**メモ:** 開始タグの末尾にある `/` (スラッシュ) 文字の前に、引用されていない属性値が直接ある場合（間に空白がない場合）、スラッシュはパーサーによって破棄されるのではなく、属性値の一部となります。例えば、`<img src=http://www.example.com/logo.svg/>` というマークアップは `src` 属性の値が `http://www.example.com/logo.svg/` であることを意味します - これは URL が間違っていることを意味します。

関連情報
----

* 置換要素


Local scope (ローカルスコープ) - MDN Web Docs 用語集: ウェブ関連用語の定義

Local scope (ローカルスコープ)
======================

ローカルスコープは 変数 をローカルにする変数の特性です（つまり、変数名は グローバルスコープ ではないスコープ内の 値 にのみ結び付けられます）。

関連項目
----

### 一般知識

* Wikipedia の スコープ


OpenGL - MDN Web Docs 用語集: ウェブ関連用語の定義

OpenGL
======

**OpenGL** (**Open Graphics Library**)は言語横断的な、2D と 3D ベクターグラフィックス用のマルチプラットフォーム i のアプリケーションプログラミングインターフェイス (API) です。この API は、ハードウェアで加速したレンダリングを得るため、画像プロセッサー (GPU) と相互作用させて使うことが典型的です。

さらに詳しく
------

### 一般知識

* Wikipedia でのOpenGL


CSS Object Model (CSSOM) - MDN Web Docs 用語集: ウェブ関連用語の定義

CSS Object Model (CSSOM)
========================

**CSS Object Model (CSSOM)** とは、すべての CSS セレクターとそれぞれのセレクターに関連するプロパティを、ルートノード、兄弟、子孫、子、その他の関係からなるツリーの形に変換したものです。CSSOM は、Document Object Model (DOM) とよく似ています。それらの両方は、ウェブサイトを適切にレンダリングするために必ず発生する一連のステップである、クリティカルレンダリングパスの一部です。

CSSOM は、DOM とともに、レンダリングツリーを構築し、さらにブラウザーによってウェブページをレイアウトし描画するために使用されます。

### CSSOM API

CSS Object Model は JavaScript に CSS の操作を許可する API のセットでもあります。それは HTML よりもむしろ CSS のための DOM のようなものです。それによってユーザーは CSS のスタイルを動的に読み取ったり変更したりできます。

関連情報
----

* ページの生成：ブラウザーはどのように動作するか


HTTP - MDN Web Docs 用語集: ウェブ関連用語の定義

HTTP
====

**HTTP** (HyperText Transfer Protocol、ハイパーテキスト転送プロトコル) は、Web上のハイパーメディア文書の転送を可能にする、基盤となるネットワークプロトコルです。一般にブラウザーとサーバーの間で用いられ、人間が読むことができます。現行の HTTP 仕様のバージョンは HTTP/2 と呼ばれています。

URIの一部として「`http://example.com/`」の中の「http」は「スキーマ」と呼ばれ、これを使ったリソースは、通常 HTTP プロトコルを用いた非暗号化コネクションで転送されます。(「`https://developer.mozilla.org`」にあるような)「https」スキーマでは、リソースは HTTP プロトコルで転送されますが、安全な TLSチャンネルを経由します。

HTTP はテクスチュアルであり(すべての通信はプレーンテキストで行われます)、ステートレスです(前の通信を気にせずに通信されます)。この特性は人間がワールドワイドウェブ上の文書(ウェブサイト)を読むのに理想的です。しかし HTTP は、サーバーからサーバーへのRESTウェブサービスや、ウェブサイトをより動的にするためにその内部で用いられるAJAXリクエストの基礎としても使用できます。

関連項目
----

* MDN 上の HTTP
* Wikipedia 上の HTTP


Simple response header - MDN Web Docs 用語集: ウェブ関連用語の定義

Simple response header
======================

CORS セーフリストレスポンスヘッダーの古い用語です。


Locale (ロケール) - MDN Web Docs 用語集: ウェブ関連用語の定義

Locale (ロケール)
=============

**ロケール**は、ユーザーインターフェイス用の言語別または国別の基本設定のセットです。

プログラムは、ロケール設定をホストシステムの言語から引き出します。とりわけ、ロケールは、指定された地域のプロトコルに従って、用紙サイズ、通貨、日付書式、および数値を表します。

関連情報
----

* Wikipedia 上の Locale（英語）


Parser (パーサー) - MDN Web Docs 用語集: ウェブ関連用語の定義

Parser (パーサー)
=============

**パーサー**は、ソースコードファイルを解析するコンパイラまたはインタプリタのモジュールです。

より一般的に言えば、テキストを解析して内容を別の表現に変換するソフトウェアです。

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

### 一般知識

* Wikipedia 上の Parser（英語）
* Wikipedia 上の 構文解析器


XLink - MDN Web Docs 用語集: ウェブ関連用語の定義

XLink
=====

XLink は W3C の標準規格で、 XML と、 XML または他の文書との間のリンクを記述するために使用されます。その動作の一部は、どのように処理するかが実装に委ねられています。

単純な XLinks は Firefox で（少なくとも SVG と MathML では）「対応」されていますが、プレーンな XML 文書を XLinks で読み込んで、XML ツリーの関連ポイントをクリックしようとしても、リンクとしては機能しません。

XLink 1.0 で通常のリンクとしては面倒だと感じていた人のために、 XLink 1.1 では、単純なリンクには `xlink:type="simple"` を指定する必要がなくなりました。

XLink は SVG、MathML、その他の重要な標準で使用されています。

### 仕様書

* XLink 1.0
* XLink 1.1 (現在進行中の草案)
### 関連情報

* XML
* Code snippets:getAttributeNS - この DOM メソッドに対応していないブラウザーに対応するためのラッパー


Serializable object （シリアライズ可能オブジェクト） - MDN Web Docs 用語集: ウェブ関連用語の定義

Serializable object （シリアライズ可能オブジェクト）
====================================

**シリアライズ可能オブジェクト**は、どのような JavaScript 環境 ("realm") でもシリアライズし、後でデシリアライズすることができるオブジェクトです。
 これは例えば、ディスクに格納し後から復元したり、`structuredClone()` で複製したり、`DedicatedWorkerGlobalScope.postMessage()` を使用してワーカー間で共有したりすることができます。

 シリアライズは、元のオブジェクトのすべてのプロパティや、その他の一部を含まないことがあります。
 例えば、`DOMException` のシリアライズには `name` および `message` プロパティは必ず含まれますが、他のプロパティが含まれるかどうかは実装に依存します。
 結果的に、デシリアライズされたオブジェクトは元オブジェクトと同一のクローン/複製とは限りません。
 しかし、デシリアライズされた新しいオブジェクトはディープコピーになるので、元のオブジェクトからシリアライズされ、新しいオブジェクトにデシリアライズされたプロパティは、元のオブジェクトと参照することはありません。

 オブジェクトをシリアライズしたりデシリアライズしたりするときに、コピーを作成するよりもリソースを移譲したほうが理にかなっている場合があります。
 移譲可能なオブジェクトは移譲可能オブジェクトと呼ばれます。

対応しているオブジェクト
------------

 すべてのプリミティブ値は、シリアライズ可能です。
 すべてのオブジェクトが、シリアライズ可能なオブジェクトとは限りません。
 シリアライズ可能なオブジェクトについては、構造化複製アルゴリズム > 対応済みの型に一覧があります。

**メモ:** シリアライズ可能なオブジェクトは、Web IDL ファイル に `[Serializable]` 属性で示されています。


Function (関数) - MDN Web Docs 用語集: ウェブ関連用語の定義

Function (関数)
=============

**関数** は、他のコードや自分自身、関数を参照する 変数 から呼ばれるコード断片です。関数が呼ばれると、引数 が関数への入力として渡され、次に関数は任意で値を戻します。JavaScript における関数は、オブジェクト でもあります。

関数名は、関数宣言の一部または関数式に含まれる 識別子 です。関数名の スコープ は、関数名が宣言か式かによって決まります。

### さまざまな関数の種類

**無名関数** とは、関数名のない関数です。無名にできるのは関数式のみで、関数宣言には名前が必要です。

```js
// 関数式
(function () {});
// アロー関数
() => {};
```

下記の用語は、ECMAScript 言語仕様で使用されているものではなく、関数の様々な種類を表すための俗称です。

**名前付き関数** とは、関数名のある関数です。

```js
// 関数宣言
function foo() {}
// 名前付き関数式
(function bar() {});
// アロー関数
const foo = () => {};
```

**内部関数** は、ほかの関数内に書かれた関数です (この例では `square`)。**外部関数** は、関数を含む関数です (この例では `addSquares`):

```js
function addSquares(a, b) {
  function square(x) {
    return x \* x;
  }
  return square(a) + square(b);
}
// アロー関数を使う
const addSquares = (a, b) => {
  const square = (x) => x \* x;
  return square(a) + square(b);
};
```

**再帰関数** は自身を呼び出す関数です。再帰 を参照してください。

```js
function loop(x) {
  if (x >= 10) return;
  loop(x + 1);
}
// アロー関数を使う
const loop = (x) => {
  if (x >= 10) return;
  loop(x + 1);
};
```

**即時実行関数式** (IIFE) は、関数がブラウザーのコンパイラーに読み込まれた直後に呼び出される関数です。IIFE を見分けるには、関数定義の末尾に追加の左括弧と右括弧があるかどうかで判断できます。

```js
// 関数宣言は、この方法で即時実行できません。
// (https://en.wikipedia.org/wiki/Immediately-invoked\_function\_expression)
/\*
function foo() {
 console.log('Hello Foo');
}();
\*/

// 名前付きまたは無名の関数式は即時実行できます。
(function foo() {
  console.log("Hello Foo");
})();

(function food() {
  console.log("Hello Food");
})();

(() => console.log("hello world"))();
```

IIFE の詳細を知りたい方は、次の Wikipedia のページを確認してください: Immediately Invoked Function Expression

関連項目
----

### 技術リファレンス

* 関数
* アロー関数


DSL - MDN Web Docs 用語集: ウェブ関連用語の定義

DSL
===

**DSL** という用語は、文脈によって意味が異なることがあります。以下の可能性があります。

DSL (デジタル加入者線)
**DSL (デジタル加入者線)** は、ブロードバンドインターネット接続の一種で、電話回線を使って有線データ通信を行うものです。
DSL (ドメイン固有言語)
**DSL（ドメイン固有言語）** とは、あるアプリケーションドメイン内の特定の問題に対処するために設計された、範囲が限定されたコンピューター言語の一種です。

関連情報
----

* Wikipedia 上の DSL


Property (プロパティ) - MDN Web Docs 用語集: ウェブ関連用語の定義

Property (プロパティ)
================

**プロパティ**という用語はコンテキストに応じて幾つかの意味を持ちます。以下を参照してください：

Property (プロパティ) (CSS)
**CSS のプロパティ**は、関連付けられた値によりブラウザーがどのように要素を表示するかを定義する特性です。
Property (プロパティ) (JavaScript)
**JavaScript プロパティ**は、多くの場合データ構造と関連付けられた属性を記述する、オブジェクトの特性です。


Strict mode (厳格モード) - MDN Web Docs 用語集: ウェブ関連用語の定義

Strict mode (厳格モード)
===================

JavaScript の**厳格モード**は、 JavaScript の制限された変化形を*利用する*方法であり、それによって暗黙的に "sloppy mode" をやめることができます。厳格モードは単なるサブセットではありません。通常のコードとは*意図的に*異なる意味を持っています。

スクリプト全体を厳格モードにする場合は、他の文の前に `"use strict";` 文を含めることで呼び出すことができます。

1. 厳格モード
2. 厳格モードへの移行
3. 用語集
    1. Sloppy mode


Validator (バリデーター) - MDN Web Docs 用語集: ウェブ関連用語の定義

Validator (バリデーター)
==================

バリデーターはコードの構文エラーを確認するプログラムです。バリデーターはあらゆる書式や言語のために作成することができますが、ここでは特に HTML、CSS、そして XML を確認するツールのことを指します。

詳細情報
----

### 一般知識

* Wikipedia の Validator (英語)
* バリデーターの例


Composite operation (合成演算) - MDN Web Docs 用語集: ウェブ関連用語の定義

Composite operation (合成演算)
==========================

CSS では、 CSS ルールのプロパティの値がそのプロパティの基盤値であり、キーフレームの同じプロパティの値がそのプロパティの効果値です。

合成演算 (*composite operation*) は、効果値と基盤値とを結合して、最終的なキーフレームの効果値を生成するために使用する固有の演算です。合成演算には 3 種類があります。

* **置換**: 効果値が基盤値を置き換えます。この場合の最終的な効果値は、元の効果値そのものです。
* **追加**: 効果値は基盤値に追加されます。
* **累積**: 効果値は基礎値に結合されます。

**メモ:** CSSの合成演算はアニメーションにのみ適用されます。

関連情報
----

* `animation-composition`
* `KeyframeEffect.composite` (en-US)


NaN (非数) - MDN Web Docs 用語集: ウェブ関連用語の定義

NaN (非数)
========

非数(英語：Not a Number)とは未定義な値か、特に浮動小数点数の計算の結果で、表すことができない数値(データ型)のことを言います。

例えば、無限、０で割り算された結果、未定義、負数の平方根 (浮動小数点数は実数ですが、これは虚数です) などは非数と言います。

かんたんに言うと、JavaScript プログラムで、2 つの変数で割り算を行うと、結果が NaN (JavaScript では "undefined" と定義されています)になる可能性があるとします。この場合、この割り算はプログラムを壊す可能性があります。ここで、この計算が大きなアルゴリズムの小さな一部分である場合、実際どこに問題があったかを理解するのはとても苦痛です。幸いにも、計算結果が NaN となり、除数が 0 を取りえることがわかるため、最初にそうした計算を防ぐためのテスト条件を設けることや、起こったあとに通知することができます。

もっと学ぶ
-----

### 一般的な知識

* Wikipedia によるNaN
### 技術情報

* JavaScript での非数


Baseline - MDN Web Docs 用語集: ウェブ関連用語の定義

Baseline
========

**ベースライン**という用語は文脈によっていくつかの意味を持つことがあります。

Baseline (typography)
**ベースライン**とは、ヨーロッパおよび西アジアの書体で使用される用語で、フォントの文字がその上に載る概念上の線を意味します。
Baseline (互換性)
**Baseline** （ベースライン）は、ブラウザー間で動作するウェブプラットフォームの機能を確認します。Baseline は、サイトの訪問者に互換性の問題を引き起こす可能性が低くなった時期を示すことで、その機能を使用するタイミングを決定するのに役立ちます。
関連情報
----

* Baseline (Wikipedia)


CDN - MDN Web Docs 用語集: ウェブ関連用語の定義

CDN
===

**CDN** （Content Delivery Network、コンテンツ配信ネットワーク）は、様々な地域に分散されたサーバーの集まりです。これらのサーバーは同じ内容のデータのコピーを保有し、各ユーザーに最も近いサーバーからデータへの要求に応えることが可能になっています。 CDN は通信量の影響を受けにくい高速なサービスを実現します。

CDN は、 Bootstrap や jQuery など、スタイルシートや JavaScript ファイル（静的ファイル）からなるライブラリを配信するために広く用いられています。これらのサードパーティライブラリの配信に CDN を用いることが有効な理由はいくつかあります。

* ライブラリのような静的なファイルを CDN から配信することで、サーバーへの要求負荷を軽減します。
* ほとんどの CDN は世界中にサーバーを配置しています。そのため、自分のサーバーよりも CDN のサーバーの方が地理的にユーザーの近くに位置しているかもしれません。地理的な距離は応答時間に比例的に影響します。
* CDN には適切なキャッシュ設定が適用されています。 CDN を使用すると、自分のサーバーに静的ファイルを配置するための設定を行う手間を省くことができます。


Shallow copy (シャローコピー) - MDN Web Docs 用語集: ウェブ関連用語の定義

Shallow copy (シャローコピー)
======================

オブジェクトの**シャローコピー**とは、コピーがコピー元のオブジェクトとプロパティにおいて同じ参照を共有する（同じ基礎値を指す）コピーのことを指します。その結果、コピー元とコピー先のどちらかを変更すると、もう一方のオブジェクトも変更される可能性があります。そのため、意図せずにコピー元やコピー先に予期しない変更が発生してしまう可能性があります。この挙動は、ソースとコピーが完全に独立しているディープコピーの挙動とは対照的です。

シャローコピーでは、オブジェクトの既存の要素にある共有プロパティの値を選択的に変更することは、既存の要素に完全に新しい値を割り当てることとは異なるということを理解することが重要です。

例えば、配列オブジェクトの `copy` という名前のシャローコピーにおいて、 `copy[0]` 要素の値が `{"list":["butter","flour"]}` であるとき、 `copy[0].list = ["oil","flour"]` を実行すると、元のオブジェクト内の対応する要素も変化します。これは、元のオブジェクトとシャローコピーの両方で共有しているオブジェクトのプロパティを選択的に変更したためです。

しかし、代わりに `copy[0] = {"list":["oil","flour"]}` とすると、元のオブジェクト内の対応する要素は**変化しません**。それはこの場合、シャローコピーが元のオブジェクトと共有している既存の配列要素のプロパティを選択的に変更するのではなく、シャローコピー側にだけ、 `copy[0]` の配列要素に全く新しい値を割り当てていることになるからです。

JavaScript では、すべての標準組込みオブジェクトのコピー操作（スプレッド構文, `Array.prototype.concat()`, `Array.prototype.slice()`, `Array.from()`, `Object.assign()`, `Object.create()`）において、ディープコピーではなくシャローコピーを生成します。

例
-

次の例では、配列オブジェクト `ingredients_list` を作成し、その `ingredients_list` オブジェクトをコピーして `ingredients_list_copy` オブジェクトを作成する場合を考えてみましょう。

```js
let ingredients_list = ["noodles", { list: ["eggs", "flour", "water"] }];

let ingredients_list_copy = Array.from(ingredients_list);
console.log(JSON.stringify(ingredients_list_copy));
// ["noodles",{"list":["eggs","flour","water"]}]
```

`ingredients_list_copy` の `list` プロパティの値を変更すると、 `ingredients_list` 元のオブジェクト内の `list` プロパティも変更されます。

```js
ingredients_list_copy[1].list = ["rice flour", "water"];
console.log(ingredients_list[1].list);
// Array [ "rice flour", "water" ]
console.log(JSON.stringify(ingredients_list));
// ["noodles",{"list":["rice flour","water"]}]
```

`ingredients_list_copy` の最初の要素に完全に新しい値を代入しても、 `ingredients_list` ソースオブジェクト内の最初の要素には何の変更も発生しません。

```js
ingredients_list_copy[0] = "rice noodles";
console.log(ingredients_list[0]);
// noodles
console.log(JSON.stringify(ingredients_list_copy));
// ["rice noodles",{"list":["rice flour","water"]}]
console.log(JSON.stringify(ingredients_list));
// ["noodles",{"list":["rice flour","water"]}]
```

関連情報
----

* ディープコピー


MIME type (MIMEタイプ) - MDN Web Docs 用語集: ウェブ関連用語の定義

MIME type (MIMEタイプ)
===================

**MIME タイプ** (現在は正しくは「メディアタイプ」と呼ばれますが、「コンテンツタイプ」と呼ばれることもあります) は、ファイルの種類を示し、ファイルと共に送信される文字列です (例えば、音声ファイルは `audio/ogg`、画像ファイルは `image/png` というようにラベル付けして、コンテンツ形式を記述します)。

Windows 上で従来行われていたファイル拡張子と同じ目的を果たします。この名前は、もともと電子メールで使用されていた MIME 規格に由来しています。

詳細情報
----

### 一般知識

* Wikipedia 上の メディアタイプ
### 技術リファレンス

* MIME タイプのリスト (英語)
* サーバー MIME タイプの適切な設定 (en-US)
* ウェブコンテキストでの MIME タイプの使用法に関する詳細情報。
* MIME タイプの不完全なリスト
* Mozilla がどのように MIME タイプを決定しているか
* MediaRecorder.mimeType


Flexbox (フレックスボックス) - MDN Web Docs 用語集: ウェブ関連用語の定義

Flexbox (フレックスボックス)
===================

Flexbox は、アイテムを列方向や行方向など一次元に並べて表示するためのレイアウトモデルである CSS Flexible Box Layout Module に対する一般的な通称です。

この仕様書では、Flexbox はユーザーインターフェイスの設計のためのレイアウトモデルとして説明されています。Flexbox の重要な特徴として、フレックスレイアウト内のアイテムが伸縮することができるという点が挙げられます。余白はアイテム自体に割り当てることも、アイテム間やアイテム周りに配分することも出来ます。

また、Flexbox はでは主軸や交差軸にそった位置合わせをすることもでき、アイテムグループのサイズと配置に対する高レベルな制御を提供します。

理解を深める
------

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

* `align-content`
* `align-items`
* `align-self`
* `flex`
* `flex-basis`
* `flex-direction`
* `flex-flow`
* `flex-grow`
* `flex-shrink`
* `flex-wrap`
* `justify-content`
* `order`
### 関連情報

* *CSS Flexible Box Layout Module Level 1 Specification*
* CSS フレックスボックスガイド: *フレックスボックスの基本概念*
* CSS フレックスボックスガイド: *フレックスボックスと他のレイアウト方法の関係*
* CSS フレックスボックスガイド: *フレックスコンテナー内のアイテムの配置*
* CSS フレックスボックスガイド: *フレックスアイテムの順序*
* CSS フレックスボックスガイド: *主軸方向のフレックスアイテムの比率の制御*
* CSS フレックスボックスガイド: *フレックスアイテムの折り返しのマスター*
* CSS フレックスボックスガイド: *フレックスボックスの典型的な用途*

1. MDN Web Docs 用語集
    1. 交差軸
    2. Flex
    3. フレックスコンテナー
    4. フレックスアイテム
    5. グリッド
2. 関連する CSS プロパティ
    1. `align-content`
    2. `align-items`
    3. `align-self`
    4. `flex`
    5. `flex-basis`
    6. `flex-direction`
    7. `flex-flow`
    8. `flex-grow`
    9. `flex-shrink`
    10. `flex-wrap`
    11. `justify-content`
    12. `order`


Protocol (プロトコル) - MDN Web Docs 用語集: ウェブ関連用語の定義

Protocol (プロトコル)
================

**プロトコル**は、コンピューター内またはコンピューター間でデータを交換する方法を定義したルールの体系です。機器間の通信では、交換されるデータの形式に機器が対応している必要があります。形式を定義する一連のルールがプロトコルと呼ばれています。

理解を深める
------

### 基礎知識

* ウィキペディアの通信プロトコルの記事
* RFC 公式インターネットプロトコル標準
関連情報
----

* TCP
* HTTP 概要
* Packet


Value (値) - MDN Web Docs 用語集: ウェブ関連用語の定義

Value (値)
=========

データ、またはデータ周りのオブジェクト **ラッパー** のコンテキストでは、値はオブジェクトラッパーに含まれる **プリミティブ値** です。 **変数** や **プロパティ** のコンテキストでは、値はプリミティブ、もしくは **オブジェクト参照** のいずれかになります。

詳細情報
----

### 基礎知識

* Wikipedia 上の記事「プリミティブラッパークラス」


Truthy (真値) - MDN Web Docs 用語集: ウェブ関連用語の定義

Truthy (真値)
===========

JavaScript において、**真値** (truthy) は論理値のコンテキストに現れた時に `true` とみなされる値のことです。偽値 (falsy) として定義された値 (つまり、`false`, `0`, `-0`, `0n`, `""`, `null`, `undefined`, `NaN`) を除くすべての値は真値です。

JavaScript は、論理値のコンテキストでは型変換を用います。

JavaScript で *truthy* な値の例です (論理値のコンテキストではこれらの値を `true` と評価し、`if` ブロックを実行します)。

```js
if (true)
if ({})
if ([])
if (42)
if ("0")
if ("false")
if (new Date())
if (-42)
if (12n)
if (3.14)
if (-3.14)
if (Infinity)
if (-Infinity)
```

関連情報
----

* 偽値
* 型変換
* Boolean


Quaternion (四元数) - MDN Web Docs 用語集: ウェブ関連用語の定義

Quaternion (四元数)
================

**四元数**は、2 つの 3D ベクトルの商であり、3D グラフィックや加速度計ベースのセンサーで、方位や回転のデータを表現するために使用されます。

数学的な四元数はこれよりも複雑ですが、例えば WebGL や WebXR を使用して回転を表現するための**単位四元数** (または**回転四元数**) は、3D ポイントと同じ構文を使用して表されます。そのため、`DOMPoint` (または `DOMPointReadOnly`) という型を使って四元数を格納します。

関連情報
----

* Quaternions and spatial rotation (Wikipedia, 英語)
* 四元数 (ウィキペディア)
* `XRRigidTransform.orientation` (WebXR Device API リファレンス)


Repo (リポジトリ) - MDN Web Docs 用語集: ウェブ関連用語の定義

Repo (リポジトリ)
============

Git、SVNのようなバージョン管理システムでは、リポジトリ(repo)とはアプリケーションのソースコードと、さまざまなメタデータが一緒にホスティングされる場所です。

関連項目
----

* Wikipedia のリポジトリ


Internationalization (i18n) （国際化対応） - MDN Web Docs 用語集: ウェブ関連用語の定義

Internationalization (i18n) （国際化対応）
===================================

**国際化対応** (Internationalization) は "i18n" と略されることもあり、さまざまな地域、言語、文化が異なるターゲットオーディエンスに簡単に適応できるようにシステムを設計することです。

システムを特定のターゲット層に適合させる補完的なプロセスをローカライズと呼びます。

特に国際化とは、国際的な文化や習慣に関する次のような違いに適応することです。

* 書記体系
* 測定単位（通貨、°C/°F, km/マイル、など）
* 日時フォーマット
* キーボードレイアウト

Unicode コンソーシアムの活動は、国際化の基本的な部分です。 Unicode は、世界の書記体系の多様性だけでなく、通貨や時間/日付フォーマットのような文化的な多様性にも対応しています。

関連情報
----

* 地域化
* Unicode コンソーシアム
* JavaScript 国際化対応 API


TCPハンドシェイク - MDN Web Docs 用語集: ウェブ関連用語の定義

TCPハンドシェイク
==========

TCP (トランスミッションコントロールプロトコル) (en-US)は、IP ネットワーク上の 2 台のコンピューター間でコネクション型通信を行うためのトランスポート層におけるホスト間プロトコルです。 TCP は、IP ネットワーク上で TCP/IP 接続を設定するために、**3 ウェイ・ハンドシェイク**(別名 TCP ハンドシェイク、3 メッセージハンドシェイク、および、もしくはまたは SYN-SYN-ACK)を使用します。TCP セッションをネゴシエートして TCP セッションを開始するために TCP によって送信される 3 つのメッセージは、それぞれ SYN、*SYN-ACK* **/ SYN**chronize のための ACK、**SYN**chronize-**ACK**nowledgement / **ACK**nowledge という愛称で呼ばれています。HTTP ブラウザーのリクエストなどのデータを送信する前に互いに情報を双方向に渡したい 2 台のコンピューターが、接続のパラメータをネゴシエートすることができるように、３つのメッセージの仕組みが設計されています。

ホスト（一般的にはブラウザー）は、TCP SYNchronize パケットをサーバーに送信します。サーバーは SYN を受信し、SYNchronize-ACKnowledgement を返送します。ホストはサーバーの SYN-ACK を受信し、ACKnowledge を送信します。サーバーは ACK を受信し、TCP ソケット接続が確立されます。

このハンドシェイクステップは、安全な接続を作成する際に、DNS ルックアップの後、およびTLS ハンドシェイクの前に実行されます。接続は 4 度目のハンドシェイクを通じて、接続の各終端で独立して終了させることができます。

関連情報
----

* トランスポート層セキュリティ(TLS)プロトコル
* HTTPS
* Wikipedia 上のトランスポート層セキュリティ


CSS pixel - MDN Web Docs 用語集: ウェブ関連用語の定義

CSS pixel
=========

**CSS Pixel** —CSS で接尾辞 `px` とともに示されます— は、人間の目で負担なく快適に見ることができるけれどなるべく小さい、1 ドットの高さや幅におおよそ一致する、長さの単位です。定義によれば、これは閲覧者の目から腕の長さまで離れた位置での、画素密度 96DPI の単一ピクセルの物理的サイズです。

その定義には、もちろん大きな揺らぎがあります。「快適に見ることができる」や「腕の長さ」などの不正確な用語は、人から人へと伝えるうちに変化してしまいます。例えば、あるユーザーがデスクトップの前にある机に着くとき、そのディスプレイは一般的に、例えば携帯電話に向かうときと比べて、ユーザーの目からかなり遠い位置にあります。

そのため、一般的には「単位 `px` を使うときに得られる値は、スクリーンの実際の画素密度に関係なく、スクリーンの 1 インチに `96px` とほとんど等しくなる距離です。」と言えば事足ります。あるいは、「もしユーザーが画素密度 266DPI の電話を持っていて、そのスクリーン上に幅 `96px` の要素がある場合、その実際の幅は 266 device pixels だろう。」とも言えます。

関連項目
----

### 技術リファレンス

* CSS Values and Units Module, section 5.2: Absolute Lengths
### これについて学習する

* CSS Length Explained on the MDN Hacks Blog


Site map (サイトマップ) - MDN Web Docs 用語集: ウェブ関連用語の定義

Site map (サイトマップ)
=================

**サイトマップ**は、ウェブサイトのページの一覧です。サイトのページの構造化された一覧は、検索エンジンの最適化に役立ち、検索エンジンなどのウェブクローラーが辿るためのリンクを提供します。また、サイトマップは、サイトのコンテンツの概要を一目で確認できるため、ユーザーのサイトナビゲーションにも役立ちます。


IIFE (即時実行関数式) - MDN Web Docs 用語集: ウェブ関連用語の定義

IIFE (即時実行関数式)
==============

**IIFE** (Immediately Invoked Function Expression; 即時実行関数式) は定義されるとすぐに実行される JavaScript の関数です。

IIFE という名前は Ben Alman のブログで付けられました。

```js
(function () {
  // …
})();

(() => {
  // …
})();

(async () => {
  // …
})();
```

このデザインパターンは自己実行無名関数とも呼ばれ、主に次の 2 つを含みます。

1. 最初の部分は `グループ化演算子` `()` に囲まれた静的スコープ付きの無名関数です。これは IIFE イディオム内で、汚いグローバルスコープと同様に変数へアクセスすることを防ぎます。
2. 2 つ目の部分は即時実行関数式の `()` で、これを通じて JavaScript エンジンは直接関数を解釈実行します。
使用例
---

### グローバル名前空間の汚染を避ける

 別々のファイルからたくさんの関数やグローバル変数がアプリケーションに含まれるため、グローバル変数の数を制限することが重要です。
 もし再利用する必要のない初期化コードがあるなら、1 つの関数宣言や関数式よりも IIFE を使ったほうが良いです。

```js
(() => {
  // 初期化の処理
  let firstVariable;
  let secondVariable;
})();

// firstVariable と secondVariable は関数が実行されたら破棄されます。
```

### 非同期関数の実行

`async` IIFE は top-level await が無い古いブラウザーや JavaScript のランタイムでも `await` と `for-await` を使えるようにします。

```js
const getFileStream = async (url) => {
  // 実装
};

(async () => {
  const stream = await getFileStream("https://domain.name/path/file.ext");
  for await (const chunk of stream) {
    console.log({ chunk });
  }
})();
```

### モジュールパターン

IIFE はプライベート変数やパブリック変数、メソッドを作るためにも使えます。もっと洗練されたモジュールパターンや IIFE を知りたいなら、 Addy Osmani による本 Learning JavaScript Design Patterns を読むと良いでしょう。

```js
const makeWithdraw = (balance) =>
  ((copyBalance) => {
    let balance = copyBalance; // この変数はプライベートです
    const doBadThings = () => {
      console.log("I will do bad things with your money");
    };
    doBadThings();
    return {
      withdraw(amount) {
        if (balance >= amount) {
          balance -= amount;
          return balance;
        }
        return "Insufficient money";
      },
    };
  })(balance);

const firstAccount = makeWithdraw(100); // "I will do bad things with your money"
console.log(firstAccount.balance); // undefined
console.log(firstAccount.withdraw(20)); // 80
console.log(firstAccount.withdraw(30)); // 50
console.log(firstAccount.doBadThings); // undefined; このメソッドはプライベートです
const secondAccount = makeWithdraw(20); // "I will do bad things with your money"
console.log(secondAccount.withdraw(30)); // "Insufficient money"
console.log(secondAccount.withdraw(20)); // 0
```

### ES6 以前の var を使ったループ

 ブロックスコープや **ES6** での **let** や **const** の導入前の古いコードで、次のような IIFE の使い方を見ることができます。
 **var** では、関数のスコープとグローバルなスコープしかありませんでした。
 「ボタン 0」「ボタン 1」という 2 つのボタンをクリックした時に、それぞれ「0」「1」が表示されるようにしてみます。以下のコードではうまく動きません:

```js
for (var i = 0; i < 2; i++) {
  const button = document.createElement("button");
  button.innerText = `ボタン ${i}`;
  button.onclick = function () {
    console.log(i);
  };
  document.body.appendChild(button);
}
console.log(i); // 2
```

 クリックすると、「ボタン 0」「ボタン 1」の両方で 2 が表示されます。
 これは変数 `i` がグローバルであり、最後に代入された値が 2 であるためです。

ES6 以前にこの問題を解決する時は、 IIFE パターンを使っていました:

```js
for (var i = 0; i < 2; i++) {
  const button = document.createElement("button");
  button.innerText = `ボタン ${i}`;
  button.onclick = (function (copyOfI) {
    return () => {
      console.log(copyOfI);
    };
  })(i);
  document.body.appendChild(button);
}
console.log(i); // 2
```

 クリックすると、「ボタン 0」なら 0 が、「ボタン 1」なら 1 が表示されます。
 上記のコードでも、変数 `i` はグローバルに定義されています。
 **let** を使うともっと簡単に書けます:

```js
for (let i = 0; i < 2; i++) {
  const button = document.createElement("button");
  button.innerText = `ボタン ${i}`;
  button.onclick = function () {
    console.log(i);
  };
  document.body.appendChild(button);
}
console.log(i); // Uncaught ReferenceError: i is not defined.
```

クリックすると、「ボタン 0」なら 0 が、「ボタン 1」なら 1 が表示されます。

関連情報
----

* IIFE (Wikipedia)
* Glossary
    + 関数
    + 自己実行無名関数


Document directive (文書ディレクティブ) - MDN Web Docs 用語集: ウェブ関連用語の定義

Document directive (文書ディレクティブ)
==============================

**CSP の文書ディレクティブ**は `Content-Security-Policy` ヘッダーで使用され、ポリシーが適用される文書またはワーカー環境のプロパティを管理します。

文書ディレクティブは `default-src` ディレクティブで代替されることはありません。

完全な一覧は文書ディレクティブを参照してください。

関連情報
----

* 用語集
    + CSP
    + 報告ディレクティブ
    + フェッチディレクティブ
    + ナビゲーションディレクティブ
* リファレンス
    + https://www.w3.org/TR/CSP/#directives-document
    + `upgrade-insecure-requests`
    + `block-all-mixed-content`
    + `require-sri-for`
    非推奨
    + `Content-Security-Policy`


Garbage collection (ガベージコレクション) - MDN Web Docs 用語集: ウェブ関連用語の定義

Garbage collection (ガベージコレクション)
===============================

**ガベージコレクション**とは、コンピュータプログラミングで用いられる用語で、オブジェクトが、他のオブジェクトによって参照されなくなったものを見つけて削除する処理を記述します。

言い換えれば、ガベージコレクションは、他のオブジェクトによって使用されていないオブジェクトを削除するプロセスです。 "GC" と省略されることが多いが、ガベージコレクションは、JavaScript で使用されるメモリー管理システムの基本的なコンポーネントです。

関連情報
----

* メモリー管理 (Wikipedia)
* ガベージコレクション (Wikipedia)
* ガベージコレクション (MDN の JavaScript ガイド)
* JavaScript でのメモリー管理


Self-Executing Anonymous Function (自己実行無名関数) - MDN Web Docs 用語集: ウェブ関連用語の定義

Self-Executing Anonymous Function (自己実行無名関数)
============================================

定義されるときに、すぐに実行される JavaScript の関数です。IIFE (即時実行関数式) と呼ばれることもあります。

詳細は、上記でリンクしている IIFE の用語集のページを参照してください。


SVG - MDN Web Docs 用語集: ウェブ関連用語の定義

SVG
===

*Scalable Vector Graphics* (**SVG**) は XML の文法に基づいた 2 次元ベクター画像フォーマットです。

W3C は、1990 年代後半に SVG に取り組み始めましたが、 SVG は Internet Explorer 9 が対応したときにはじめて有名になりました。主要なウェブブラウザーはすべて SVG に対応するようになりました。

SVG は XML の文法に基づいており、CSS によるスタイルの設定と、 JavaScript を用いたインタラクティブ化が可能です。HTML5 では HTML ドキュメントに SVG タグを直接埋め込むことができるようになりました。

SVG 画像は、ベクター画像形式であるため無制限に拡大することができ、画面のサイズに応じてインターフェース要素やグラフィックを作成できるため、レスポンシブデザインにおいても有用です。SVG にはクリッピング、マスキング、フィルター、アニメーションなどの便利なツールも用意されています。

詳細情報
----

### 基礎知識

* Wikipedia 上の SVG
### SVG を学ぶ

* W3.org の SVG 入門（英語）
### 技術情報

* MDN の SVG ドキュメント
* 最新の SVG の仕様 (英語)


Main thread (メインスレッド) - MDN Web Docs 用語集: ウェブ関連用語の定義

Main thread (メインスレッド)
=====================

**メインスレッド**は、ブラウザーがユーザーのイベントや描画を処理するところです。既定では、ブラウザーは単一のスレッドを使用してページ内のすべての JavaScript を、レイアウト、再フロー、ガベージコレクションなどと同様に実行します。つまり、実行に時間がかかる JavaScript 関数がスレッドをブロックし、ページが反応しなくなり、使い勝手が悪くなります。

意識的に Service worker などの Web worker を使用しない限り、 JavaScript はメインスレッド上で実行されるので、イベント処理や描画の中で簡単にスクリプトが遅延を発生させます。メインスレッドで動作させる必要がある処理が少ないほど、メインスレッドがユーザーのイベントに応答したり、描画したりすることが増え、ユーザーへの反応が全般的に良くなります。

1. 関連情報
    1. 非同期 JavaScript
    2. Web worker API
    3. Service worker API
2. 用語集
    1. スレッド


プロトタイプベース - MDN Web Docs 用語集: ウェブ関連用語の定義

プロトタイプベース
=========

**プロトタイプベース**は、オブジェクト指向プログラミングのひとつで、クラスを明示的に定義するのではなく、別のクラスのインスタンスや、あまり見かけませんが、空のオブジェクトにプロパティやメソッドを追加するという手法をとっています。

簡単に言えば、この手法はクラスをはじめに定義することなしにオブジェクトを生成することを可能にします。

詳細情報
----

### 一般知識

* Wikipedia のプロトタイプベースの記事


SMPTE (Society of Motion Picture and Television Engineers) - MDN Web Docs 用語集: ウェブ関連用語の定義

SMPTE (Society of Motion Picture and Television Engineers)
==========================================================

**Society of Motion Picture and Television Engineers** (**SMPTE**) は、エンターテインメントメディアの作成、放送、保存、および表示に使用される標準と技術を開発および定義するエンジニアと科学者の専門家協会です。 例えば、 SMPTE は、現代のデジタル映画館で使用されているデジタルシネマに使用されている規格を定義しています。


Web server (ウェブサーバー) - MDN Web Docs 用語集: ウェブ関連用語の定義

Web server (ウェブサーバー)
====================

ウェブサーバーは、ユーザーにサービスを提供するハードウェアサーバー上で動作するソフトウェアのことで、通常はクライアントから参照されます。一方、サーバーは、一般的にデータセンターと呼ばれるコンピューターであふれた部屋にあるハードウェアの一部です。

* サーバーの紹介
* Wikipedia の サーバ


Recursion (再帰) - MDN Web Docs 用語集: ウェブ関連用語の定義

Recursion (再帰)
==============

関数が自分自身を呼び出す動作、再帰は問題がより小さな小問題から成っている場合に解決するのに使われます。再帰関数は、ベースケース (再帰終了) と再帰ケース (再帰再開) の 2 種類の入力を受け取る可能性があります。

例
-

### 条件が揃うまで再帰関数が自分自身を呼び出す

次の Python コードは、数値を受け取り、それを表示し、数値の値 -1 を指定して再度呼び出す関数を定義しています。 数値が 0 になるまで続け、0 になると停止します。
```

def recurse(x):
   if x > 0:
       print(x)
       recurse(x - 1)

recurse(10)
```

出力は次のようになります。

 10
 9
 8
 7
 6
 5
 4
 3
 2
 1
 0

関連項目
----

### 一般知識

* Wikipedia の 再帰
* JavaScript での再帰についての詳細


Browsing context (閲覧コンテキスト) - MDN Web Docs 用語集: ウェブ関連用語の定義

Browsing context (閲覧コンテキスト)
===========================

**閲覧コンテキスト**は、ブラウザー が `Document` (今日では通常タブであり、場合によってはウィンドウまたはページ内のフレーム) を表示する環境です。

各閲覧コンテキストは、固有のオリジン、すなわちアクティブな文書の生成元と、すべての表示された文書を順番に記録した履歴を持っています。

閲覧コンテキスト間の通信は、厳しく制限されています。同じ生成元の閲覧コンテキストとの間で、 `BroadcastChannel` を開放して使用することができます。

理解を深める
------

### 技術リファレンス

* WHATWG の閲覧コンテキスト
* W3C の閲覧コンテキスト


Simple header (単純ヘッダー) - MDN Web Docs 用語集: ウェブ関連用語の定義

Simple header (単純ヘッダー)
======================

CORS セーフリストリクエストヘッダー の古い用語です。


Request header (リクエストヘッダー) - MDN Web Docs 用語集: ウェブ関連用語の定義

Request header (リクエストヘッダー)
==========================

**リクエストヘッダー**は、 HTTP リクエストで使用される HTTP ヘッダーであり、メッセージの内容には関連しないものです。 `Accept`, `Accept-*`, `If-*` などのリクエストヘッダーは、条件付きリクエストを行うことができます。他の `Cookie`, `User-Agent`, `Referer` などはサーバーが回答を作成するための文脈を明確にします。

リクエストに現れるすべてのヘッダーが*リクエストヘッダー*であるとは限りません。例えば、 `POST` リクエストの中に現れる `Content-Length` は、実際にはリクエストメッセージの本文の長さを表すエンティティヘッダーです。しかし、これらのエンティティヘッダーもそのような場面ではリクエストヘッダーと呼ばれることがよくあります。

加えて、 CORS では、常に認証が考慮され、プリフライトリクエストへのレスポンスで明確に列挙されないリクエストヘッダーの一部を単純ヘッダーとして定義しています。

`GET` リクエストに続くリクエストヘッダーをいくつか示します。
```

GET /home.html HTTP/1.1
Host: developer.mozilla.org
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.9; rv:50.0) Gecko/20100101 Firefox/50.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate, br
Referer: https://developer.mozilla.org/testpage.html
Connection: keep-alive
Upgrade-Insecure-Requests: 1
If-Modified-Since: Mon, 18 Jul 2016 02:36:04 GMT
If-None-Match: "c561c68d0ba92bbeb8b0fff2a9199f722e3a621a"
Cache-Control: max-age=0
```

正確に言えば、この例の中にある `Content-Length` ヘッダーは他のようなリクエストヘッダーではなく、エンティティヘッダーです。
```

POST /myform.html HTTP/1.1
Host: developer.mozilla.org
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.9; rv:50.0) Gecko/20100101 Firefox/50.0
Content-Length: 128
```

詳細情報
----

### 技術リファレンス

* すべての HTTP ヘッダーの一覧


Effective connection type (有効接続種別) - MDN Web Docs 用語集: ウェブ関連用語の定義

Effective connection type (有効接続種別)
==================================

**有効接続種別** (ECT) とは、測定されたネットワーク性能のことで、実際の接続がテザリングされたブロードバンドや WiFi であっても、ブラウザーのページのリクエストの時間とと有効接続種別に基づいて、 3G などの携帯通信接続種別を返します。

観測されたラウンドトリップと下り接続速度の値を使用して、 '`slow-2g`', '`2g`', '`3g`', '`4g`' の値が特定されます。

| ECT | 最小 RTT | 最大下り接続 | 説明 |
| --- | --- | --- | --- |
| `slow-2g` | 2000ms | 50 Kbps | テキストのみのページなど、少量の転送のみに適したネットワークです。 |
| `2g` | 1400ms | 70 Kbps | このネットワークは小さな画像の転送に向いています。 |
| `3g` | 270ms | 700 Kbps | 高解像度の画像や音声、標準画質ビデオなどの大容量の資産の転送に適しています。 |
| `4g` | 0ms | ∞ | ネットワークは HD ビデオ、リアルタイムビデオなどに適しています。 |

effectiveType は Network Information API のプロパティであり、 JavaScript には navigator.connection オブジェクトから公開されています。有効接続種別を確認するには、対応しているブラウザーで開発者ツールのコンソールを開き、次のように入力してください。

```js
navigator.connection.effectiveType;
```

関連情報
----

* Network Information API
* `NetworkInformation`
* `NetworkInformation.effectiveType`


Variable (変数) - MDN Web Docs 用語集: ウェブ関連用語の定義

Variable (変数)
=============

変数は、値を格納するための名前付けされた場所です。これにより、あらかじめ決めておいた名前を使って、予測できない値にアクセスできます。

関連情報
----

* 変数\_(プログラミング) (Wikipedia)
* JavaScript の変数宣言
* JavaScript の `var` 文


buffer (バッファー) - MDN Web Docs 用語集: ウェブ関連用語の定義

buffer (バッファー)
==============

バッファーは、データをある場所から別の場所へ移動させるときに、それを一時的に保存するために使われる物理メモリー内のストレージです。

詳細情報
----

### 一般知識

* Wikipedia のバッファ


Event (イベント) - MDN Web Docs 用語集: ウェブ関連用語の定義

Event (イベント)
============

Events は DOM 要素によって生成される資産であり、Javascript コードから操作できます。

関連項目
----

### 技術リファレンス

* MDN の Event 文書
### 一般知識

* Official website
* Wikipedia の DOM events


undefined - MDN Web Docs 用語集: ウェブ関連用語の定義

undefined
=========

`undefined`は、宣言のみが行われた変数、あるいは実引数が存在しない仮引数に自動的に割り当てられるプリミティブ値のことです。

例
-

```js
var x; //値を代入しない変数

console.log("x's value is", x); //ログ："x's value is undefined"
```

関連情報
----

### 一般知識

* Wikipedia 上の記事「Undefined value（英語）」
### 技術リファレンス

* JavaScript のデータ型とデータ構造


Navigation directive (ナビゲーションディレクティブ) - MDN Web Docs 用語集: ウェブ関連用語の定義

Navigation directive (ナビゲーションディレクティブ)
=====================================

**CSP のナビゲーションディレクティブ**は `Content-Security-Policy` ヘッダーで使用され、たとえば、ユーザーがどの場所に移動したり、フォームを送信したりすることができるかを管理します。

ナビゲーションディレクティブは `default-src` ディレクティブで代替されません。

完全な一覧はナビゲーションディレクティブを参照してください。

関連項目
----

* https://www.w3.org/TR/CSP/#directives-navigation
* 他の種類のディレクティブ:
    + フェッチディレクティブ
    + 文書ディレクティブ
    + 報告ディレクティブ
    + `block-all-mixed-content`
    + `upgrade-insecure-requests`
    + `require-sri-for`
    + `trusted-types`
* `Content-Security-Policy`

1. 用語集
    1. CSP
    2. フェッチディレクティブ
    3. 文書ディレクティブ
    4. 報告ディレクティブ


IDE (統合開発環境) - MDN Web Docs 用語集: ウェブ関連用語の定義

IDE (統合開発環境)
============

統合開発環境（Integrated Development Environment、**IDE**）または、対話型開発環境（Interactive Development environment）は、ソフトウェア開発のためにコンピュータープログラマーに包括的な機能を提供するソフトウェアアプリケーションです。 IDE は、通常、ソースコードエディター、ビルド自動化ツール、デバッガーで構成されています。

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

### 一般知識

* Wikipedia 上の 統合開発環境


Shadow tree - MDN Web Docs 用語集: ウェブ関連用語の定義

Shadow tree
===========

**Shadow ツリー** は DOM nodes のツリーで、最上位のノードは **Shadow ルート** ( **Shadow DOM** 内にある最上位のノード) です。Shadow ツリーは標準的な DOM から隠されたツリーで、標準的な DOM ノードがホストになります。 隠されたノードは通常の DOM の機能では直接確認できませんが、特殊な Shadow DOM API を使うとアクセスすることができます。

Shadow ツリー内のノードは Shadow ツリーの外部の影響を一切受けません。逆に Shadow ツリーの外部は Shadow ツリー内の影響を一切受けません。これにより細かい実装をカプセル化することができ、特に custom elements や他の先進的なデザインパラダイムの実装に便利です。

関連項目
----

### 一般知識

* Using shadow DOM
### 技術情報

* `Element.shadowRoot` と `Element.attachShadow()`
* `ShadowRoot`
* `<slot>`


Crawler (クローラー) - MDN Web Docs 用語集: ウェブ関連用語の定義

Crawler (クローラー)
===============

ウェブクローラーは、よく bot や robot と呼ばれ、ウェブページからデータを収集するために自動的にウェブを閲覧するものです。一般的に、 (Google や Bing などの) 検索エンジンは、クローラーを用いてインデックスを構築します。

理解を深める
------

* Wikipedia の クローラ

1. MDN Web Docs 用語集
    1. 検索エンジン


IANA - MDN Web Docs 用語集: ウェブ関連用語の定義

IANA
====

**IANA** (Internet Assigned Numbers Authority) は、インターネットプロトコルで使用されるドメイン名、IP アドレス、その他の名前と番号の記録および/または割り当てを担当する ICANN の下部組織です。

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

### 一般知識

* 公式ウェブサイト
* Wikipedia 上の IANA


Google Chrome - MDN Web Docs 用語集: ウェブ関連用語の定義

Google Chrome
=============

Google Chrome は Google が開発した無償のブラウザーです。オープンソースプロジェクトである Chromium がベースとなっています。重要な違いについては Chromium wiki で説明されています。 Chrome は独自のレイアウトエンジンである Blink に対応しています。なお、 iOS 版の Chrome は Blink ではなくプラットフォームの WebView を使用しています。

Learn more
----------

### General knowledge

* Wikipedia 上の Google Chrome 記事
### Chrome の利用者へ

日常的に Chrome を利用している方は、いずれかを選んでください。

* Android 版
* iOS 版
* デスクトップ版
### Web 開発者へ

もし Chrome の最新機能が必要な場合は安定版より先にリリースされるものをインストールしてください。 Google は頻繁にアップデートをし、安定版とは別に動作するよう設計しています。最新情報については Chrome Release Blog でご確認ください。

* Android 版 Chrome Dev
* デスクトップ版 Chrome Canary


First Meaningful Paint - MDN Web Docs 用語集: ウェブ関連用語の定義

First Meaningful Paint
======================

**First Meaningful Paint** (FMP) は、スクロールせずに見える最大のレイアウト変更が行われ、ウェブフォントが読み込まれた後のペイントです。 "お役に立ちましたか?" 最初に意味のあるペイントが完了すると "はい" になります。

関連項目
----

* First contentful paint


Forbidden response header name (禁止レスンポンスヘッダー名) - MDN Web Docs 用語集: ウェブ関連用語の定義

Forbidden response header name (禁止レスンポンスヘッダー名)
==============================================

禁止レスポンスヘッダー名は、プログラムから変更することができない HTTP ヘッダーの名前 (`Set-Cookie`) です。

関連情報
----

* Fetch specification: forbidden response-header name
* 禁止ヘッダー名 （用語集）


Static method (静的メソッド) - MDN Web Docs 用語集: ウェブ関連用語の定義

Static method (静的メソッド)
======================

静的メソッド (または *静的関数*) とは、メソッドのうちオブジェクトのメンバーとして定義されているものの、コンストラクターで生成されたオブジェクトインスタンスからではなく、API のオブジェクトコンストラクターから直接アクセスできるものです。

Web API では、静的メソッドはインターフェイスで定義されているものの、先にその型のオブジェクトのインスタンス化をせずに呼び出すことができます。

オブジェクトインスタンスに対して呼び出されるメソッドは、*インスタンスメソッド*と呼ばれます。

例
-

Notifications API では、`Notification.requestPermission()` メソッドは実際は `Notification` コンストラクター自身に対して呼び出されます。— これが静的メソッドです。

```js
let promise = Notification.requestPermission();
```

一方で、`Notification.close()` メソッドはインスタンスメソッドです。— これは特定の通知オブジェクトインスタンスに対して呼び出され、これが表現するシステム通知を閉じます。

```js
let myNotification = new Notification("This is my notification");

myNotification.close();
```

1. 一般知識
    1. Techopedia の Static Method
2. JavaScript リファレンス
    1. static
3. MDN Web Docs 用語集
    1. オブジェクト
    2. メソッド


RGB - MDN Web Docs 用語集: ウェブ関連用語の定義

RGB
===

RGB は、赤、緑、青という 3 つの基本要素（またはチャネル）を混ぜ合わせることで表現されるカラーモデルです。各色は、最終的な色を決定する際、赤、緑、青それぞれの強度を示す 3 つの数字のシーケンス (通常は 0.0〜1.0、または 0〜255) で表されます。

There are many ways to describe the RGB components of a color. In CSS they can be represented as a single 24-bit integer in hexadecimal notation (for example, `#add8e6` is light blue), or in functional notation as three separate 8-bit integers (for example, rgb(46, 139, 87) is sea green). In OpenGL, WebGL, and GLSL the red-green-blue components are fractions (floating-point numbers between 0.0 and 1.0), although in the actual color buffer they are typically stored as 8-bit integers. Graphically, a color can be represented as a point in a three-dimensional grid or cube, where each dimension (or axis) corresponds to a different channel.

Learn more
----------

### General knowledge

* RGB color model on Wikipedia
### Learn about it

* CSS data type: <color>


STUN - MDN Web Docs 用語集: ウェブ関連用語の定義

STUN
====

**STUN** (Session Traversal Utilities for NAT) は、NAT (Network Address Translator) を介してデータを転送する際の補助プロトコルです。STUNは、NATの内側にあるコンピュータの IP アドレス、ポート、接続状態を返します。

参考情報
----

* STUN (ウィキペディア)
* WebRTC プロトコル
### 技術リファレンス

* 仕様


RTL (右書き) - MDN Web Docs 用語集: ウェブ関連用語の定義

RTL (右書き)
=========

**RTL** (**Right To Left**, 右書き) は、テキストが右から左へ書かれることを示す locale プロパティです。例えば、`he` ロケール (ヘブライ語) は右書きを定義します。アラビア語 (`ar`) も右書きで書かれる有名な言語です。

RTL とは対照的に、LTR (Left To Right, 左書き) は、英語 (`en`, `en-US`, `en-GB`, など)、スペイン語 (`es`)、フランス語 (`fr`) などの他の言語で使用されます。

* MDN Web Docs 用語集
    + Localization
    + LTR (左書き)
    + RTL (右書き)


Global variable (グローバル変数) - MDN Web Docs 用語集: ウェブ関連用語の定義

Global variable (グローバル変数)
=========================

グローバル変数はグローバルスコープで宣言された変数です。言い換えると、他のすべてのスコープから参照可能な変数です。

JavaScript では、グローバル変数はグローバルオブジェクトのプロパティです。

関連項目
----

### 一般知識

* Wikipedia の グローバル変数


Middleware (ミドルウェア) - MDN Web Docs 用語集: ウェブ関連用語の定義

Middleware (ミドルウェア)
===================

ミドルウェアとは、システムの各部分がデータを通信および管理できるようにする、あらゆるソフトウェアまたはサービスの（定義があやふやな）用語です。コンポーネントと入出力間の通信を処理するソフトウェアであるため、開発者はアプリケーションの特定の目的に集中できます。

サーバー側のウェブアプリケーションのフレームワークでは、この用語は、データベースアクセスなどのタスクを処理するために、フレームワークのリクエスト/レスポンス処理パイプラインに追加できる既成のソフトウェアコンポーネントを指すのに使用されることがよくあります。

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

### 一般知識

* Wikipedia 上の ミドルウェア（分散アプリケーション）（英語）
* Wikipedia 上の メッセージ指向ミドルウェア
* Wikipedia 上の ミドルウェア


Scope (スコープ) - MDN Web Docs 用語集: ウェブ関連用語の定義

Scope (スコープ)
============

実行の現在のコンテキスト。値 と**式**が「見える」、または参照できる文脈。\*\*変数\*\*や他の式が "現在のスコープ内にない" 場合、使用できません。スコープを階層構造で階層化して、子スコープから親スコープにアクセスできるようにすることもできますが、その逆はできません。

**関数**は JavaScript の**クロージャ**として機能し、すなわちスコープを作成して、 (例えば) 関数内で排他的に定義された変数に、関数の外側からや他の関数の中からアクセスできないようになります。たとえば、以下は無効です。

```js
function exampleFunction() {
  var x = "declared inside function"; // x can only be used in exampleFunction
  console.log("Inside function");
  console.log(x);
}

console.log(x); // Causes error
```

ただし、次のコードでは変数が関数外で宣言されており、グローバルになるため、有効になります。

```js
var x = "declared outside function";

exampleFunction();

function exampleFunction() {
  console.log("Inside function");
  console.log(x);
}

console.log("Outside function");
console.log(x);
```

詳細情報
----

### 一般知識

* Wikipedia の スコープ


Challenge-response authentication (チャレンジレスポンス認証) - MDN Web Docs 用語集: ウェブ関連用語の定義

Challenge-response authentication (チャレンジレスポンス認証)
================================================

セキュリティプロトコルでは、チャレンジは、毎回異なるレスポンス（応答）を生成するために、サーバーによってクライアントに送信されるデータです。 チャレンジレスポンスプロトコルは、攻撃者が元のメッセージを聞いて、後でそれ再送信して元のメッセージと同じ資格情報を取得する反射攻撃に対抗する 1 つの方法です。

HTTP 認証プロトコルはチャレンジレスポンスがベースですが、"Basic" プロトコルは実際のチャレンジを使用していません（レルムは常に同じです）。

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

* Wikipedia 上の Challenge-response authentication （英語）


Idempotent (べき等) - MDN Web Docs 用語集: ウェブ関連用語の定義

Idempotent (べき等)
================

ある HTTP メソッドが**べき等**であるとは、サーバーが同じ状況にあるとき、特定のリクエストに対して何回でも続けて同じ効果が起こることをいいます。このことは、べき等なメソッドでは (統計を取る際のことを除いて) 副作用が生じるはずではないと言うこともできます 。 適切に実装された `GET`、`HEAD`、`PUT`、`DELETE` の各メソッドは**べき等**ですが、`POST` メソッドはそうではありません。安全なメソッドはすべてべき等です。

べき等であるためには、サーバーにおける裏側の実際の状態だけが考慮されるので、返される状態コードはリクエストごとに異なる場合があります。 例えば、最初に `DELETE` メソッドが呼び出された場合は、おそらく `200` を返しますが、それ以降は `404` を返すでしょう。RESTful な API の設計において、*最後の入力操作を削除する*機能を `DELETE` メソッドを使って実装すべきでないとされるのも、`DELETE` メソッドがべき等であることを示唆しています。

なお、メソッドがべき等であっても、サーバーやアプリケーションによってべき等性の破壊が生じることがあります。

例えば、 `GET /pageX HTTP/1.1` はべき等です。連続して何度か呼び出しても、クライアントは同じ結果を得ます。
```

GET /pageX HTTP/1.1
GET /pageX HTTP/1.1
GET /pageX HTTP/1.1
GET /pageX HTTP/1.1
```

`POST /add_row HTTP/1.1` はべき等ではありません。 何度か呼び出すと、その回数だけ列に追加されていきます。
```

POST /add_row HTTP/1.1
POST /add_row HTTP/1.1   -> Adds a 2nd row
POST /add_row HTTP/1.1   -> Adds a 3rd row
```

`DELETE /idX/delete HTTP/1.1` はべき等ですが、状態コードは数回のリクエストの間に変化することがあります。
```

DELETE /idX/delete HTTP/1.1   -> idX が存在する場合は 200 を返却
DELETE /idX/delete HTTP/1.1   -> ちょうど削除されたので 404 を返却
DELETE /idX/delete HTTP/1.1   -> 404 を返却
```

関連情報
----

* HTTP 規格におけるべき等の定義
* べき等なメソッド: `GET`, `HEAD`, `PUT`, `DELETE`, `OPTIONS`, `TRACE`
* べき等でないメソッド: `POST`,`PATCH`, `CONNECT`


Screen reader (スクリーンリーダー) - MDN Web Docs 用語集: ウェブ関連用語の定義

Screen reader (スクリーンリーダー)
=========================

スクリーンリーダーは、画面に表示された内容を視覚以外の方法で伝えるソフトウェアアプリケーションのことです。通常はテキストを音声に変換しますが、点字や音声アイコンに変換することもあります。スクリーンリーダーは、目の不自由な方には欠かせませんし、視覚障碍者や読み書きのできない方、学習障碍のある方にも役立ちます。ブラウザーの拡張機能を利用したスクリーンリーダーもありますが、ほとんどのスクリーンリーダーは、ブラウザーだけでなく、すべてのユーザーのアプリケーションに対してシステム全体で動作します。

ウェブアクセシビリティに関しては、ほとんどのユーザーエージェントがアクセシビリティオブジェクトモデルを提供し、スクリーンリーダーは、さまざまなオペレーティングシステムの機能を使用し、フック技術を使用して専用のアクセシビリティ API と対話します。

VoiceOver
---------

macOS には、内蔵のスクリーンリーダーである VoiceOver が搭載されています。VoiceOver にアクセスするには、システム環境設定 > アクセシビリティ > VoiceOver を選択します。また、fn + コマンド + F5 で VoiceOver のオンオフを切り替えることもできます。VoiceOver は音読とコンテンツの表示の両方を行います。読み上げられた内容は、濃い灰色のボックスに表示されます。

デスクトップ/ノートのスクリーンリーダーのユーザーは、キーボードまたはその他のポインティングデバイスではないものを使用してウェブサイトを操作します。使用をエミュレートする最良の方法は、同じことを行うことです。

VoiceOver を使用しないキーボードナビゲーションと同様に、Tab キーと矢印キーを使用してインタラクティブな要素を操作することができます。

* 次のインタラクティブ要素: Tab
* 前のインタラクティブ要素: Shift + Tab
* 同じ名前のグループ内の次のラジオボタン: 右または下矢印
* 同じ名前のグループ内の前のラジオボタン: 左または上矢印

ページのコンテンツを移動するには、Tab キーとその他の一連のキー、および Control + Option キーを使用します。

* 次の見出し: Control + Option + H
* 次のリスト: Control + Option + X
* 次の図: 次の図：Control + Option + G
* 次のテーブル: Control + Option + T
* HTML の階層を下がる: Control + Option + 右矢印
* 前の見出し: Shift + Control + Option + H
* 前のリスト: Shift + Control + Option + X
* 前の図: Shift + Control + Option + G
* 前のテーブル: Shift + Control + Option + T
* HTML の階層を上がる: Control + Option + 左矢印
関連情報
----

* ARIA


XQuery - MDN Web Docs 用語集: ウェブ関連用語の定義

XQuery
======

**XQuery** は XML データベースでデータを更新、検索、計算するためのコンピューター言語です。

より詳しく学ぶ
-------

### 一般知識

* 公式ウェブサイト
* Wikipedia の XQuery


HMAC - MDN Web Docs 用語集: ウェブ関連用語の定義

HMAC
====

HMAC は、暗号的にメッセージを認証するために使用されるプロトコルです。 どのような種類の暗号化関数も使用でき、その強さは基礎となる関数（たとえば SHA1 または MD5）と選択された秘密鍵に依存します。このような組み合わせでは、HMAC-SHA1 などの複合名で HMAC 検証アルゴリズムが認識されます。

HMAC は、完全性と認証の両方を保証するために使用されます。

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

### 一般知識

* Wikipedia 上の HMAC
### 技術文書

* IETF の RFC 2104 （英語）


Gecko - MDN Web Docs 用語集: ウェブ関連用語の定義

Gecko
=====

**Gecko** は Mozilla プロジェクトによって開発された レイアウトエンジンであり、Firefox や Firefox OS を含む多くのアプリ / デバイスで使用されています。

ウェブブラウザーは HTML、CSS、Javascript、埋め込みコンテンツ（画像など）を解釈して画面に表示するためのレイアウトエンジンと呼ばれるソフトウェアが必要です。また Gecko はサポート対象のすべての OS 上で API と適切に連携し、また適切な API が関連するサポート対象にのみ公開されるようにも動作します。そのため Gecko はネットワークスタック、グラフィックススタック、レイアウトエンジン、JavaScript 仮想マシン、移植レイヤーといった機能などを併せ持っています。

Firefox OS の場合、アプリケーションはすべてウェブアプリケーションなので、Firefox OS は Gecko をアプリケーションランタイムとしても使用しています。

詳細情報
----

### 一般知識

* Wikipedia 上の記事： Gecko


Representation header (表現ヘッダー) - MDN Web Docs 用語集: ウェブ関連用語の定義

Representation header (表現ヘッダー)
==============================

**表現ヘッダー** (representation header) は HTTP ヘッダーのうち、 HTTP メッセージの本文で送られる特定の*表現*を説明するものです。

 表現とは、特定のリソースをさまざまな形で表現したものです。
 例えば、同じデータが XML や JSON などの特定のメディア種別の形式に変換されたり、特定の記述言語や地理的地域にローカライズされたり、伝送用に圧縮またはその他の方法で符号化されたりする可能性があります。
 基本的なリソースはそれぞれの場合で同じですが、その表現は異なります。

クライアントはコンテンツネゴシエーションの際に（`Accept-*` ヘッダーを用いて）送るべき形式を指定し、表現ヘッダーは実際に受信される*選択された表現*の形式をクライアントに伝えます。

 表現ヘッダーは HTTP リクエストおよびレスポンスの両方のメッセージに存在する可能性があります。
 `HEAD` リクエストに対するレスポンスとして送られる場合、リソースが実際にリクエストされたときに選択される本文の内容を説明します。

表現ヘッダーには、 `Content-Type`, `Content-Encoding`, `Content-Language`, `Content-Location` があります。

関連情報
----

* RFC 7231, section 3: Representations
* すべての HTTP ヘッダーの一覧
* ペイロードヘッダー (en-US)
* エンティティヘッダー
* `Digest` (en-US)/ `Want-Digest` (en-US)


RTSP: Real-time streaming protocol - MDN Web Docs 用語集: ウェブ関連用語の定義

RTSP: Real-time streaming protocol
==================================

Real-time streaming protocol (RTSP) はネットワークプロトコルの一つで、サーバーとクライアントの間でどのようにメディアのストリーミングが行われるかを制御するものです。基本的に、 RTSP は動画をストリーミングするときに [一時停止]/[再生] をクリックしたときに何が起こるかを記述するためのプロトコルです。コンピューターがリモコンであり、ストリーミングサーバーがテレビであった場合、 RTSP はテレビに作用するリモコンの操作の方法を記述します。

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

### 一般知識

* ウィキペディア上の RTSP
* RFC 7826 (このプロトコルの動作を詳細に定義した文書の一つ)

* MDN Web Docs 用語集
    + RTSP


URI - MDN Web Docs 用語集: ウェブ関連用語の定義

URI
===

**URI** *(Uniform Resource Identifier)* は、リソースを示す文字列です。

もっとも一般的なものは URL であり、ウェブ上の場所を指定することで、リソースを識別します。対照的に URN は、本の ISBN のような与えられた名前空間の中で名前によってリソースを参照します。

関連情報
----

* ウィキペディアの URI の記事
* RFC 3986 の URI


Block cipher mode of operation (暗号利用モード) - MDN Web Docs 用語集: ウェブ関連用語の定義

Block cipher mode of operation (暗号利用モード)
========================================

暗号利用モード (通常は単に「モード」と呼ばれます) は、ブロックサイズよりも長いメッセージを暗号化または復号化するためにブロック暗号を使用する方法を指定します。

現在使用されているほとんどの対称鍵アルゴリズムはブロック暗号です。これは、一度に 1 ブロックずつデータを暗号化することを意味します。各ブロックのサイズは固定されており、アルゴリズムによって決定されます。たとえば、AES は 16 バイトのブロックを使用します。ブロック暗号は常に *モード* と共に使用されます。モードは、ブロックサイズより長いメッセージを安全に暗号化する方法を指定します。たとえば、AES は暗号ですが、CTR、CBC、および GCM はすべてモードです。不適切なモードを使用したり、モードを誤って使用したりすると、使用する暗号アルゴリズムによって本来提供されるセキュリティを損なってしまう可能性があります。


AJAX - MDN Web Docs 用語集: ウェブ関連用語の定義

AJAX
====

**AJAX** (Asynchronous JavaScript And XML) は、 XMLHttpRequest として知られる技術を用いて、より複雑で動的なウェブページを構築するプログラミング手法のことです。

AJAX によって、ウェブページ全体を再読み込みせずに、 HTML ページの DOM の一部分を更新することができます。 AJAX は非同期処理も可能です。つまり、ウェブページのある部分を再読み込みしようとする間もコードは実行され続けます (ウェブページのある部分の再読み込みが終わるまでコードの実行がブロックされる同期処理と比べて)。

対話型のウェブサイトや最新のウェブ標準では、AJAX は徐々に JavaScript フレームワーク内の関数や公式の `Fetch API` 標準に置き換えられています。

関連情報
----

* AJAX (ウィキペディア)
* AJAX
* AJAX - 始めましょう
* 用語集:
    + XMLHttpRequest
* `XMLHttpRequest`
* `Fetch API`
* Fetch API の使用
* Synchronous vs. Asynchronous Communications


RAIL - MDN Web Docs 用語集: ウェブ関連用語の定義

RAIL
====

**RAIL** とは、**Response, Animation, Idle, Load** の頭文字をとったもので、2015 年に Google Chrome チームが発案した、ブラウザー内のユーザーエクスペリエンスとパフォーマンスにフォーカスしたパフォーマンスモデルです。RAIL におけるパフォーマンスとは、"特定のデバイスでサイトを高速化させることではなく、ユーザーを幸せにすること"です。インタラクションには、ページロード、アイドル状態、入力への応答、スクロールとアニメーションの 4 つのステージがあります。各項目については、以下に頭文字順に解説します。

**Response**

ユーザーからの何らかの入力を確認した場合、その入力に対する応答が **100 ミリ秒**以内であることです。

**Animation**

アニメーション中に行われる各フレームの処理が **16 ミリ秒**以内であることです。それは、一貫性もたせ、ジャンクの回避につながります。

**Idle**

JavaScript のメインスレッドを使用する場合、1 チャンクあたりの処理が **50 ミリ秒**以内であることです。それは、ユーザーインタラクションのためにメインスレッドを開放することにつながります。

**Load**

インタラクティブなコンテンツの読み込みが **1 秒**以内であることです。

関連情報
----

* Recommended Web Performance Timings: How long is too long (en-US)


Instance (インスタンス) - MDN Web Docs 用語集: ウェブ関連用語の定義

Instance (インスタンス)
=================

コンストラクターによって作成されたオブジェクトは、そのコンストラクターのインスタンスになります。

詳細情報
----

### 一般知識

* ウィキペディア上の記事インスタンス


BigInt - MDN Web Docs 用語集: ウェブ関連用語の定義

BigInt
======

JavaScript において, **BigInt** は 任意精度演算 で表現される整数数値型の一種です。他のプログラミング言語では異なる数値型が存在します。例としては、Integer、Float、 Double、 Bignum です。

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

### 一般知識

* Wikipedia 上のデータ型
### 技術文書

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


Certified - MDN Web Docs 用語集: ウェブ関連用語の定義

Certified
=========

**認証済み**とは、アプリケーションやコンテンツ、データの伝達が、関連する分野の専門性を持つ熟練者による評価を受けたことを意味し、従って、完全性、安全性、信頼性を持つことを示します。

暗号化における認証についての詳細は、デジタル証明書をご覧ください。

もっと学ぶ
-----

### 一般知識

* 情報セキュリティのチュートリアル
* Wikipedia の Certification(英語)
### Firefox OS

* Firefox OS の内部アプリは、認証アプリと呼ばれることもあります: 詳しくは、アプリの許可をご覧ください。


SPA (単一ページアプリケーション) - MDN Web Docs 用語集: ウェブ関連用語の定義

SPA (単一ページアプリケーション)
===================

SPA (Single-page application) はウェブアプリの実装の一種で、単一のウェブ文書のみを読み込み、別な内容を表する際には `XMLHttpRequest` や Fetch などの JavaScript API を通じて単一文書の本文の内容を更新するものです。

これにより、サーバーから新しいページ全体を読み込まずにユーザーにウェブサイトを使わせることができ、性能の向上やより動的な利用方法が得られるのと引き換えに、 SEO などで不利になったり、状態の保守、操作の改善、意味のある性能の監視のためにより労力が必要になったりします。

関連項目
----

### 一般知識

主要な SPA フレームワークには次のようなものがあります。

* React
* Angular
* Vue.JS

1. Wikipedia の記事
    1. シングルページアプリケーション
2. 用語集
    1. API
    2. AJAX
    3. JavaScript
3. クライアント側 JavaScript フレームワークの理解


デジタル証明書 - MDN Web Docs 用語集: ウェブ関連用語の定義

デジタル証明書
=======

デジタル証明書は、公開鍵暗号を組織に結びつけるデータファイルです。デジタル証明書には、コモンネーム(例:mozilla.org)、組織単位(例:Mozilla Corporation)、場所(例:Mountain View)などの組織に関する情報が含まれています。デジタル証明書は、証明書の信頼性を証明する認証局によって最も一般的に署名されます。

関連項目
----

* Wikipedia の公開鍵証明書 の記事


Decryption (復号) - MDN Web Docs 用語集: ウェブ関連用語の定義

Decryption (復号)
===============

暗号学では、**復号**とは暗号文を平文に変換することです。

復号は暗号プリミティブであり、サイファーと呼ばれる暗号アルゴリズムを使用して暗号文メッセージを平文に変換します。 暗号化と同様に、現代のサイファーの復号は、特定のアルゴリズムと鍵と呼ばれる秘密を使用して実行されます。 アルゴリズムはしばしば公開されるので、暗号化が安全なままであれば、鍵は秘密にしておく必要があります。

![復号プリミティブ。](/ja/docs/Glossary/Decryption/decryption.png)

復号は暗号化の逆であり、鍵が秘密のままであれば、特定の秘密を知らずに復号すると、復号は数学的に実行するのが難しい。 どのくらい難しいかは、選択された暗号アルゴリズムの安全性に依存し、暗号解読の進展と共に進化します。

関連情報
----

* 暗号化と復号


Native - MDN Web Docs 用語集: ウェブ関連用語の定義

Native
======

*ネイティブ*アプリケーションは、ターゲットアーキテクチャを構成するハードウェア/ソフトウェア環境で実行するようにコンパイルされています。

ネイティブ Android アプリの例は、 Android ツールチェインを使用して Java で記述されたモバイルアプリケーションです。

一方、ブラウザー内で実行される Web アプリはネイティブではありません — これは、ネイティブ環境自体ではなく、ネイティブ環境の上にある Web ブラウザーで実行されます。

関連項目
----

### 一般知識

* Wikipedia 上の Native (computing) (英語)


Style origin (スタイルオリジン) - MDN Web Docs 用語集: ウェブ関連用語の定義

Style origin (スタイルオリジン)
=======================

CSS では、スタイル変更のソースには 3 つのカテゴリがあります。これらのカテゴリは**スタイルオリジン**と呼ばれています。これらのカテゴリはそれぞれ、**ユーザーエージェントオリジン**、**ユーザーオリジン**、**作者オリジン**と呼ばれています。

ユーザーエージェントオリジン

ユーザーエージェントオリジンは、ユーザーのウェブブラウザで使用されている既定のスタイルで構成されるスタイルオリジンです。コンテンツに他のスタイルが適用されていない場合、要素をレンダリングする際には、ユーザーエージェントオリジンのスタイルが使用されます。

ユーザーオリジン

ユーザーオリジンは、ウェブブラウザーのユーザーが追加した CSS を含むスタイルオリジンです。これらは、開発者ツールを使ってスタイルを追加したものや、 Stylus や Stylish のようにコンテンツにカスタムスタイルを自動的に適用するブラウザー拡張機能によるものなどがあります。

作者オリジン

作者オリジンは、文書の一部となるすべてのスタイルを含むスタイルオリジンであり、 HTML 内に埋め込まれているか、外部のスタイルシートファイルから読み込まれているかは関係ありません。

スタイルオリジンは、 `unset` や `revert` キーワードを使用している場合など、スタイルを削除する際に要素に適用されているスタイルのカスケードを、どこまでロールバック (またはバックトラック) するかを決定するために使用されます。

関連項目
----

### 技術情報

* CSS カスケードと継承: カスケードオリジン


Lossless compression (可逆圧縮) - MDN Web Docs 用語集: ウェブ関連用語の定義

Lossless compression (可逆圧縮)
===========================

**可逆圧縮** (Lossless compression) はデータ圧縮アルゴリズムの一種で、圧縮データから元のデータを完全に再構築することができるものです。可逆圧縮方法は可逆です。可逆圧縮の例としては、 GZIP, Brotli, WebP, PNG などがあります。

一方、非可逆圧縮は元のファイルから一部のデータを犠牲にすることで厳密ではない近似値を使用しており、元に戻すことができない圧縮方法です。

1. 用語集
    1. GZIP
    2. Brotli
    3. PNG
    4. 非可逆圧縮


ICE - MDN Web Docs 用語集: ウェブ関連用語の定義

ICE
===

**ICE** (*Interactive Connectivity Establishment*) は、ネットワークトポロジー (通常は音声および/またはビデオのチャット) に関係なく、2 つのピアを互いに接続するための WebRTC に (他の技術があまたある中で) 使用されるフレームワークです。 このプロトコルを使用すると、ネットワークアドレストランスレーター (NAT) を使用してそれぞれのローカルネットワーク上の他のデバイスとグローバル IP アドレスを共有していても、2 つのピアが相互に接続を見つけて確立することができます。

フレームワークのアルゴリズムは、以下のオプションを順番に試して、2つのピアを接続するために最低遅延のパスを探します。

1. 直接 UDP 接続（この場合かつ、この場合のみ、STUN サーバーを使用してピアのネットワーク対向アドレスを検出します）
2. HTTP ポート経由の直接 TCP 接続
3. HTTPS ポート経由の直接 TCP 接続
4. リレー/TURN サーバー経由の間接接続 (たとえば、NAT トラバーサルをブロックするファイアウォールの背後にピアがいる場合など、直接接続が失敗した場合)
関連情報
----

* WebRTC、ICE を使用する主要なウェブ関連プロトコル
* WebRTC プロトコル
* RFC 5245、ICE の IETF 仕様書 (英語)
* `RTCIceCandidate` (en-US)、ICE 候補を表すインターフェイス


JPEG - MDN Web Docs 用語集: ウェブ関連用語の定義

JPEG
====

**JPEG** (*Joint Photographic Experts Group*) とは、一般的に使われている、デジタル画像用の非可逆圧縮の方法です。

JPEG 圧縮は、連続したレイヤーで適用される色度サブサンプリング、離散コサイン変換と量子化、ランレングスデルタ＆ハフマンエンコーディングの 3 つの圧縮技術で構成されています。色度サブサンプリングは、人間の視覚システムが色の違いに対する視力が輝度よりも低いことを利用して、彩度情報の段階をルーマ情報よりも低くすることを意味します。離散コサイン変換は、異なる周波数で振動するコサイン関数の和でデータポイントの有限列を表現します。

関連項目
----

### 一般知識

* Wikipedia 上の JPEG


Sticky activation (粘着的な有効化) - MDN Web Docs 用語集: ウェブ関連用語の定義

Sticky activation (粘着的な有効化)
===========================

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

ユーザーが現在ページを操作しているか、ページを読み込んでからタッチ、ポインター、またはキーボードの操作を完了したとき、ページは「ユーザーによって有効化された」とみなされます。ユーザーによる粘着的な有効化では、有効化が行われたら (一時的な有効化と違って) セッションの間リセットされません。

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

プログラムから現在のウインドウの粘着的な有効化の状態を参照するには、`UserActivation.hasBeenActive` プロパティを参照します。

関連情報
----

* HTML Living Standard > Sticky activation
* 一時的な有効化
* `UserActivation.hasBeenActive`


mime - MDN Web Docs 用語集: ウェブ関連用語の定義

mime
====

MIME（Multipurpose internet mail extensions、多目的インターネットメール拡張）は、例えば、音声、動画、画像のような、ASCII テキスト以外の形式の文書を記述するための規格です。 当初は電子メールの添付ファイルに使用されていましたが、文書の種類をどこでも定義するための事実上の標準となっています。

MIMEタイプも参照してください。

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

### 一般知識

* Wikipedia 上の MIME


Git - MDN Web Docs 用語集: ウェブ関連用語の定義

Git
===

**Git**はオープンソースで無償の、分散型ソースコードマネジメント (SCM)システムです。Git を用いることで、分散した開発チームがコードベースを取り扱うことができます。従来の SCM システムから一線を画しているのは、一般的な操作(ブランチ(branching)、コミット(commiting)など)を自身の開発機で、master リポジトリを変更することなしに、それどころか master リポジトリへの書き込み権限がなくても行うことができる機能です。

詳細
--

### 基本的な知識

* 公式サイトの資料
* GitHub, Git をベースとしたグラフィカルなプロジェクトホスト


Forbidden header name (禁止ヘッダー名) - MDN Web Docs 用語集: ウェブ関連用語の定義

Forbidden header name (禁止ヘッダー名)
===============================

**禁止ヘッダー名**はプログラムから変更することができない HTTP ヘッダーの名前、特に、 HTTP **リクエスト**ヘッダーの名前です (反対に、禁止レスポンスヘッダー名もあります)。

このようなヘッダーを変更することは禁止されています。なぜなら、ユーザーエージェントがヘッダーを完全に制御できるからです。`Sec-` で始まる名前は、`XMLHttpRequest` のような、開発者にヘッダーの制御を許可する Fetch を使った API から安全に新しいヘッダーを作成するために予約されています。

禁止ヘッダー名は `Proxy-` や `Sec-` で始まるもの、または以下の名前の 1 つです。

* `Accept-Charset`
* `Accept-Encoding`
* `Access-Control-Request-Headers`
* `Access-Control-Request-Method`
* `Connection`
* `Content-Length`
* `Cookie`
* `Cookie2`
* `Date`
* `DNT`
* `Expect`
* `Feature-Policy`
* `Host`
* `Keep-Alive`
* `Origin`
* `Proxy-`
* `Sec-`
* `Referer`
* `TE`
* `Trailer`
* `Transfer-Encoding`
* `Upgrade`
* `Via`

**メモ:** `User-Agent` ヘッダーは仕様としては禁止ではなくなりました (Firefox 43 で実装された forbidden header name list を参照)。 Fetch の Headers オブジェクトや、XHR の setRequestHeader() などでこのヘッダーを設定することが可能です。ただし、 Chrome は Fetch リクエストからこのヘッダーを暗黙的に削除します (Chromium バグ 571722 を参照)。

関連情報
----

禁止レスポンスヘッダー名 (用語集)


NNTP - MDN Web Docs 用語集: ウェブ関連用語の定義

NNTP
====

**NNTP** (Network News Transfer Protocol) は、Usenet のメッセージをクライアントからサーバー、またはサーバー間で転送するために使用されるプロトコルです。

関連項目
----

### 一般知識

* Wikipedia のNNTP
### 技術リファレンス

* IETF より: RFC 3977 about NNTP (2006)


Fork (フォーク) - MDN Web Docs 用語集: ウェブ関連用語の定義

Fork (フォーク)
===========

Fork (フォーク) とは、ある時点での既存のソフトウェアプロジェクトのコピーであり、自分自身の変更をプロジェクトに追加するためのものです。基本的に、元のソフトウェアのライセンスが許せば、コードをコピーして変更を加えて独自のバージョンを開発することができます。それ自体が「フォーク」となります。

フォークは、フリーでオープンソースのソフトウェア開発でよく見られます。 これは、 Git (及び GitHub プラットフォーム) を使用した貢献モデルにより、有名な用語になりました。

詳細情報
----

### よく知られているフォーク

* Linux ディストリビューション
* Node.js と io.js (のちに統合されました)
* LibreOffice (OpenOffice からのフォーク)

1. General Knowledge
    1. Wikipedia の フォーク
    2. How to fork a GitHub repo (Git コンテキストのフォーク)
2. MDN Web Docs 用語集
    1. フォーク


PNG - MDN Web Docs 用語集: ウェブ関連用語の定義

PNG
===

**PNG** (*Portable Network Graphics*) は、可逆データ圧縮をサポートする画像ファイル形式です。

関連項目
----

### 一般知識

* Wikipedia 上の PNG


LTR (左書き) - MDN Web Docs 用語集: ウェブ関連用語の定義

LTR (左書き)
=========

**LTR** (**Left To Right**, 左書き) は、テキストが左から右に書かれることを示すロケールプロパティです。例えば、 `en-US` ロケール (アメリカ英語) は左書きを指定します。西洋の言語の多くは、世界中の他の言語と同様に、 LTR で書かれます。

LTR とは逆に、 RTL (Right To Left, 右書き) はアラビア語 (`ar`) やヘブライ語 (`he`) など、他の一般的な語で使われます。

技術情報
----

* ローカリゼーションと国際化
* MDN Web Docs 用語集
    + locale
    + LTR
    + RTL
* HTML グローバル属性
    + `dir`
    + `lang`
* CSS
    + `:dir()` (en-US)
    + `direction`
    + `unicode-bidi`
    + `writing-mode`


Operand (オペランド) - MDN Web Docs 用語集: ウェブ関連用語の定義

Operand (オペランド)
===============

**オペランド**は演算子で操作されるデータを表す命令の一部です。例えば、2 つの数字を加算する時、数字はオペランドで "+" が演算子です。

詳細情報
----

* Wikipedia の 被演算子


Reporting directive (報告ディレクティブ) - MDN Web Docs 用語集: ウェブ関連用語の定義

Reporting directive (報告ディレクティブ)
===============================

**CSP の報告ディレクティブ**は `Content-Security-Policy` ヘッダーで使用され、 CSP 違反の報告過程を制御します。

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

関連情報
----

* 用語集
    + CSP
    + フェッチディレクティブ
    + 文書ディレクティブ
    + ナビゲーションディレクティブ
* リファレンス
    + https://www.w3.org/TR/CSP/#directives-reporting
    + `upgrade-insecure-requests`
    + `block-all-mixed-content`
    + `require-sri-for`
    非推奨
    + `Content-Security-Policy`


Argument (実引数) - MDN Web Docs 用語集: ウェブ関連用語の定義

Argument (実引数)
==============

**実引数**は関数の入力として渡される値（プリミティブまたはオブジェクト）です。

例:

```js
const argument1 = "Web";
const argument2 = "Development";
example(argument1, argument2); // 2 つの引数を渡す

// この関数は 2 つの値を取る
function example(parameter1, parameter2) {
  console.log(parameter1); // 出力 = "Web"
  console.log(parameter2); // 出力 = "Development"
}
```

関数呼び出しにおける実引数の順序は、関数定義内の仮引数の順序と同じでなければなりません。

```js
const argument1 = "foo";
const argument2 = [1, 2, 3];
example(argument1, argument2); // 2 つの実引数を渡す

// この関数は単一の値を取るので、渡された第 2 引数は無視される。
function example(parameter) {
  console.log(parameter); // 出力 = foo
}
```

関連情報
----

* 仮引数と実引数の違い（ウィキペディア）
* JavaScript の `arguments` オブジェクト


CSP - MDN Web Docs 用語集: ウェブ関連用語の定義

CSP
===

CSP (Content Security Policy) は特定の種類のウェブサイト関連攻撃 ( XSS やデータインジェクション) を検出して軽減するのに使われます。

実装は HTTP の `Content-Security-Policy` というヘッダーを元にしています。

より深く学ぶ
------

### 一般知識

* Wilkipedia での Content Security Policy
### 技術知識

* MDN の Content Security Policy ドキュメント


Entity header (エンティティヘッダー) - MDN Web Docs 用語集: ウェブ関連用語の定義

Entity header (エンティティヘッダー)
==========================

**警告:** 現在の HTTP/1.1 仕様書では、エンティティ、エンティティヘッダー、エンティティ本体を参照することはなくなりました。一部のフィールドは表現ヘッダーフィールドとして参照されるようになりました。

エンティティヘッダーは HTTP ヘッダーの一種で、 HTTP メッセージの本体を説明します（すなわちメッセージ本体についてのメタデータです）。エンティティヘッダーには、 `Content-Length`, `Content-Language`, `Content-Encoding`, `Content-Type`, `Expires`, などがあります。エンティティヘッダーは HTTP のリクエストおよびレスポンスの両方に存在することがあります。

次の例では、 `Content-Length` はエンティティヘッダーであり、 `Host` と `User-Agent` はリクエストヘッダーです。

```http
POST /myform.html HTTP/1.1
Host: developer.mozilla.org
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.9; rv:50.0) Gecko/20100101 Firefox/50.0
Content-Length: 128
```

詳細情報
----

* 表現ヘッダー


P2P - MDN Web Docs 用語集: ウェブ関連用語の定義

P2P
===

P2P (ピア・ツー・ピア)はすべての参加しているノード（*ピア*）が同等の特権を持ち、負荷を共有する、コンピュータネットワークアーキテクチャです。P2P は、複数の*クライアント*ノードがサービスの中心となる*サーバー*に接続するクライアント・サーバーネットワークアーキテクチャとは異なります。 P2P はよくブロックチェーンアプリケーションで見られます。

理解を深める
------

### 一般知識

* Wikipedia 上の記事「P2P」


Fingerprinting (フィンガープリンティング) - MDN Web Docs 用語集: ウェブ関連用語の定義

Fingerprinting (フィンガープリンティング)
=============================

**フィンガープリンティング**は、ウェブサイトがブラウザーや基盤となるオペレーティングシステムを判別できる特性を収集し、組み合わせることにより、特定のブラウザー（ひいては特定のユーザー）を識別する手法です。フィンガープリントの要素は、例えば次のようなものです。

* ブラウザーのバージョン
* タイムゾーンや推奨される言語
* そのシステムで利用できる動画または音声コーデックの組み合わせ
* そのシステムにインストールされているフォント
* ブラウザーの設定の状態
* コンピューターの画面サイズや解像度

ウェブサイトは、端末上で JavaScript や CSS を実行することでこのような情報を取得することができ、このデータを組み合わせることで、ブラウザー固有のフィンガープリントを作成し、ウェブ全体でユーザーを追跡するために使用することができます。

ウェブ標準は、ウェブサイトが識別情報を収集する能力を最小限に抑えるように設計されており、ブラウザーは通常、独自の保護機能も追加しています。

関連情報
----

* Cover Your Tracks: ウェブサイトがブラウザーにフィンガープリントを使用することができるデータを示すツールです。
* Mitigating Browser Fingerprinting in Web Specifications: フィンガープリンティングを防ぐための仕様作成者向けのベストプラクティス。


WebVTT - MDN Web Docs 用語集: ウェブ関連用語の定義

WebVTT
======

WebVTT (Web Video Text Tracks) は HTML `<track>` 要素とともに文字データのマークアップを行うファイルフォーマットを策定する W3C 規格です。

WebVTT ファイルでは、動画の字幕やサブタイトル・動画の説明テキスト・コンテンツナビゲーション用チャプターなどが、音声や動画の再生時間に合わせたメタデータとして表現されています。

関連項目
----

### 一般知識

* ウィキペディアの「WebVTT」の記事(英語)
### 技術リファレンス

* MDN の「WebVTT」の記事
* W3C 規格文書


WHATWG - MDN Web Docs 用語集: ウェブ関連用語の定義

WHATWG
======

WHATWG (*Web Hypertext Application Technology Working Group*) はウェブ標準の保守や開発を行うためのコミュニティで、 DOM, Fetch, HTML などを扱っています。 Apple、Mozilla、Opera の従業員たちによって 2004 年に設立されました。

詳細情報
----

### 一般知識

* Wikipedia の記事 WHATWG
* WHATWG ウェブサイト


Parent object (親オブジェクト) - MDN Web Docs 用語集: ウェブ関連用語の定義

Parent object (親オブジェクト)
=======================

指定された プロパティ や メソッド が所属している オブジェクト。

関連項目
----

* JavaScript の継承とプロトタイプチェーン


firewall (ファイアウォール) - MDN Web Docs 用語集: ウェブ関連用語の定義

firewall (ファイアウォール)
===================

**ファイアウォール**はネットワークトラフィックをフィルタするシステムです。 特定の規則に従ってトラフィックを通過させたりブロックしたりすることができます。たとえば、特定のポートを宛先とする着信接続や、特定の IP アドレスへの発信接続をブロックすることができます。

ファイアウォールは単一のソフトウェアのようなシンプルなものから、ファイアウォールとしてのみ機能する専用マシンのような複雑なものまで存在します。

詳細情報
----

### 基礎知識

* Wikipedia の ファイアウォール


Python - MDN Web Docs 用語集: ウェブ関連用語の定義

Python
======

**Python**は、一般目的の高水準プログラミング言語です。複数のパラダイムを採用しており、手続型、オブジェクト指向、いくらか関数型プログラミングの構造に対応しています。

Python は、 ABC と呼ばれている別な言語の後継として、 Guido van Rossum によって 1985 年から 1990 年の間に開発され、現在ではウェブ開発、他のアプリケーションのスクリプト言語、実際のアプリケーション構築など、広い分野で使用されています。

Python は OSI に承認されたオープンソースライセンスのもとで開発され、商用を含めて無料で利用や配布をすることができます。 Phython のライセンスは Python Software Foundation が管理しています。

1. Learn more
    1. Wikipedia の Python
    2. Official Python docs tutorials
    3. Tutorialspoint Python tutorial
    4. AlphaCodingSkills Python Tutorial
    5. MDN の Django Web Framework (Python)
2. MDN Web Docs 用語集
    1. Java
    2. JavaScript
    3. PHP
    4. Python
    5. Ruby


Hypertext (ハイパーテキスト) - MDN Web Docs 用語集: ウェブ関連用語の定義

Hypertext (ハイパーテキスト)
====================

ハイパーテキストは、ほかのテキストへのリンクを含むテキストであり、小説のように単一で線形の流れのものとは対照的なものです。

この用語は、テッド・ネルソンによって 1965 年に造られました。

詳細情報
----

### 一般知識

* ウィキペディアのハイパーテキストの記事
### 技術リファレンス

* Hypertext Information Base


OTA - MDN Web Docs 用語集: ウェブ関連用語の定義

OTA
===

*Over The Air* (**OTA**) とは、無線接続されたデバイス上のソフトウェアを中央サーバーから自動更新することを指します。特定の更新セットを受信する全てのデバイスの所有者は同じ "チャネル" 上にあり、各デバイスは多くの場合、複数のチャネルにアクセスできます (例えば、本番またはエンジニアリングビルド)。

関連項目
----

### 基礎知識

* Wikipedia 上の Over-the-air programming
* Creating and applying Firefox OS update packages


MathML - MDN Web Docs 用語集: ウェブ関連用語の定義

MathML
======

**MathML** (XML のアプリケーション) は、ウェブページにおいて数式を表現するためのオープンスタンダードです。 1998 年に、 W3C はブラウザーで数式を表現するための MathML の最初の勧告を行いました。 MathML には科学コンテンツや音声合成などの他のアプリケーションもあります。

関連情報
----

* Wikipedia 上の MathML
* MathML
* MathML の作成
* What is MathML


Percent-encoding (パーセントエンコーディング) - MDN Web Docs 用語集: ウェブ関連用語の定義

Percent-encoding (パーセントエンコーディング)
================================

パーセントエンコーディング（Percent-encoding）は、URL のコンテキストで特定の意味を持つ 8 ビット文字をエンコードするメカニズムです。URL エンコードとも呼ばれます。エンコードは置換で構成されます。`'%'` の後に、置換文字の ASCII 値の 16 進表現が続きます。

エンコードが必要な特殊文字は、`':'`, `'/'`, `'?'`, `'#'`, `'['`, `']'`, `'@'`, `'!'`, `'$'`, `'&'`, `"'"`, `'('`, `')'`, `'*'`, `'+'`, `','`, `';'`, `'='`、および `'%'` 自体です。他の文字もエンコードできますが、エンコードする必要はありません。

| `':'` | `'/'` | `'?'` | `'#'` | `'['` | `']'` | `'@'` | `'!'` | `'$'` | `'&'` | `"'"` | `'('` | `')'` | `'*'` | `'+'` | `','` | `';'` | `'='` | `'%'` | `' '` |
| --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- | --- |
| `%3A` | `%2F` | `%3F` | `%23` | `%5B` | `%5D` | `%40` | `%21` | `%24` | `%26` | `%27` | `%28` | `%29` | `%2A` | `%2B` | `%2C` | `%3B` | `%3D` | `%25` | `%20` または `+` |

コンテキストに応じて、文字 `' '` は `'+'`（`application/x-www-form-urlencoded` メッセージで使用するパーセントエンコーディングバージョンなど）または URL のような `'%20'` に変換されます。

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

### 一般知識

* ウィキペディアでのパーセントエンコーディングの定義。
### 技術的知識

* RFC 3986 のセクション 2.1 に、このエンコーディングが定義されています。


Gamut (色域) - MDN Web Docs 用語集: ウェブ関連用語の定義

Gamut (色域)
==========

**色域** (gamut)とは、色のサブセットのことで、通例ディスプレイや印刷用デバイスが表現できる色の範囲を指します。

いかなるディスプレイやプリンターでも、人間の目が知覚できるあらゆる範囲の色を表現することはできません。デバイスの*色域*とは、そのデバイスがサポートする色の集合のことを指します。

伝統的にウェブ開発では、 *sRGB* (Standard Red-Green-Blue)という色域だけが用いられていました。 sRGB では、それぞれの色が 3 バイトで記述され、各バイトはそれぞれの原色を表しています。しかしながら sRGB では、「ワイドカラー」なモニターやプロ向けのプリンターがサポートする、より広い範囲の色を表現することができません。

2021 年以降各ブラウザーは、映画産業で広く用いられる *P3* や *Rec. 2020* など、そのほかの色域についての機能も提供するようになりました。

`color-gamut` というメディア特性を使えば、より広範囲の色域をサポートするデバイスに向けて、様々な色域を定義することができます。そうしたデバイスでは RGB の色域外の色を、専用の CSS 関数で記述することができます。例えば、 `lch()` を使えば LCH 円筒座標系を用いることができますし、 `lab()` を使えば Lab 座標系を使うことができます。

関連項目
----

* *色域* (*Wikipedia*).


ASCII - MDN Web Docs 用語集: ウェブ関連用語の定義

ASCII
=====

**ASCII** (*American Standard Code for Information Interchange*) とは、文字、数字、句読点、および制御コードをデジタル形式に変換するために、コンピュータによって使用される最も一般的な符号化方法の 1 つです。 2007 年から、ウェブ上では UTF-8 が用いられています。

詳細情報
----

### 基礎知識

* Wikipedia 上の記事 「ASCII」


FTU - MDN Web Docs 用語集: ウェブ関連用語の定義

FTU
===

FTU ( First Time Use、ファーストタイムユース) は、Firefox OS 端末上に新しくインストールした Gecko の起動時に読み込まれるアプリです。

FTU は、タイムゾーンや WiFi の詳細、デフォルト言語、連絡先のインポートといった、様々な重要オプションの設定や、端末の詳細確認に使う「Phone Tour」に使うことができます。


Enumerated (列挙型) - MDN Web Docs 用語集: ウェブ関連用語の定義

Enumerated (列挙型)
================

コンピューター科学では、**列挙**型は、名前の付いた値の限られた集合からなるデータ型です。

HTML 列挙型属性
----------

HTMLでは、列挙型属性は、限定された、あらかじめ設定されたテキスト値の集合を持つ属性です。例えば、グローバル HTML の `dir` 属性には、3 つの有効な値、`ltr`, `rtl`, `auto` があります。

それぞれの列挙型属性には、属性が値なしで存在する（値がない）場合の既定値、及び属性に無効な値が割り当てられている場合の既定値があります。HTML の論理属性が、値が存在するか、省略されるか、または無効であるかに関わらず、属性が存在する場合は常に真となるのに対して、HTML の列挙型属性では、値が省略された場合の既定値は、無効な値の場合の既定値と異なることがあります。例えば、グローバル HTML の `contenteditable` 属性には、2 つの有効なキーワード、`true` と `false` があります。この属性が表示されているが値が設定されていない場合、その値は `true` となります。値が設定されているが、 `contenteditable="contenteditable"` のような無効な値の場合、その値は 3 つ目の状態である `inherit` が割り当てられます。

ARIA 列挙型属性
----------

ARIA の状態とプロパティは、HTML であるため、列挙型の属性もあります。ARIA 属性が列挙されたリストの中に `true` と `false` の両方の値を含んでいる場合、一般的に省略された属性は `false` として、無効な値は `true` として扱われ、空文字列や省略された値の既定値は属性に依存することになります。

例えば `aria-current` 属性が受け入れることができるのは、 `page`, `step`, `location`, `date`, `time`, `true`, `false` という、限られた値のリストです。この場合、属性が存在しないか、空文字列であるか、値がない状態で存在するか、または `aria-current="false"` に設定されている場合、その属性は false となり、ユーザーには公開されません。列挙された値のリストにない空文字列以外の値は、`aria-current="true"` が設定されている場合と同様に扱われます。

JavaScript 列挙可能プロパティ
--------------------

JavaScript で、列挙可能なプロパティとは、内部の列挙可能フラグが true に設定されているプロパティのことで、これは単純な割り当てやプロパティ初期化子によって作成されたプロパティの既定値です。ほとんどの反復処理機構（例えば `for...in` ループや `Object.keys`）は、列挙可能なキーしか処理しません。

関連情報
----

* 論理型
* JavaScript のデータ型とデータ構造
* HTML 標準の enumerated attributes


Character encoding (文字エンコーディング) - MDN Web Docs 用語集: ウェブ関連用語の定義

Character encoding (文字エンコーディング)
===============================

エンコーディングはバイト列と文字を対応付けるものです。バイトの並びは文字としてさまざまに解釈できます。特定のエンコーディング（UTF-8 など）を設定することで、バイトの並びがどのように解釈されるかを定めることができます。

例えば、 HTML ではふつう以下のような行を使って UTF-8 の文字エンコーディングを宣言します。

```html
<meta charset="utf-8" />
```

これで HTML 文書であらゆる自然言語の文字を使用できるようになり、確実に表示されるようになります。

関連情報
----

### 一般知識

* W3C の文字エンコーディング
* ウィキペディアの文字エンコーディング


Signature (シグネチャ) - MDN Web Docs 用語集: ウェブ関連用語の定義

Signature (シグネチャ)
=================

**シグネチャ**は状況によって色々な意味を持ちます。
 こちらを参照してください。

Signature (functions) (シグネチャ (関数))
**関数シグネチャ** (もしくは型シグネチャ、メソッドシグネチャ) はFunctionやMethodの入力と出力を定義します。
Signature (署名 (セキュリティ) )
**署名** もしくは*デジタル署名*とは、メッセージが正当であることを示す protocol です。
詳細情報
----

* Wikipedia の シグネチャ


UTF-8 - MDN Web Docs 用語集: ウェブ関連用語の定義

UTF-8
=====

UTF-8 (UCS Transformation Format 8) は World Wide Web において最も一般的な文字エンコーディングです。 1 文字あたり 1 ～ 4 バイトで表します。UTF-8 は ASCII に対して後方互換性を持っており、すべての標準 Unicode 文字を表現することができます。

UTF-8 の最初の 128 文字は、ASCII の 128 文字 (0 ～ 127) に正確に対応しており、つまり既存の ASCII 文字列はすでに UTF-8 として有効です。他の文字は 2 ～ 4 バイトを使用します。それぞれのバイトにはエンコードのためにいくつかのビットが予約されています。非 ASCII 文字は格納するために 2 バイト以上を必要とするため、バイト列が分割され再結合されない場合に破損する恐れがあります。

関連情報
----

### 一般知識

* ウィキペディアの UTF-8
* FAQ about UTF-8 on Unicode website


Parse (構文解析) - MDN Web Docs 用語集: ウェブ関連用語の定義

Parse (構文解析)
============

構文解析 (Parsing) とは、プログラムを解釈し、例えばブラウザー内の JavaScript エンジンなどの実行環境で、実際に実行できる内部形式に変換することを意味します。

ブラウザーは HTML を構文解析して DOM ツリーに変換します。 HTML の構文解析処理はトークン化とツリーの構築を含みます。 HTML トークンは、属性の名前や値と同じように、開始タグと終了タグを含みます。文書が適切に構造化されていれば、その構文解析処理は単純で速くなります。パーサーはトークン化された入力内容を構文解析して文書に変換し、文書ツリーを作り上げます。

HTML パーサーが画像のようなブロックされないリソースを見つけた場合、ブラウザーはそれらのリソースを要求し、構文解析を続けます。 CSS ファイルに遭遇した場合は構文解析処理を続けることができますが、 `<script>` タグ、特に `async` または `defer` 属性がないものの場合はレンダリングがブロックされ、 HTML の構文解析処理が停止します。

ブラウザーは CSS スタイルに遭遇した場合、その文字列を構文解析して CSS Object Model （または CSSOM）に変換し、そのデータ構造をレイアウトの整形と描画に使用します。それからブラウザーは、これら両方のデータ構造から、コンテンツを画面に描画するためのレンダリングツリーを生成します。 JavaScript も同様にダウンロードされ、構文解析され、そして実行されます。

JavaScript では、これはコンパイル時または、メソッドの呼び出し中など、パーサーが呼び出されるたびに行われます。

関連情報
----

* Wikipedia 上の 構文解析


Grid container - MDN Web Docs 用語集: ウェブ関連用語の定義

Grid container
==============

要素に `grid` または `inline-grid` を使用すると、CSS グリッドレイアウトの**グリッドコンテナー**になります。そして直下の子要素はグリッドアイテムになります。

要素がグリッドコンテナーになると、**グリッド整形文脈**を形成します。グリッドコンテナー直下の子要素は、`grid-template-columns` や `grid-template-rows`を使って明示的に定義されたグリッドや、明示的に定義されたグリッドの外側に置かれた時には暗黙的に形成されるグリッドに沿って、配置されます。

関連項目
----

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

* `grid-template-columns`
* `grid-template-rows`
* `grid-auto-columns`
* `grid-auto-rows`
* `grid`
* `grid-template`
### さらなる文書

* CSS グリッドレイアウトガイド: *グリッドレイアウトの基本概念*


Port (ポート) - MDN Web Docs 用語集: ウェブ関連用語の定義

Port (ポート)
==========

**ポート**とは、IP アドレスを持ち、ネットワークに接続されているコンピューターの通信上のエンドポイントです。ポートは数字で指定され、特に 1024 より小さい (1023 以下の) ポート番号は特定のプロトコルにデフォルトで関連付けられています。

例えば、HTTPプロトコルのデフォルトポートは 80 番、HTTPS プロトコルのデフォルトポートは 443 番であり、HTTP サーバはこれらのポートへのリクエストを待ち受けます。インターネットプロトコルは、SMTP (25 番)、POP3 (110 番)、IMAP (143 番)、IRC (194 番) など、それぞれデフォルトのポートが割り当てられています。

関連情報
----

### 一般知識

* Wikipedia 上のポート番号の記事


First paint - MDN Web Docs 用語集: ウェブ関連用語の定義

First paint
===========

 FirstPaint は Paint Timing API の一部です。ナビゲーションからブラウザーが読み込んだ最初のピクセルを画面にレンダリングします。
 ナビゲーション前の画面と視覚的に異なるものをレンダリングすることで「それが起きているのか？」という質問に答えます。

参照
--

* First meaningful paint
* First contentful paint
* Paint Timing API


Inheritance (継承) - MDN Web Docs 用語集: ウェブ関連用語の定義

Inheritance (継承)
================

継承は、オブジェクト指向プログラミングの大きな特徴です。データ抽象化は、いくつかのレベルで実行できます。つまり、クラスにスーパークラスとサブクラスを持たせることができます。

アプリ開発者は、スーパークラスの属性とメソッドを選択して、独自に保持して追加することで、とても柔軟にクラスを定義できます。言語によっては、クラスを複数の親から継承することができます（多重継承）。

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

### それについて学ぶ

* 継承とプロトタイプチェーン


WebKit - MDN Web Docs 用語集: ウェブ関連用語の定義

WebKit
======

*WebKit* はマークアップを基に適切にフォーマットされたウェブページを表示するためのフレームワークの 1 つです。Apple Safari、そして多くのモバイル向けブラウザーも、Webkit によって動いています (Webkit は移植性もカスタマイズ性も高いからです)。

Webkit は KDE の KHTML と KJS ライブラリー群のフォークの 1 つとして始まりましたが、これまで多くの個人や企業が貢献してきました (その中には、KDE、Apple、Google、Nokia も含まれています)。

Webkit は Apple の商標であり、BSD ライセンスの下にあるフレームワークです。しかしながら、2 つの重要なコンポーネントが LGPL の配下になりました: **WebCore** レンダリングライブラリーと、**JavaScriptCore** エンジンです。

詳細情報
----

### 一般知識

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

* WebKit CSS 拡張 (en-US)


Hoisting (巻き上げ、ホイスティング) - MDN Web Docs 用語集: ウェブ関連用語の定義

Hoisting (巻き上げ、ホイスティング)
=======================

JavaScript の**巻き上げ** (Hoisting) は、インタープリターがコードの実行前に、関数、変数、クラス、インポートの宣言をそのスコープの先頭に移動するように見えるプロセスを指します。

「巻き上げ」は ECMAScript 仕様書で規範的に定義されている用語ではありません。仕様書では宣言のグループを *HoistableDeclaration* として定義していますが、これは `function`、`function*`、`async function`、`async function*` 宣言しか含んでいません。巻き上げは、異なる形でではありますが、 `var` 宣言の機能としても多く考えられています。俗な言い方をすれば、以下のような動作はすべて巻き上げと見なされます。

1. スコープ内の宣言行よりも前で変数の値を使用すること。（「値の巻き上げ」）
2. 変数がスコープ内の宣言行よりも前で参照しても `ReferenceError` が発生せず、値が常に `undefined` であること。（「宣言の巻き上げ」）
3. 変数の宣言により、スコープ内のそれが宣言された行よりも前の動作が変化すること。
4. 宣言の副作用として、宣言を含む残りのコードの評価が行われる前に、宣言の副作用が発生すること。

上記の 4 つの関数宣言はタイプ 1 の動作で巻き上げが行われます。 `var` 宣言はタイプ 2 の動作で巻き上げが行われます。 `let`, `const`, `class` 宣言（まとめて字句宣言とも呼ばれる）はタイプ 3 の動作で巻き上げが行われます。 `import` 宣言はタイプ 1 とタイプ 4 の動作で巻き上げが行われます。

人によっては `let`, `const`, `class` を巻き上げが行われないと見なしますが、それは一時的デッドゾーンで宣言前に変数を使用することを厳しく禁止しているからです。巻き上げは普遍的に同意された用語ではないので、この反論は問題ありません。しかし、一時的デッドゾーンはそのスコープで他にも観測可能な変化を発生させることがあり、これは何らかの形で巻き上げがあるといえます。

```js
const x = 1;
{
  console.log(x); // ReferenceError
  const x = 2;
}
```

もし `const x = 2` 宣言がすべて巻き上げられなければ（実行されたときだけ有効になるように）、`console.log(x)` 文は上のスコープから `x` 値を読み取ることができるはずです。しかし、 `const` 宣言が定義されているスコープ全体をまだ「汚染」しているため、 `console.log(x)` 文はまだ初期化されていない `const x = 2` 宣言から `x` を読み込み、 `ReferenceError` を発生します。それでも、字句の宣言をnon-hoistingとして特徴付ける方が有益かもしれません。なぜなら、実用的な視点から見ると、これらの宣言の巻き上げは何の意味ももたらさないからです。

なお、以下は巻き上げの形式ではありません。

```js
{
  var x = 1;
}
console.log(x); // 1
```

これは「宣言する前にアクセスする」のではなく、単に `var` 宣言がブロックにスコープされていないからです。

巻き上げについての詳細は、次の記事を参照してください。

* `var`/`let`/`const` の巻き上げ — 文法とデータ型ガイド
* `function` の巻き上げ — 関数ガイド
* `class` の巻き上げ — クラスガイド
* `import` の巻き上げ — JavaScript モジュール
関連情報
----

* `var` 文 — MDN
* `let` 文 — MDN
* `const` 文 — MDN
* `function` 文 — MDN


Falsy (偽値) - MDN Web Docs 用語集: ウェブ関連用語の定義

Falsy (偽値)
==========

**偽値** (**falsy** または **falsey**) な値とは、論理型コンテキストに現れたときに偽とみなされる値です。

JavaScript は条件文や繰り返しなどの場面で、任意の値を強制的に論理型に型変換します。

以下の表は、 JavaScript の偽値の完全なリストです。

| 値 | 型 | 説明 |
| --- | --- | --- |
| null | null | キーワード `null` — 値が存在しないことを示します。 |
| undefined | undefined | undefined — プリミティブ値。 |
| `false` | 論理値型 | キーワード `false`。 |
| NaN | 数値型 | `NaN` — 数値ではない。 |
| `0` | 数値型 | 数値ゼロ （従って、 `0.0` や `0x0` なども含みます）。 |
| `-0` | 数値型 | 数値マイナスゼロ（従って、 `-0.0` や `-0x0` 等も含みます）。 |
| `0n` | 長整数型 | 長整数型のゼロ（従って、 `0x0n` も含みます）。なお、長整数型にはマイナスゼロはありません。 `0n` の負の数は `0n` です。 |
| `""` | 文字列型 | 空文字列値。`''` や ```` も含みます。 |
| `document.all` | オブジェクト | JavaScript で唯一の偽値のオブジェクトは、組み込みの `document.all` です。 |

`null` および `undefined` はヌル値でもあります。

例
-

JavaScript の *偽値* の例です（これは論理値のコンテキストでは偽に変換されるため、 `if` ブロックを実行しません）。

```js
if (false) {
  // 到達しない
}

if (null) {
  // 到達しない
}

if (undefined) {
  // 到達しない
}

if (0) {
  // 到達しない
}

if (-0) {
  // 到達しない
}

if (0n) {
  // 到達しない
}

if (NaN) {
  // 到達しない
}

if ("") {
  // 到達しない
}
```

### 論理 AND 演算子 &&

最初のオブジェクトが偽値の場合は、そのオブジェクトを返します。

```js
console.log(false && "dog");
// ↪ false

console.log(0 && "dog");
// ↪ 0
```

関連情報
----

* 真値
* 型変換
* 論理型
* 論理型への変換


Head - MDN Web Docs 用語集: ウェブ関連用語の定義

Head
====

**Head** **は** HTML 文書の一部で、その文書の メタデータ 、例えば著者や、説明や、HTML に適用される CSS や JavaScript ファイルへのリンクといったものを含んでいます。

詳細情報
----

### HTML head

* MDN の `<head>` 要素のリファレンス
* MDN Learning Area の HTML <head> (en-US)


Constant (定数) - MDN Web Docs 用語集: ウェブ関連用語の定義

Constant (定数)
=============

定数とはプログラマーが変更できない値のことです。例えば、数値 (1, 2, 42) です。一方、変数の場合、プログラマーは既に使用されている変数名に新しい値を割り当てられます。

変数と同様に、定数を識別子に割り当てられることがあります。例えば、`pi` という識別子に 3.14... (円周率) を割り当てることがあります。

詳細情報
----

### 基礎知識

* Wikipedia 上の記事「定数 (プログラミング)」


Object (オブジェクト) - MDN Web Docs 用語集: ウェブ関連用語の定義

Object (オブジェクト)
===============

オブジェクトはデータとそのデータをやり取りするための命令が入ったデータ構造です。オブジェクトはしばしば現実世界の事物を参照する事があります。例えば、レーシングゲームでは `car` や `map` オブジェクトと言った具合です。オブジェクト指向プログラミング言語の例としては、JavaScript、Java、C++、Python、そして Ruby などが挙げられます。

詳細情報
----

### 一般知識

* Wikipedia 上の記事 「オブジェクト指向プログラミング」
* JavaScript リファレンス内の `Object`
* JavaScript におけるオブジェクトのデータ構造


Stringifier (文字列化子) - MDN Web Docs 用語集: ウェブ関連用語の定義

Stringifier (文字列化子)
===================

オブジェクトの文字列化子は、属性またはメソッドで、文字列が期待される場面においてオブジェクトのテキスト表現を提供するために定義されるものです。

関連情報
----

* WebIDL ファイルに含まれる情報の中の文字列化子


Ruby - MDN Web Docs 用語集: ウェブ関連用語の定義

Ruby
====

**Ruby** はオープンソースのプログラミング言語です。Web コンテキストでは、Ruby はウェブサイト/アプリを生産するための *Ruby On Rails* (ROR) フレームワークと一緒にサーバー・サイドでよく使用されます。

ルビはまた、HTML で東アジアのテキストを強調して発音情報を与える方法でもあります; `<ruby>` 要素を見てください。

Learn More
----------

### 一般知識

* Wikipeia 上の Ruby
### 技術リファレンス

* Ruby の公式 Web サイト
* Ruby On Rails の公式 Web サイト


Fuzz testing (ファズテスティング) - MDN Web Docs 用語集: ウェブ関連用語の定義

Fuzz testing (ファズテスティング)
========================

**ファジング**はプログラムがクラッシュしたり不適切に動作したりしていないかを確認する手法です。自動化されたツールで予期せぬデータや無効なデータを入力し、その結果を見ます。プログラムがクラッシュしたり不適切な動作をするようであればその内容を確認します。これは、ソフトウェアの安定性、信頼性、安全性を確かめる重要な方法であり、Mozilla ではファジングを多く利用しています。

* Jesse's blog posts about fuzzing
* Wikipedia: ファジング
* jsfuzz - coverage guided javascript fuzzer


Engine - MDN Web Docs 用語集: ウェブ関連用語の定義

Engine
======

JavaScript エンジンは、 JavaScript のプログラムを構文解析して実行するインタープリターです。

詳細情報
----

### 一般知識

* Wikipedia の JavaScript エンジンの記事


Computer Programming (コンピュータープログラミング) - MDN Web Docs 用語集: ウェブ関連用語の定義

Computer Programming (コンピュータープログラミング)
=====================================

コンピュータープログラミングは、一連の命令を構成して体系化する処理です。これらがコンピューター/ソフトウェアのプログラムに何をするべきかを、コンピューターが理解できる言語で指示します。これらの命令は様々なプログラミング言語（C++, Java, JavaScript, HTML, Python, Ruby, Rust など）の形で与えられています。

適切な言語を使用して、すべての種類のソフトウェアをプログラム/作成できます。例えば、科学者の複雑な計算を手助けするプログラム、大量のデータを格納するデータベース、音楽をダウンロードできるウェブサイト、アニメーション動画を作成できるアニメーションソフトウェアなどです。

詳細情報
----

### 基礎知識

* Wikipedia の プログラミング
* Wikipedia プログラミング言語


Payload body - MDN Web Docs 用語集: ウェブ関連用語の定義

Payload body
============

HTTP メッセージの*ペイロード本文*は、HTTP メッセージ本文があれば、その送信時に送られるデータの `Transfer-Encoding` が適用される前の*情報* ("ペイロード") 部分です。 Transfer-Encoding が使用されない限り、 *ペイロード本文* と *メッセージ本文* は同じものです。

例えば、このレスポンスではメッセージ本文は "Mozilla Developer Network" というペイロード本文を持っているだけです。
```

HTTP/1.1 200 OK
Content-Type: text/plain
Mozilla Developer Network
```

対して、下記レスポンスは *transfer encoding* を使ってペイロード本文をチャンクに変換しています。ペイロード本文（情報）は同じく "Mozilla Developer Network" を送信しますが、メッセージ本文には、チャンクを分離するための追加のデータが含まれています。
```

HTTP/1.1 200 OK
Content-Type: text/plain
Transfer-Encoding: chunked
7\r\n
Mozilla\r\n
9\r\n
Developer\r\n
7\r\n
Network\r\n
0\r\n
\r\n
```

詳しくは、 RFC 7230, section 3.3: Message Body と RFC 7230, section 3.3.1: Transfer-Encoding を参照してください。


Code unit (コードユニット) - MDN Web Docs 用語集: ウェブ関連用語の定義

Code unit (コードユニット)
===================

**コードユニット** とは、文字エンコーディングシステムで用いられる UTF-8 や UTF-16 といった基本的構成要素です。文字エンコーディングシステムは Unicode コードポイント をエンコードするためにひとつもしくは複数のコードユニットを用います。

UTF-16 （ JavaScript 文字列で用いられるエンコーディングシステム）では、コードユニットは 16 ビットの値です。このことはつまり、文字列にインデックスを付けたり、文字列の長さを取得するためのオペレーションは、これらの 16 ビットユニット上で操作されることを意味します。これらのユニットは我々が文字列と考えるものと常に 1 対 1 で関連付けるわけではありません。

例えば、強調表示のような発音記号を含む文字列は時々、ふたつの Unicode コードポイントを用いて表されます：

```js
const myString = "\u006E\u0303";
console.log(myString); // ñ
console.log(myString.length); // 2
```

また、 Unicode で定義されている全てのコードポイントが 16 ビットに収まるわけではないため、多くの Unicode コードポイントは *サロゲートペア* と呼ばれる UTF-16 コードユニットのペアでエンコードされています：

```js
const face = "🥵";
console.log(face.length); // 2
```

JavaScript `String` オブジェクトの `codePointAt()` メソッドは、そのエンコードされたフォームから Unicode コードポイントを取得することを可能にさせます：

```js
const face = "🥵";
console.log(face.codePointAt(0)); // 129397
```

関連項目
----

* Unicode encoding FAQ


RTF - MDN Web Docs 用語集: ウェブ関連用語の定義

RTF
===

RTF (リッチテキストフォーマット) は書式設定 (例：太字、イタリック) をサポートしたプレーンテキストベースのファイルフォーマットです。

1980 年代に Microsoft Word チームの 3 人のプログラマーが RTF を作り、Microsoft が 2008 年まで開発していました。開発が終了した現在でも多くの文書処理プログラムが RTF を読み書きできます。

詳細情報
----

### 基礎知識

* Wikipedia の Rich Text Format
### 技術リファレンス

* Microsoft による最後の仕様


Mutable (ミュータブル) - MDN Web Docs 用語集: ウェブ関連用語の定義

Mutable (ミュータブル)
================

ミュータブルは、変更可能な変数の型です。JavaScript では、プリミティブな値ではない、オブジェクトと配列だけがミュータブルです。

（変数名が新しい値を指し示すようにすることはできますが、以前の値はまだメモリーに保持されていますので、ガベージコレクションが必要です。）

**ミュータブルオブジェクト**は、オブジェクトを作成した後に状態を変更できるオブジェクトです。

イミュータブルは、オブジェクトが作成された後は状態を変更できないオブジェクトです。

**文字列**と**数値**は**イミュータブル**です。例をあげて理解しておきましょう。
```

var immutableString = "Hello";

// 上記のコードでは、文字列値を持つ新しいオブジェクトが作成されます。

immutableString = immutableString + "World";

// 今、既存の値に "World" を追加しています。
```

"immutableString" に文字列値を追加すると、次のイベントが発生します。

1. "immutableString" の既存の値が取得される。
2. "immutableString" の既存の値に "World" が追加される。
3. 結果の値は、新しいメモリーブロックに割り当てられる。
4. "immutableString" オブジェクトは新たに作成されたメモリー空間を指すようになる。
5. 以前に作成されたメモリー空間がガベージコレクション可能になる。
より詳しく知る
-------

### 一般知識

* Wikipedia 上の イミュータブル