Navigation Menu

Skip to content

Instantly share code, notes, and snippets.

@hemanth
Last active September 25, 2021 18:20
Show Gist options
  • Star 8 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save hemanth/6290048 to your computer and use it in GitHub Desktop.
Save hemanth/6290048 to your computer and use it in GitHub Desktop.
Current Chrome browser features.

img srcset => Enable a responsive images solution by providing the browser multiple resources in varying resolutions for a single image.

Arrow function => The arrow (=>) takes the place of the function keyword

Box Alignment => CSS properties for aligning boxes within their container. Allows for true vertical centering among other features.

DOM3 Keyboard Events => KeyboardEvent: keydown, keyup

Default parameter => Allows formal parameters to be initialized with default values if no value or 2 is passed.

Full multicol support => Bring Blink's multicol support to a level that matches other engines' (Presto and Trident)

HTTP Client Hints => Header for proactive content negotiation; just as the Accept header allowed clients to indicate what formats they prefer, Client Hints allow clients to indicate a list of device and agent specific preferences.

MathML => An application of XML for describing mathematical notations and capturing both its structure and content.

Picture Element => Enable a responsive images solution by declaring multiple resources for an image using CSS media queries.

Pointer Events => Unified pointer input API subsuming MouseEvent and TouchEvents which addresses several existing problems (especially on touchscreen laptops) and provides future extensibility.

Rest parameters => Allows representation of an indefinite number of arguments as an array.

UIEvents (DOM4) Keyboard Events => Identify the physical key being pressed; Query key from layout.

CSSOM View smooth scroll API => Adds an optional argument to existing scroll APIs that specifies whether scrolling should be smooth. Also adds a CSS property for this.

DOM Level 3: wheel event => Implementation of the standard DOM Level 3 wheel event. Currently Blink implements a non standard mousewheel event with a very similar but incompatible API.

VTTCue => Move WebVTT specific members from TextTrackCue to new VTTCue interface.

canvasResolution => Provide css to device pixel ratio through window.screen.canvasResolution

Animated WebP => Support for animated WebP images

Battery Status API => Allows access to see the battery level of the device's battery

Blending of background images => Offers more ways to combine two image layers.

Blending of elements => Offers more ways to combine HTML elements.

CSS Intrinsic Sizing => Extends the CSS sizing properties with keywords that represent content-based "intrinsic" sizes and context-based "extrinsic" sizes, allowing CSS to more easily describe boxes that fit their content or fit into a particular layout context.

Canvas context "alpha" attribute => Allow the specification of a 2D canvas with an opaque backing store (alpha: false).

Canvas rendering from workers => Render a Canvas object (2D or WebGL) from a web worker.

Canvas2D text decoration => Add a textDecoration attribute to canvas 2D contexts, behavior similar to existing "font" attribute: It's a DOMString, parsed the same way as corresponding CSS property (text-decoration).

Compositing and Blending in Canvas 2D => The canvas 2d context has the globalCompositeOperation attribute that is used to set the current compositing and blending operator.

Dart VM => Dart is a new web programming language with libraries, a virtual machine, and tools. It's designed to help developers build fast, structured modern web apps. Dart compiles to JavaScript to run across the entire modern web. The VM is a Chrome feature to optimize Dart's performance.

Exclusions => Define areas inline content should avoid, and how inline content should wrap around them.

Generated Content for Paged Media Module => CSS properties helpful for printed publication. We only implement paged-x / paged-y from the whole spec.

Grid => A two-dimensional grid-based layout system, optimized for user interface design.

IME API => Provides web applications with scripted access to an IME (input-method editor) associated with a hosting user agent.

Lazy layout => Support a system for doing lazy layout based on what elements are visible in the viewport.

Parse SVG as HTML => Switch all SVG parsing to use the HTML parse.

Portable Native Client (PNaCl) => Run C/C++ code compiled to LLVM bitcode on any web page. The code runs inside the Native Client sandbox and has access to the same capabilities as JavaScript via the Pepper APIs.

SVG2 => Implement the new SVG2 features.

Sending Messages to Extensions => Expose a Chrome-specific API to allow websites to send messages to extensions. Only exposed to websites whitelisted by an installed extension.

Shapes => Define arbitrary shapes inside and around which inline content can flow.

Streams API => An API for representing binary data in web applications as a Stream object.

Symbols aka private names => Allows properties to be added to existing objects without the possibility of interference with the existing properties, unintended visibility, or with other uncoordinated additions by any other code.

Touch Action => New CSS properties (based on pointer events) to enable websites to declaratively state how touches should be handled, without necessarily blocking on the main thread. Provides performance and functionality benefits to sites using touch events, while also enabling great pointer event polyfills.

Update devicePixelRatio on zoom => Update window.devicePixelRatio on full page zoom so that it accurately portraitists the ratio between css and device pixels.

Web Animations => A unified model for supporting animation and synchronization on the Web platform.

Web Crypto API => JavaScript bindings for cryptographic operations

