recursal/MDN huggingface dataset:
Scroll boundary
===============

A **scroll boundary** is the point at which a scrollable element cannot be scrolled any further in a particular direction, either at the top or bottom (or left/right for horizontal scrolling). This typically is the edge of the scrollport.

When the content of a scroll container does not exceed the container size in the scrolling direction, the container is considered to be at its scroll boundary at all times. This is because there's no extra content to scroll through. If the content is prevented from scrolling, such as when `overflow: hidden` is set, the element is not a scroll container, and therefore, there is no scroll boundary.

When the scroll boundary of the scrollport is reached by a user scrolling the content, a visual effect such as a bounce or a functional action like pull-to-refresh on mobile devices may occur. This default browser behavior is called the **boundary default action**.

For example, on mobile devices, dragging a page downward when already at the top causes a bounce effect and sometimes triggers a page refresh. This bounce or refresh is the boundary default action.

Boundary default actions can be local or non-local.

* A **local boundary default** is the action that occurring at the boundary of a specific scrollable area confined to that element. This action is considered *local* as it does not affect any ancestor containers or the rest of the webpage.
* A **non-local boundary default action** is when reaching the scroll boundary of a scroll container has effects beyond the specific element being scrolled. An example of this is scroll chaining, where reaching the scroll boundary of one element triggers scrolling in a parent or ancestor element, and possibly even initiating a page-wide action, such as navigation.
See also
--------

* `overscroll-behavior` CSS property
* CSS overflow module
* CSS overscroll behavior module
* CSS scroll snap module
Effective connection type
=========================

**Effective connection type** (ECT) refers to the measured network performance, returning a cellular connection type, like 3G, even if the actual connection is tethered broadband or Wi-Fi, based on the time between the browser requesting a page and effective type of the connection.

The values of '`slow-2g`', '`2g`', '`3g`', and '`4g`' are determined using observed round-trip times and downlink values.

| ECT | Minimum RTT | Maximum downlink | Explanation |
| --- | --- | --- | --- |
| `slow-2g` | 2000ms | 50 Kbps | The network is suited for small transfers only such as text-only pages. |
| `2g` | 1400ms | 70 Kbps | The network is suited for transfers of small images. |
| `3g` | 270ms | 700 Kbps | The network is suited for transfers of large assets such as high resolution images, audio, and SD video. |
| `4g` | 0ms | ∞ | The network is suited for HD video, real-time video, etc. |

effectiveType is a property of the Network Information API, exposed to JavaScript via the navigator.connection object. To see your effective connection type, open the console of the developer tools of a supporting browser and enter the following:


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

See also
--------

* Network Information API
* `NetworkInformation`
* `NetworkInformation.effectiveType`
* `ECT`
eTLD
====

The term **eTLD** stands for "effective top-level domain" and is a domain under which domains can be registered by a single organization.

A top level domain (TLD) is the part of the domain name following the final dot: so for example, the top-level domain in `crookedtimber.org` is `org`.

Suppose only domains directly under top-level domains were registrable by single organizations. Then you would know that the following domains all belonged to the same organization:
```

    xyz.org
abc.xyz.org
def.xyz.org
```


However, this does not work as a general rule, because many registrars allow organizations to register domains at levels below the top level. This means that, for example, `sussex.ac.uk` and `aber.ac.uk` are owned by different organizations.

Because this is a matter of the registrar's policies, it's impossible to tell algorithmically whether a given domain name suffix (like `ac.uk`) is publicly registrable or not. The Public Suffix List is a list of all suffixes under which organizations can directly register names: that is, it is a list of eTLDs.

The related concept **eTLD+1** means an eTLD plus the next part of the domain name. Because eTLDs are registrable, all domains with the same eTLD+1 are owned by the same organization.

For example, all the following are eTLD+1 domains:

* crookedtimber.org
* theguardian.com
* sussex.ac.uk
* aber.ac.uk

This means that all domains under each of these domains belong to the same organization. For example:
```

 film.theguardian.com
music.theguardian.com
```


```
      news.sussex.ac.uk
      blog.sussex.ac.uk
admissions.sussex.ac.uk
```

See also
--------

* Public Suffix List
Prototype
=========

A prototype is a model that displays the appearance and behavior of an application or product early in the development lifecycle.

