recursal/MDN huggingface dataset:
World Wide Web
==============

The *World Wide Web*—commonly referred to as **WWW**, **W3**, or **the Web**—is a system of interconnected public webpages accessible through the Internet. The Web is not the same as the Internet: the Web is one of many applications built on top of the Internet.

Tim Berners-Lee proposed the architecture of what became known as the World Wide Web. He created the first web server, web browser, and webpage on his computer at the CERN physics research lab in 1990. In 1991, he announced his creation on the alt.hypertext newsgroup, marking the moment the Web was first made public.

The system we know today as "the Web" consists of several components:

* The **HTTP** protocol governs data transfer between a server and a client.
* To access a Web component, a client supplies a unique universal identifier, called a **URL** (uniform resource locator) or URI (uniform resource identifier) (formally called Universal Document Identifier (UDI)).
* **HTML** (hypertext markup language) is the most common format for publishing web documents.

Linking, or connecting resources through hyperlinks, is a defining concept of the Web, aiding its identity as a collection of connected documents.

Soon after inventing the Web, Tim Berners-Lee founded the W3C (World Wide Web Consortium) to standardize and develop the Web further. This consortium consists of core Web interest groups, such as web browser developers, government entities, researchers, and universities. Its mission includes education and outreach.

See also
--------

* Learn the Web
* World Wide Web on Wikipedia
* The W3C website
Asynchronous
============

The term **asynchronous** refers to two or more objects or events that do not exist or happen at the same time, that is, they are **not** synchronous . When multiple related things happen without any being dependent on the completion of previous happenings, they are asynchronous.

In computing, the word "asynchronous" is used in two major contexts, as explained below.

In networking and communications
--------------------------------

Asynchronous communication is a method of exchanging messages in which the sending, receiving, and processing of each message is not dependent on the sending, receipt, or processing of other messages. In asynchronous communication, each party receives and processes messages when convenient or possible to do so, rather than doing so immediately upon receipt. Additionally, messages may be sent without waiting for acknowledgement, with the understanding that if a problem occurs, the recipient will request corrections or otherwise handle the situation.

Email is a type of asynchronous human communication. A sender sends an email. The recipient reads the email and responds to it (or not) at their convenience, not necessarily right away. All parties can continue to send and receive messages at any time. Emails don't have to be scheduled in a particular sequence.

In asynchronous software, making a request, such as to a server, does not block other processes while waiting for the response. The software can continue performing other tasks. For example, in promise-based APIs, `Promise` objects are created for long operations. After the operation is complete, the promise is handled. With promises, the software doesn't have to wait for the operation to finish.

In software design
------------------

Asynchronous software design expands upon the concept by building code that allows a program to ask that a task be performed alongside the original task (or tasks), without stopping to wait for the task to complete. When the secondary task is completed, the original task is notified using an agreed-upon mechanism so that it knows the work is done, and that the result, if any, is available.

There are a number of programming techniques for implementing asynchronous software. See the article Asynchronous JavaScript for an introduction to them.

See also
--------

* Fetching data from the server (Learning Area)
* Synchronous
IDE
===

An Integrated Development Environment (**IDE**) or Interactive Development environment is a software application that provides comprehensive facilities to computer programmers for software development. An IDE normally consists of a source code editor, build automation tools and a debugger.

See also
--------

* IDE on Wikipedia
Beacon
======

A web **beacon** is a small object, such as a 1 pixel gif, embedded in markup, used to communicate information back to the web server or to 3rd party servers. Beacons are generally included to provide information about the user for statistical purposes. Beacons are often included within third party scripts for collecting user data, performance metrics and error reporting.

There is a W3C Draft Beacon Specification to standardize the beacon as an interface to asynchronously transfer HTTP data from User Agent to a web server prior to page load without negative performance impact.

See also
--------

* Real User Monitoring (RUM)
WebGL
=====

**WebGL** (*Web Graphics Library*) is a JavaScript API that draws interactive 2D and 3D graphics.

