March 2023 web platform update

Now widely available on the web platform

Widely available

• BigInt: The BigInt JavaScript type represents integers of any size, including integers too large for the primitive Number type. Learn more.

• EXT_color_buffer_half_float WebGL extension: The EXT_color_buffer_half_float extension for WebGL 1.0 and 2.0 contexts renders 16-bit floating-point color buffers. Learn more.

• Intl.Locale: The Intl.Locale API parses Unicode locale identifiers, with language, region, and script codes, such as zh-Hans-CN or en-GB. Learn more.

• Intl.RelativeTimeFormat: The Intl.RelativeTimeFormat API creates a locale-aware formatter that turns an object representing a relative time (such as '1 day ago') into a localized string. Learn more.

• Promise.any(): The Promise.any() static method returns a promise that fulfills as soon as the first of an iterable of promises fulfills, with that promise's value. Otherwise, it rejects with an AggregateError when all of the promises have rejected. Learn more.

• scrollIntoView(): The scrollIntoView() method scrolls an element's ancestor containers such that the element is visible to the user. Learn more.

• steps() easing: The steps() CSS easing function divides an animation or transition into equidistant intervals, jumping from value to value. The step-start and step-end keyword values are presets with a single interval. Learn more.

• text-orientation: The text-orientation CSS property sets the how text is typeset within a line when the writing mode is vertical. Learn more.

• WEBGL_debug_shaders WebGL extension: The WEBGL_debug_shaders extension for WebGL 1.0 and 2.0 contexts adds the getTranslatedShaderSource() method to debug shaders from privileged contexts. Learn more.

• WebP: The WebP image format is a raster graphics file format that supports animation, alpha transparency, and lossy as well as lossless compression. Learn more.

Newly available on the web platform

Newly available

• Constructed stylesheets: The CSSStyleSheet constructor creates a new stylesheet which can be shared between a document and multiple shadow roots using adoptedStyleSheets. Learn more.

• Fetch metadata request headers: The Sec-Fetch-Dest, Sec-Fetch-Mode, Sec-Fetch-Site, and Sec-Fetch-User HTTP headers provide extra information about the way a request was made, to help servers reject certain kinds of malicious requests. Learn more.

• font-synthesis-small-caps: The font-synthesis-small-caps CSS property sets whether or not the browser should synthesize small caps typefaces when they're missing from the font. Learn more.

• font-synthesis-style: The font-synthesis-style CSS property sets whether or not the browser should synthesize italic and oblique typefaces when they're missing from the font. Learn more.

• font-synthesis-weight: The font-synthesis-weight CSS property sets whether or not the browser should synthesize bold typefaces when they're missing from the font. Learn more.

• font-variant-alternates: The font-variant-alternates CSS property, along with the @font-feature-values at-rule, chooses when to use a font's alternate glyphs. Learn more.

• Form-associated custom elements: Custom elements may act like built-in form elements, via the the attachInternals() method of HTMLElement and the ElementInternals API. Learn more.

• Import maps: A <script type="importmap"> HTML element provides an import map as a JSON string. An import map controls how the browser should resolve module specifiers when importing JavaScript modules. Learn more.

• input (event): The input event fires when a form control changes or an element with the contenteditable attribute changes. Learn more.

• Media query range syntax: The range syntax of CSS media queries allows you to use mathematical comparison operators such as <, >, <=, and >= to define a range of values for a media query. For example, (400px < width < 1000px) returns true if the viewport width is between 400px and 1000px. Learn more.

• messageerror: The messageerror event fires on a target, such as a window or worker, when an incoming message cannot be deserialized. This event can fire for many types of messages, such as cross-document messages or broadcast channel messages. Learn more.

• Offscreen canvas: The OffscreenCanvas API provides a canvas that can be drawn to off screen, with no dependencies on the DOM, which can be used to run heavy rendering operations inside a worker context. Learn more.

• Origin private file system: The navigator.storage.getDirectory() method returns a FileSystemDirectoryHandle that is restricted to a specific origin and invisible to the user's actual file system for faster file-based applications, such as SQLite databases. Learn more.

• outline: The outline CSS shorthand sets the color, style, and width of a line around an element, outside of the border. Learn more.

• pdfViewerEnabled: The navigator.pdfViewerEnabled read-only property returns a Boolean for whether the browser navigates to and shows a PDF in the browser window or downloads the PDF. Learn more.

• Push messages: The Push API subscribes to and receives server-initiated messages. Subscribers receive pushed messages in the background, even after periods inactive or offline. Learn more.

• requestAnimationFrame() in workers: The requestAnimationFrame() method in workers schedules a function that runs before the next repaint. Together with offscreen canvas, you can animate content from a worker. Learn more.

• Resource size: The decodedBodySize, encodedBodySize, and transferSize properties of the PerformanceResourceTiming API reports the size of resources loaded. Learn more.

• Screen orientation: The screen.orientation API gets information about the orientation of the viewport, such as landscape or portrait. With this API, you can adapt an application's layout or behavior in response to changes in orientation. Learn more.

• Server timing: The serverTiming property of the PerformanceResourceTiming API contains server timing information about network requests. Learn more.

• Imperative slot assignment: The assign() method for <slot> elements assigns nodes to the slot, as an alternative to using the slot and name HTML attributes. The nodes must be children of a shadow host and the shadow root must be created with the slotAssignment set to "manual". Also known as manual slot assignment. Learn more.

• translate attribute: The translate HTML attribute marks whether an element's text should be translated. Learn more.

• sin(), cos(), tan(), asin(), acos(), atan(), and atan2() (CSS): The sin(), cos(), tan(), asin(), acos(), atan(), and atan2() CSS functions compute various trigonometric functions. Learn more.

• Fixed-width SIMD (WebAssembly): 128-bit SIMD (Single Instruction Multiple Data) performs one instruction on multiple units of data, when running on hardware that supports such instructions. Also known as vector instructions. Learn more.