See Inheritance and the prototype chain

See also
--------

* Software Prototyping on Wikipedia
Ajax
====

Asynchronous JavaScript and XML (**Ajax**, or **AJAX**) is a web development technique in which a web app fetches content from the server by making asynchronous HTTP requests, and uses the new content to update the relevant parts of the page without requiring a full page load. This can make the page more responsive, because only the parts that need to be updated are requested.

Ajax can be used to create single-page apps, in which the entire web app consists of a single document, which uses Ajax to update its content as needed.

Initially Ajax was implemented using the `XMLHttpRequest` interface, but the `fetch()` API is more suitable for modern web applications: it is more powerful, more flexible, and integrates better with fundamental web app technologies such as service workers. Modern web frameworks also provide abstractions for Ajax.

This technique is so common in modern web development that the specific term "Ajax" is rarely used.

See also
--------

* Fetching data from the server
* `Fetch API`
* Single-page application
* `XMLHttpRequest`
* AJAX on Wikipedia
WebExtensions
=============

WebExtensions is a cross-browser system for developing browser extensions in Firefox. This system provides APIs, which to a large extent are supported across different browsers like Mozilla Firefox, Google Chrome, Opera Browser, Microsoft Edge, or Apple Safari.

See also
--------

* Browser extensions on MDN
Bounding Box
============