The Khronos Group maintains WebGL, which is based on OpenGL ES 2.0.

You can invoke WebGL within the HTML `<canvas>` element, which provides a rendering surface.

All major browsers now support WebGL, but its availability depends also on external factors (e.g. GPU support).

See also
--------

* WebGL on Wikipedia
* Check for WebGL support
* WebGL on MDN
* Support table for WebGL
Cross-site scripting (XSS)
==========================

Cross-site scripting (XSS) is a security exploit which allows an attacker to inject into a website malicious client-side code. This code is executed by the victims and lets the attackers bypass access controls and impersonate users. According to the Open Web Application Security Project, XSS was the seventh most common Web app vulnerability in 2017.

These attacks succeed if the Web app does not employ enough validation or encoding. The user's browser cannot detect the malicious script is untrustworthy, and so gives it access to any cookies, session tokens, or other sensitive site-specific information, or lets the malicious script rewrite the HTML content.

See also
--------

* Type of Attacks: Cross-site scripting (XSS)
* Cross-site scripting on Wikipedia
* Cross-site scripting on OWASP
* Another article about Cross-site scripting
Canvas
======

The **canvas element** is part of HTML5 and allows for dynamic, scriptable rendering of 2D and 3D shapes and bitmap images.

It is a low level, procedural model that updates a bitmap and does not have a built-in scene graph. It provides an empty graphic zone on which specific JavaScript APIs can draw (such as Canvas 2D or WebGL).

See also
--------

* Canvas on Wikipedia
* The Canvas tutorial on MDN
* The HTML `<canvas>` element on MDN
* The Canvas general documentation on MDN
* `CanvasRenderingContext2D`: The canvas 2D drawing API
* The Canvas 2D API specification
Strict mode
===========

JavaScript's **strict mode** is a way to *opt in* to a restricted variant of JavaScript, thereby implicitly opting-out of "sloppy mode". Strict mode isn't just a subset: it *intentionally* has different semantics from normal code.

Strict mode for an entire script is invoked by including the statement `"use strict";` before any other statements.

See also
--------

* Strict mode
* Glossary
    + Sloppy mode
Breadcrumb
==========

A **breadcrumb**, or breadcrumb trail, is a navigational aid that is typically placed between a site's header and the main content, displaying either a hierarchy of the current page in relation to the site's structure, from top level to current page, or a list of the links the user followed to get to the current page, in the order visited.

A location breadcrumb for this document might look something like this:

MDN > Glossary > Breadcrumb

Breadcrumb trails enable users to be aware of their location within a website. This type of navigation, if done correctly, helps users know where they are in a site and how they got there. They can also help a user get back to where they were before and can reduce the number of clicks needed to get to a higher-level page.

**Note:** While there's no dedicated semantic HTML element for breadcrumb navigation menus, the `<ol>` element is commonly used to represent their hierarchical structure.

See also
--------

* Breadcrumb Navigation
* Google Search Central: Breadcrumb Structured Data
* APG Guide: Breadcrumb Example
* Understanding Success Criterion 2.4.8 | W3C Understanding WCAG 2.2
* Understanding Technique 65 | W3C Understanding WCAG 2.2
Reflow
======

**Reflow** happens when a browser recalculates the position and geometry of certain parts of a webpage, such as after an update on an interactive site. This tends to be followed by repainting, which is when the browser redraws the webpage to show the resulting visual updates.

See also
--------

* Repaint
* Minimizing browser reflow on developer.google.com
* Understanding Reflow and Repaint in the browser on dev.to (2020)
Operand
=======

An **operand** is the part of an instruction representing the data manipulated by the operator. For example, when you add two numbers, the numbers are the operand and "+" is the operator.

See also
--------

* Operand on Wikipedia
Parameter
=========

A parameter is a named variable passed into a function. Parameter variables are used to import arguments into functions.

For example:


```js
function example(parameter) {
  console.log(parameter); // Output = foo
}

const argument = "foo";

example(argument);
```


There are two kinds of parameters:

input parameters

the most common kind; they pass values into functions. Depending on the programming language, input parameters can be passed in several ways (e.g., call-by-value, call-by-address, call-by-reference).

output/return parameters

primarily return multiple values from a function, but are not recommended since they cause confusion

### Parameters versus arguments

Note the difference between *parameters* and *arguments*:

* Function parameters are the names listed in the function's definition.
* Function arguments are the real values passed to the function.
* Parameters are initialized to the values of the arguments supplied.
See also
--------

* Difference between *parameter* and *argument* on Wikipedia
* Function declaration
* Function expression
ARIA
====

**ARIA** (*Accessible Rich Internet Applications*) is a W3C specification for adding semantics and other metadata to HTML to cater to users of assistive technology.

For example, you could add the attribute `role="alert"` to a `<p>` tag to notify a sight-challenged user that the information is important and time-sensitive (which you might otherwise convey through text color).

See also
--------

* ARIA roles
* ARIA states and properties: `aria-*` attributes
* ARIA
* ARIA guides
* WAI-ARIA specification
* WAI-ARIA authoring practices
Document environment
====================

When the JavaScript global environment is a window or an iframe, it is called a *document environment*. A global environment is an environment that doesn't have an outer environment.

See also
--------

* document environment in the HTML specification
Internet
========

The Internet is a worldwide network of networks that uses the Internet protocol suite (also named TCP/IP from its two most important protocols).

See also
--------

* How the Internet works (introduction for beginners)
Serializable object
===================

**Serializable objects** are objects that can be serialized and later deserialized in any JavaScript environment ("realm").
 This allows them to, for example, be stored on disk and later restored, or cloned with `structuredClone()`, or shared between workers using `DedicatedWorkerGlobalScope.postMessage()`.

 The serialization may not include all the properties and other aspects of the original object.
 For example, a serialization of a `DOMException` must include the `name` and `message` properties, but whether it includes other properties is implementation dependent.
 As a result, a deserialized object may not be an identical clone/copy of the original object.
 The new deserialized object will however be a deep copy, so any properties that were serialized from the original object and then deserialized into the new object will share no references with the original object.

 In some cases when serializing and deserializing an object, it makes sense to transfer some resources rather than creating a copy.
 Objects that can be transferred are called Transferable objects.

Supported objects
-----------------

 All primitive values are serializable.
 Not all objects are serializable objects.
 The objects that can be serialized are listed in: The structured clone algorithm > Supported types

**Note:** Serializable objects are marked up in Web IDL files with the attribute `[Serializable]`.
SVG
===

*Scalable Vector Graphics* (**SVG**) is a 2D vector image format based on an XML syntax.

The W3C began work on SVG in the late 1990s, but SVG only became popular when Internet Explorer 9 came out with SVG support. All major browsers now support SVG.

Based on an XML syntax, SVG can be styled with CSS and made interactive using JavaScript. HTML allows direct embedding of SVG tags in an HTML document.

As a vector image format, SVG graphics can scale infinitely, making them invaluable in responsive design, since you can create interface elements and graphics that scale to any screen size. SVG also provides a useful set of tools, such as clipping, masking, filters, and animations.

See also
--------

* SVG on Wikipedia
* W3.org's SVG Primer
* SVG documentation on MDN
* Latest SVG specification
EXIF
====

The **Exchangeable Image File Format (EXIF)** is a standard that specifies how metadata about a multimedia file can be embedded within the file. For example, an image might contain EXIF data describing the: pixel width, height, and density, shutter speed, aperture, ISO settings, capture date, etc.

See also
--------

* EXIF (Wikipedia)
* CIPA Standards, including "CIPA DC-008-Translation-2019 Exchangeable image file format for digital still cameras : Exif Version 2.32"
Character encoding
==================