Web MIDI API => Defines an API supporting the MIDI protocol, enabling web applications to enumerate and select MIDI input and output devices on the client system and send and receive MIDI messages.

Web Speech API (synthesis) => Enables web developers to incorporate speech synthesis into their web pages.

WebGL Shared Resources => Allow sharing resources between 2 or more WebGL contexts

inputmode => The inputmode content attribute is an enumerated attribute that specifies what kind of input mechanism would be most helpful for users entering content into the form control.

object-fit and object-position => CSS properties that control the position and size of replaced content within the content box

overflow-anchor => Stick the visible view of an element to the bottom/top even as new content expands its size.

DOM Promises (Futures) => Support for Promises in JavaScript

DOM3 mouseenter & mouseleave Events => MouseEvents dispatched when a pointing device is moved onto or off of an Element or one of its descendents. Similar to mouseover and mouseout respectively, but are not cancelable and are not dispatched more than one "round-trip" into an Element's boundary.

Encoding API => Script API to allow encoding/decoding of strings from binary data. Common scenario: decoding a binary data file fetched via XHR into an ArrayBuffer that contains strings encoded as UTF-8.

HTML Imports => Import HTML documents into other HTML documents.

Vibration API => This specification defines an API that provides access to the vibration mechanism of the hosting device. Vibration is a form of tactile feedback.

Media Queries: resolution feature => Allows to query the device pixel count per CSS unit

Proprietary marquee value => overflow: -webkit-marquee

QUIC => An experimental, UDP-based QUIC transport protocol

TLS 1.2 => The latest version of the Transport Layer Security (TLS) protocol

VP9 => VP9 is an open and royalty free video compression standard.

XMLHttpRequest timeout => Exposing the XHR timeout property and sending corresponding events such as ontimeout.

Conditional Rules => Support for the @supports at-rule and the "window.DOM.supports()" API

requestAutocomplete() => Allows a form to be filled out on demand by the browser's autofill. Particularly for mobile applications, this solves the problem of working with long or even multi-page forms. For merchants, this results in improved conversion rates, sorely needed in mobile purchase scenarios.

Custom Elements => Method for registering (creating) custom elements in script.

Font Load Events => A feature that enables applications to know if a web font is really loaded.

Encrypted Media Extensions => Defines a common API that may be used to discover, select and interact with such systems as well as with simpler content encryption systems.

Template Element => HTML template element to allow creating fragment of inert HTML as a prototype for stamping out DOM.

dialog => An HTML element for a dialog box

Gradients => Gradients provide a method to, over a customizable amount of space, transition from one color to another.

Object.observe() => Observe changes to JS objects.

Resource Timing API => Allows web applications to access timing information related to HTML elements.

Shadow DOM => Enables DOM tree encapsulation. Without it, widgets may inadvertently break pages by using conflicting CSS selectors, class or id names, or JavaScript variables.

User Timing API => Helps web developers measure the performance of their applications by giving them access to high precision timestamps.

Web Speech API (input) => Enables web developers to incorporate speech recognition into their web pages.

Custom filters (shaders) => Apply OpenGL shaders to arbitrary DOM elements.

performance.now() => Enables reliable, high-resolution timing of client-side performance.

requestAnimationFrame => Offload animation repainting to browser for optimized performance.

Media Source Extensions => Allows appending data to an /

Pointer Lock (Mouse Lock) => Gives access to raw mouse movement, locks the target of mouse events to a single element, eliminates limits of how far mouse movement can go in a single direction, and removes the cursor from view. Obvious use cases are for first person or real time strategy games.

Track element => Add subtitles, captions, screen reader descriptions, chapters and other types of timed metadata to video and audio. Chrome currently supports the WebVTT format for track data.

WebRTC => Real-time communication in the browser.

position: sticky => position: sticky is a new way to position elements and is conceptually similar to position: fixed. The difference is that a stickily positioned element behaves like position: relative within its parent, until a given offset threshold is met.

CSS Variables => Introduces cascading variables as a new primitive value type that is accepted by all CSS properties, and custom properties for defining them.

Drag and Drop Directories => Allows dragging and dropping entire folders using HTML5 Drag and Drop. Extends the DataTransferItem with a method to get a FileEntry/DirectoryEntry.

Flexbox => A CSS box model optimized for user interface design. In the flex layout model, the children of a flex container can be laid out in any direction, and can "flex" their sizes, either growing to fill unused space or shrinking to avoid overflowing the parent.

Meta Referrer => Using the referrer metadata attribute, a document can control the behavior of the Referer HTTP header attached to requests that originate from the document.

getUserMedia => Local component of WebRTC

datalist => Predefined data/options for controls

Blob => Allows you to construct Blobs directly (var blob = new Blob(["1234"], {type: 'text/plain'})). Blob() constructor also can take ArrayBufferView directly rather than constructing a blob with ArrayBuffer.

Scoped Styles => Boolean attribute for the style element (style scoped). When present, its styles only apply to the parent element.

iframe seamless attribute => The seamless attribute is used to embed and <iframe> in the calling page without scrollbars or borders (e.g. seamlessly)