The bounding box of an element is the smallest possible rectangle (aligned with the axes of that element's user coordinate system) that entirely encloses it and its descendants.
RAIL
====

**RAIL**, an acronym for **Response, Animation, Idle, and Load**, is a performance model originated by the Google Chrome team in 2015, focused on user experience and performance within the browser. The performance mantra of RAIL is "Focus on the user; the end goal isn't to make your site perform fast on any specific device, it's to make users happy." There are 4 stages of interaction: page load, idle, response to input, and scrolling and animation. In acronym order, the main tenets are:

**Response**

Respond to users immediately, acknowledging any user input in **100ms** or less.

**Animation**

When animating, render each frame in under **16ms**, aiming for consistency and avoiding jank.

**Idle**

When using the main JavaScript thread, work in chunks for less than **50ms** to free up the thread for user interactions.

**Load**

Deliver interactive content in less than **1 second**.

See also
--------

* Recommended Web Performance Timings: How long is too long
Algorithm
=========

An **algorithm** is a self-contained series of instructions to perform a function.

In other words, an algorithm is a means of describing a way to solve a problem so that it can be solved repeatedly, by humans or machines. Computer scientists compare the efficiency of algorithms through the concept of "Algorithmic Complexity" or "Big O" notation.

For example:

* A cooking recipe is a simple algorithm for humans.
* A sorting algorithm is often used in computer programming to explain to a machine how to sort data.

Common algorithms are Pathfinding algorithms such as the optimization Traveling Salesman Problem, Tree Traversal algorithms, and so on.

There are also Machine Learning algorithms such as Linear Regression, Logistic Regression, Decision Tree, Random Forest, Support Vector Machine, Recurrent Neural Network (RNN), Long Short Term Memory (LSTM) Neural Network, Convolutional Neural Network (CNN), Deep Convolutional Neural Network, and so on.

See also
--------

* Algorithm on Wikipedia
* Explanations of sorting algorithms
* Explanations of algorithmic complexity
Grid container
==============

Using the value `grid` or `inline-grid` on an element turns it into a **grid container** using CSS Grid Layout, and any direct children of this element become grid items.

When an element becomes a grid container it establishes a **grid formatting context**. The direct children can now lay themselves out on any explicit grid defined using `grid-template-columns` and `grid-template-rows`, or on the *implicit grid* created when an item is placed outside of the *explicit grid*.

See also
--------

### Property reference

* `grid-template-columns`
* `grid-template-rows`
* `grid-auto-columns`
* `grid-auto-rows`
* `grid`
* `grid-template`
### Further reading

* CSS Grid Layout guide: *Basic concepts of grid layout*
GPL
===

The (GNU) GPL (General Public License) is a copyleft free software license published by the Free Software Foundation. Users of a GPL-licensed program are granted the freedom to use it, read the source code, modify it and redistribute the changes they made, provided they redistribute the program (modified or unmodified) under the same license.

See also
--------

* FAQ on GNU licenses
* GNU GPL on Wikipedia
* GPL License text
Namespace
=========

Namespace is a context for identifiers, a logical grouping of names used in a program. Within the same context and same scope, an identifier must uniquely identify an entity.

In an operating system, a directory is a namespace. Each file or subdirectory within a directory has a unique name; the same name can be used multiple times across subdirectories.

In HTML, CSS, and XML-based languages, a namespace is the explicitly declared or implied dialect to which an element (or attribute) belongs.

See also
--------

* Namespaces crash course
* CSS namespaces module
* CSS `@namespace`
* `Document.createElementNS()` method
* Namespace on Wikipedia
Entity
======

An HTML **entity** is a piece of text ("string") that begins with an ampersand (`&`) and ends with a semicolon (`;`). HTML entities are frequently used to display reserved characters (which would otherwise be interpreted as HTML code), and invisible characters (like non-breaking spaces). You can also use HTML character entities in place of other characters that are difficult to type with a standard keyboard.

**Note:** Many characters have memorable entities. For example, the entity for the copyright symbol (`©`) is `&copy;`. For less memorable characters, such as `&#8212;` or `&#x2014;`, you can use a reference chart or decoder tool.

Reserved characters
-------------------

Some special characters are reserved for use in HTML, meaning that your browser will parse them as HTML code. For example, if you use the less-than (`<`) sign, the browser interprets any text that follows as a tag.

To display these characters as text, replace them with their corresponding character entities, as shown in the following table.

| Character | Entity | Note |
| --- | --- | --- |
| & | `&amp;` | Interpreted as the beginning of an entity or character reference. |
| < | `&lt;` | Interpreted as the beginning of a tag |
| > | `&gt;` | Interpreted as the ending of a tag |
| " | `&quot;` | Interpreted as the beginning and end of an attribute's value. |
|  | `&nbsp;` | Interpreted as the non breaking space. |
| – | `&ndash;` | Interpreted as the en dash (half the width of an em unit). |
| — | `&mdash;` | Interpreted as the em dash (equal to width of an "m" character). |
| © | `&copy;` | Interpreted as the copyright sign. |
| ® | `&reg;` | Interpreted as the registered sign. |
| ™ | `&trade;` | Interpreted as the trademark sign. |
| ≈ | `&asymp;` | Interpreted as almost equal to sign. |
| ≠ | `&ne;` | Interpreted as not equal to sign. |
| £ | `&pound;` | Interpreted as the pound symbol. |
| € | `&euro;` | Interpreted as the euro symbol. |
| ° | `&deg;` | Interpreted as the degree symbol. |

See also
--------

* Official list of character entities
OOP
===

**OOP** (Object-Oriented Programming) is an approach in programming in which data is encapsulated within **objects** and the object itself is operated on, rather than its component parts.

JavaScript is heavily object-oriented. It follows a **prototype**-based model, but it also offers a class syntax to enable typical OOP paradigms.

See also
--------

* Object-oriented programming on Wikipedia
* Introduction to object-oriented JavaScript
* Inheritance and the prototype chain
Boolean
=======

In computer science, a **Boolean** is a logical data type that can have only the values `true` or `false`.

For example, in JavaScript, Boolean conditionals are often used to decide which sections of code to execute (such as in if statements) or repeat (such as in for loops).

Below is some JavaScript pseudocode (it's not truly executable code) demonstrating this concept.


```js
/\* JavaScript if statement \*/
if (boolean conditional) {
  // code to execute if the conditional is true
}

if (boolean conditional) {
  console.log("boolean conditional resolved to true");
} else {
  console.log("boolean conditional resolved to false");
}

/\* JavaScript for loop \*/
for (control variable; boolean conditional; counter) {
  // code to execute repeatedly if the conditional is true
}
```


The Boolean value is named after English mathematician George Boole, who pioneered the field of mathematical logic.

Above is a general introduction. The term **Boolean** can have more specific meanings depending on the context. It may refer to:

Boolean (JavaScript)
A **Boolean** in JavaScript is a Primitive that can be either `true` or `false`.
Boolean attribute (ARIA)
A **boolean attribute** in ARIA is an Enumerated that includes `true` or `false` in the enumerated list.
Boolean attribute (HTML)
A **boolean attribute** in HTML is an attribute that represents `true` or `false` values. If an HTML tag contains a boolean attribute - no matter the value of that attribute - the attribute is set to `true` on that element. If an HTML tag does not contain the attribute, the attribute is set to `false`.
See also
--------

* Boolean on Wikipedia
Grid Column
===========

A **grid column** is a vertical track in a CSS Grid Layout, and is the space between two vertical grid lines. It is defined by the `grid-template-columns` property or in the shorthand `grid` or `grid-template` properties.

In addition, columns may be created in the *implicit grid* when items are placed outside of columns created in the *explicit grid*. These columns will be auto-sized by default, or can have a size specified with the `grid-auto-columns` property.

When working with alignment in CSS Grid Layout, the axis down which columns run is known as the *block, or column, axis*.

See also
--------

### Property reference

* `grid-template-columns`
* `grid-auto-columns`
* `grid`
* `grid-template`
### Further reading

* CSS Grid Layout Guide: *Basic concepts of grid layout*
Placeholder names
=================

Placeholder names are commonly used in cryptography to indicate the participants in a conversation, without resorting to terminology such as "Party A," "eavesdropper," and "malicious attacker."

The most commonly used names are:

* *Alice* and *Bob*, two parties who want to send messages to each other, occasionally joined by *Carol*, a third participant
* *Eve*, a passive attacker who is eavesdropping on Alice and Bob's conversation
* *Mallory*, an active attacker ("man-in-the-middle") who is able to modify their conversation and replay old messages
Computer Programming
====================

Computer programming is a process of composing and organizing a collection of instructions. These tell a computer/software program what to do in a language which the computer understands. These instructions come in the form of many different languages such as C++, Java, JavaScript, HTML, Python, Ruby, and Rust.

Using an appropriate language, you can program/create all sorts of software. For example, a program that helps scientists with complex calculations, a database that stores huge amounts of data, a website that allows people to download music, or animation software that allows people to create animated movies.

See also
--------

* Computer programming on Wikipedia
* List of Programming Languages: Wikipedia
Plaintext
=========

Plaintext refers to information that is being used as an input to an encryption algorithm, or to ciphertext that has been decrypted.

It is frequently used interchangeably with the term *cleartext*, which more loosely refers to any information, such as a text document, image, etc., that has not been encrypted and can be read by a human or computer without additional processing.
Visual Viewport
===============

The portion of the viewport that is currently visible is called the visual viewport. This can be smaller than the layout viewport, such as when the user has pinched-zoomed. The visual viewport is the visual portion of a screen excluding on-screen keyboards, areas outside of a pinch-zoom area, or any other on-screen artifact that doesn't scale with the dimensions of a page.

See also
--------

* Visual Viewport API
* Viewport on Wikipedia
* A tale of two viewports (Quirksmode)
* Viewport in the MDN Glossary
* Layout viewport in the MDN Glossary
Camel case
==========

**Camel case** is a way of writing phrases without spaces, where the first letter of each word is capitalized, except for the first letter of the entire compound word, which may be either upper or lower case. The name comes from the similarity of the capital letters to the humps of a camel's back. It's often stylized as "camelCase" to remind the reader of its appearance.

Camel casing is often used as a variable naming convention. The following variables are in camel case: `console`, `crossOriginIsolated`, `encodeURIComponent`, `ArrayBuffer`, and `HTMLElement`.

Note that if the phrase contains acronyms (such as `URI` and `HTML`), camel casing practices vary. Some prefer to keep all of them capitalized, such as `encodeURIComponent` above. This may sometimes lead to ambiguity with multiple consecutive acronyms, such as `XMLHTTPRequest`. Others prefer to only capitalize the first letter, as `XmlHttpRequest`. The actual global variable, `XMLHttpRequest`, uses a mix of both.

When the first letter of the entire phrase is upper case, it is called *upper camel case* or *Pascal case*. Otherwise, it is called *lower camel case*.

Camel case is the most popular convention in JavaScript, Java, and various other languages.

See also
--------

* Snake case
* Kebab case
* typescript-eslint rule: `naming-convention`
Browser
=======

A **Web browser** or **browser** is a program that retrieves and displays pages from the Web, and lets users access further pages through hyperlinks. A browser is the most familiar type of user agent.

See also
--------

* Web browser on Wikipedia
* user agent (Glossary)
* `User-agent` (HTTP Header)
* Download a browser
    + Mozilla Firefox
    + Google Chrome
    + Microsoft Edge
    + Opera Browser
BigInt
======

In JavaScript, **BigInt** is a numeric data type that can represent integers in the arbitrary precision format. In other programming languages different numeric types can exist, for examples: Integers, Floats, Doubles, or Bignums.

See also
--------

* Numeric types on Wikipedia
* The JavaScript type: `BigInt`
* The JavaScript global object `BigInt`
Three js
========

three.js is a JavaScript-based WebGL engine that can run GPU-powered games and other graphics-powered apps straight from the browser. The three.js library provides many features and APIs for drawing 3D scenes in your browser.

See also
--------

* Three.js on Wikipedia
* three.js official website
Native
======

A *native* application has been compiled to run on the hardware/software environment that comprises the targeted architecture.

An example of a native Android app would be a mobile application written in Java using the Android toolchain.

On the other hand, a Web App that runs inside a browser is not native — it is run in the web browser, which sits on top of the native environment, not the native environment itself.

See also
--------

* Native (computing) on Wikipedia
OpenSSL
=======

OpenSSL is an open-source implementation of TLS and SSL.

See also
--------

* OpenSSL on Wikipedia
* Official website
CORS-safelisted request header
==============================

A CORS-safelisted request header is one of the following HTTP headers:

* `Accept`,
* `Accept-Language`,
* `Content-Language`,
* `Content-Type`,
* `Range`.

When containing only these headers (and values that meet the additional requirements laid out below), a request doesn't need to send a preflight request in the context of CORS.

You can safelist more headers using the `Access-Control-Allow-Headers` header and also list the above headers there to circumvent the following additional restrictions.

Additional restrictions
-----------------------

CORS-safelisted headers must also fulfill the following requirements in order to be a CORS-safelisted request header:

* `Accept-Language` and `Content-Language` can only have values consisting of `0-9`, `A-Z`, `a-z`, space or `*,-.;=`.
* `Accept` and `Content-Type` can't contain a *CORS-unsafe request header byte*: `0x00-0x1F` (except for `0x09 (HT)`, which is allowed), `"():<>?@[\]{}`, and `0x7F (DEL)`.
* `Content-Type` needs to have a MIME type of its parsed value (ignoring parameters) of either `application/x-www-form-urlencoded`, `multipart/form-data`, or `text/plain`.
* `Range` needs to have a value of a single byte range in the form of `bytes=[0-9]+-[0-9]*`.
 See the `Range` header documentation for more details.
* For any header: the value's length can't be greater than 128.
See also
--------

* CORS-safelisted response header
* Forbidden header name
* Request header
Snap positions
==============

Snap positions are points where the scrollport stops moving after the scrolling operation completes. Setting up snap positions allows to create a scrolling experience of paging through content instead of needing to drag content into view.

Snap positions are set up on a scroll container. See the CSS Scroll Snap properties.
CRLF
====

CR and LF are control characters or bytecode that can be used to mark a line break in a text file.

* CR = **Carriage Return** (`\r`, `0x0D` in hexadecimal, 13 in decimal) — moves the cursor to the beginning of the line without advancing to the next line.
* LF = **Line Feed** (`\n`, `0x0A` in hexadecimal, 10 in decimal) — moves the cursor down to the next line without returning to the beginning of the line.

A CR immediately followed by a LF (CRLF, `\r\n`, or `0x0D0A`) moves the cursor to the beginning of the line and then down to the next line.

See also
--------

* Newline on Wikipedia
* Carriage return on Wikipedia
SCM
===

SCM (Source Control Management) is a system for managing source code. Usually it refers to the use of software to handle versioning of source files. A programmer can modify source code files without being afraid of editing out useful stuff, because a SCM keeps track of how the source code has changed and who made the changes.

Some SCM systems include CVS, SVN, GIT.

See also
--------

* Revision control on Wikipedia
SOAP
====

**SOAP** (Simple Object Access Protocol) is a protocol for transmitting data in XML format.

See also
--------

* SOAP on Wikipedia
* Specification