An encoding defines a mapping between bytes and text. A sequence of bytes allows for different textual interpretations. By specifying a particular encoding (such as UTF-8), we specify how the sequence of bytes is to be interpreted.

For example, in HTML we normally declare a character encoding of UTF-8, using the following line:


```html
<meta charset="utf-8" />
```


This ensures that you can use characters from just about any human language in your HTML document, and they will display reliably.

See also
--------

* Character encoding on W3C
* Character encoding on Wikipedia
Rendering engine
================

A **rendering engine** is software that draws text and images on the screen. The engine draws structured text from a document (often HTML), and formats it properly based on the given style declarations (often given in CSS). Examples of layout engines: Blink, Gecko, EdgeHTML, WebKit.

See also
--------

* Web browser engine on Wikipedia
* Venkatraman.R - Behind Browsers (Part 1, Basics)
Interpolation
=============

Interpolation is a process of calculating values based on known values. The interpolation is used to obtain intermediate values of properties, such as height, width, etc., during the process of their animation. In gradients, interpolation is used to define intermediate values of colors based on a provided list of colors. Also, the term "interpolation" is used as a description of the substitution of strings in the template literals.

See also
--------

* Interpolation on Wikipedia
* String interpolation on Wikipedia
BiDi
====

**BiDi** (BiDirectional) refers to a document containing both right-to-left and left-to-right text. Even when both directionalities occur in the same paragraph, the text in each language must appear in its proper directionality.

See also
--------

* Bi-directional text on Wikipedia
XLink
=====

XLink is a W3C standard which is used to describe links between XML and XML or other documents. Some its behaviors are left to the implementation to determine how to handle.

Simple XLinks are "supported" in Firefox (at least in SVG and MathML), though they do not work as links if one loads a plain XML document with XLinks and attempts to click on the relevant points in the XML tree.

For those who may have found XLink 1.0 cumbersome for regular links, XLink 1.1 drops the need to specify `xlink:type="simple"` for simple links.

XLink is used in SVG, MathML, and other important standards.

### Specifications

* XLink 1.0
* XLink 1.1 (currently a Working Draft)
### See also

* XML
* Code snippets:getAttributeNS - a wrapper for dealing with some browsers not supporting this DOM method
ECMAScript
==========

**ECMAScript** is a scripting language specification on which JavaScript is based. Ecma International is in charge of standardizing ECMAScript.

See also
--------

* ECMAScript on Wikipedia
* ECMAScript
CSS Object Model (CSSOM)
========================

The **CSS Object Model (CSSOM)** is a set of APIs for reading and modifying a document's style-related (CSS) information. In other words, similar to the way in which the DOM enables a document's structure and content to be read and modified from JavaScript, the CSSOM allows the document's styling to be read and modified from JavaScript.

See also
--------

* Populating the page: how browsers work
Code point
==========

A **code point** is a number assigned to represent an abstract character in a system for representing text (such as Unicode). In Unicode, a code point is expressed in the form "U+1234" where "1234" is the assigned number. For example, the character "A" is assigned a code point of U+0041.

Character encoding forms, such as UTF-8 and UTF-16, determine how a Unicode code point should be encoded as a sequence of bytes. Different encoding forms may encode the same code point as different byte sequences: for example, the Cyrillic character "Ф", whose code point is U+0424, is encoded as `0xd0a4` in UTF-8 and as `0x0424` in UTF-16.

See also
--------

* The Unicode Standard: Code Points and Characters
Normative
=========

Normative is a word commonly used in software specifications to denote sections that are standardized and must be followed as a rule. Specifications might also contain sections that are marked as *non-normative* or *informative*, which means those are provided there for the purpose of helping the reader understand the specifications better or to showcase an example or best practice, which need not be followed as a rule.

See also
--------

* Description of normative and informative content in WHATWG wiki
Layout viewport
===============

The **layout viewport** is the viewport into which the browser draws a web page. Essentially, it represents what is available to be seen, while the visual viewport represents what is currently visible on the user's display device.

This becomes important, for example, on mobile devices, where a pinching gesture can usually be used to zoom in and out on a site's contents. The rendered document doesn't change in any way, so the layout viewport remains the same as the user adjusts the zoom level. Instead, the visual viewport is updated to indicate the area of the page that they can see.

See also
--------

* Visual Viewport API
* Viewport on Wikipedia
* A tale of two viewports (Quirksmode)
* Viewport in the MDN Glossary
* Visual viewport in the MDN Glossary
First Meaningful Paint
======================

**First Meaningful Paint** (FMP) is the paint after which the biggest above-the-fold layout change has happened and web fonts have loaded. It is when the answer to "Is it useful?" becomes "yes", upon first meaningful paint completion.

FMP is very sensitive to small differences in the page load. This can lead to inconsistent (bimodal) results. The metric's definition relies on browser-specific implementation details, which means it can't be standardized and has not been implemented in all web browsers.

**Warning:** First Meaningful Paint (FMP) is deprecated in Lighthouse 6.0. Moving forward, consider using the LargestContentfulPaint API instead.

See also
--------

* First contentful paint
* Largest Contentful Paint
Synchronous
===========

**Synchronous** refers to real-time communication where each party receives (and if necessary, processes and replies to) messages instantly (or as near to instantly as possible).

A human example is the telephone — during a telephone call you tend to respond to another person immediately.

Many programming commands are also synchronous — for example when you type in a calculation, the environment will return the result to you instantly, unless you program it not to.

See also
--------

* Asynchronous
* Asynchronous JavaScript
Composite operation
===================

In CSS, the value of a property in a CSS rule is the *underlying value* of that property, and the value of that same property in a keyframe is its *effect value*.

The *composite operation* is the specific operation that is used to combine an effect value with an underlying value to produce the final keyframe effect value. There are three types of composite operations:

* **replace**: The effect value replaces the underlying value. The final effect value in this case is the original effect value itself.
* **add**: The effect value is added to the underlying value.
* **accumulate**: The effect value is combined with the underlying value.

**Note:** Composite operation in CSS only applies to animations.

See also
--------

* `animation-composition`
* `KeyframeEffect.composite`
Server Timing
=============

The Server Timing specification enables the server to communicate performance metrics from the request-response cycle to the user agent, and utilizes a JavaScript interface to allow applications to collect, process, and act on these metrics to optimize application delivery.

See also
--------

* https://www.w3.org/TR/server-timing/
* Resource Timing
SDP
===

**SDP** (Session Description Protocol) is the standard describing a peer-to-peer connection. SDP contains the codec, source address, and timing information of audio and video.

Here is a typical SDP message:
```

v=0
o=alice 2890844526 2890844526 IN IP4 host.anywhere.com
s=
c=IN IP4 host.anywhere.com
t=0 0
m=audio 49170 RTP/AVP 0
a=rtpmap:0 PCMU/8000
m=video 51372 RTP/AVP 31
a=rtpmap:31 H261/90000
m=video 53000 RTP/AVP 32
a=rtpmap:32 MPV/90000
```


SDP is never used alone, but by protocols like RTP and RTSP. SDP is also a component of WebRTC, which uses SDP as a way of describing a session.

See also
--------

* WebRTC protocols
* Session Description Protocol on Wikipedia
High-level programming language
===============================

A high-level programming language has a **significant abstraction** from the details of computer operation. It is designed to be easily understood by humans and for this reason they must be translated by another software. Unlike low-level programming languages, it may use natural language elements, or may automate (or even entirely hide) significant areas of computing systems, making the process of developing simpler and more understandable relative to a lower-level language. The amount of abstraction provided defines how "high-level" a programming language is.

The idea of a language automatically translatable into machine code, but nearer to human logic, was introduced in computer science in the 1950s, especially thanks to the work of **John Backus** (IBM), to whom it owes the first high-level language to have been widely circulated: Fortran. For this innovation Backus received the Turing prize.