iframe srcdoc attribute => Gives the content of an iframe as a src context to embed (e.g. <iframe seamless srcdoc="Hello World"></iframe>).

Filters => Apply (SVG-like) filter effects to arbitrary DOM elements.

Regions => Magazine-like content flow into specified regions. iframe[sandbox] attribute => Method of running external site pages with reduced privileges (i.e. no JavaScript) in iframes (<iframe sandbox="allow-same-origin allow-forms" src="..."></iframe>)

Block bindings (let, const, function) => Allows developers to explicitly qualify access to variables within a block.

GamePad API => Gives JS access to a game controller via USB.

MutationObserver => Provides notifications when DOM nodes are rearranged or modified.

Proxies => Proxies are objects for which the programmer has to define the semantics in JavaScript.

Set => Set objects let you store unique values of any type, whether primitive values or object references.

Touch Events => Touchscreen input API, originally introduced by Apple on iOS

WeakMap => WeakMaps are key/value maps in which keys are objects.

Fullscreen API => Programmatically instruct content on the page to be presented in the browser's full screen (kiosk) mode.

Content Security Policy => Allows you to create a whitelist of sources of trusted content, and instructs the browser to only execute or render resources from those sourcesA.

Quota Management API => This API can be used to check how much quota an app/origin is using.

Web Audio API => A high-level JavaScript API for processing and synthesizing audio in web applications

a[download] attribute => When used on an , this attribute signifies that the resource it points to should be downloaded by the browser rather than navigating to it.

File System API => With the FileSystem API, a web app can create, read, navigate, and write to a sandboxed section of the user's local file system.

Navigation Timing API => Allows web applications to access timing information related to navigation and elements.

Page Visibility API => Provides an API to ask whether the current tab is visibile or not. If you, you might want to throttle back action or set an idle state.

Typed Arrays => Buffers for holding binary data and working with WebGL & Audio API: ArrayBuffer, Float32Array , Int16Array, Uint8Array, etc.)

Web SQL Database => API exposing an SQLite database

details & summary => Interactive widget to show/hide content.

Transforms => Enables changing the position of content in 3D space without disrupting the normal flow.

IndexedDB => An asynchronous client-side storage API offering fast access to large amounts of structured data

Runtime error reporting: ErrorEvent. => Unhandled exceptions trigger the 'window.onerror' callback (or 'self.onerror' inside Workers) for centralized handling.

FileWriter => Synchronous API added in Chrome 9 for Workers

WebGL (Canvas 3D) => 3D rendering via the element.

WebP image format support => WebP is an image format that provides lossless and lossy compression for images on the web. WebP lossless images are 26% smaller in size compared to PNGs; lossy is 35% smaller than JPEG.

matchMedia => API for testing if a given media query will apply.

Device Orientation => Provides access to device's physical orientation

FileReader => The FileReader object lets web applications asynchronously read the contents of files (or raw data buffers) stored on the user's computer, using File or Blob objects to specify the file or data to read.

HTTP/2 (SPDY) => A fast, open protocol for transporting web content.

Application Cache => Enables web pages to work without the user being connected to the internet

EventSource => Also called Server-sent Events, these are push notifications from the server received as DOM events.

Geolocation => Provides access to device's physical location

Web Notifications => An API for displaying simple notifications to the user.

Web Storage => Refers to both localStorage and sessionStorage

HTTP Strict Transport Security (HSTS) => Header to inform the browser to always request a given domain over SSL, reducing MITM attack surface area.

Proprietary CSS reflections => -webkit-box-reflect

Proprietary mask properties => -webkit-mask-* (-webkit-mask-clip)

Message Channels => A messaging system that allows documents to communicate with each other regardless of their source domain, in a way designed to not enable cross-site scripting attacks.

CSS 'text' properties => CSS properties used for manipulating text (decoration, line breaking, processing model, ...)

Canvas => Provides an API to draw 2D graphics

Masks => Allows hiding of portions of a visible elements.

Text (Proprietary) => CSS properties used to change how we draw text.

postMessage => Safely enables cross-origin communication.

datalist => Shows a list of pre-defined options to suggest to the user when entering an input element.

Device Motion => Provides access to device's physical motion.

Iterators and Generators => An Iterator is an object that knows how to access items from a collection one at a time, while keeping track of its current position within that sequence. A generator is a special type of function that works as a factory for iterators.

Map => Map objects are simple key/value maps.

Microdata => Microdata is used to nest semantics within existing content on web pages.

for-of loops => Iterates over iterable objects (including arrays, array-like objects, iterators and generators), invoking a custom iteration hook with statements to be executed for the value of each distinct property.

var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://www.chromestatus.com/features.json');
xhr.responseType = "json";
xhr.onload = function(e) {
JSON.parse(e.target.response).forEach(function(feature){
// Badly needs a String.format?
console.log("["+feature.name+"]"+"("+feature.spec_link+") => "+feature.summary);
});
};
xhr.send();
@bobslaede
Copy link

console.log('[%s](%s) => %s', 'foo', 'bar', 'baz')

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment