Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save organicaudio/a05314ef5956fa93db189a5ec7747e90 to your computer and use it in GitHub Desktop.
Save organicaudio/a05314ef5956fa93db189a5ec7747e90 to your computer and use it in GitHub Desktop.
Safari 14 Experimental Features - Functions Defined and Explained

Safari 14 Experimental Features - Functions Defined and Explained

COMPLETED CONTENT

############################################################################################

ASTC Texture Support: ASTC stands for Adaptive Scalable Texture Compression, a lossy block-based texture compression algorithm. **Async Frame Scrolling **– Make an iframe scrollable on iOS, or more smoothly.

Accessibility Object Model: The Accessibility Object Model (or called AOM), an experimental JavaScript API that allows developers to modify the browser accessibility tree, has four phases, and supports for phase one recently landed in Chrome Canary behind the flag.

Cache API: The Cache API is a system for storing and retrieving network requests and corresponding responses. These might be regular requests and responses created in the course of running your application, or they could be created solely for the purpose of storing some data in the cache. The Cache API was created to enable Service Workers to cache network requests so that they can provide appropriate responses even while offline. However, the API can also be used as a general storage mechanism.

Constant Properties – Constant properties are initialized at the time of creation and cannot be reinitialized, in other words, new values cannot be pushed. A constant property can be merged, concatenated, combined, zipped, sampled, filtered, and transformed. This iOS 11 Safari Experimental feature prevents you from changing settings in web pages with settings. In other words, preventing website modifications or the changing of their “properties” after they’ve loaded.

CSS display: contents – Removed in iOS 12. The CSS display property specifies the type of rendering box used for an element. It gets rid of HTML from websites but keeps CSS content for the looks. Also, its intelligence enables us to scan HTML to make sure that the minimum CSS can be displayed while stripping the website of its contents.

CSS Spring Animations – This feature emulates website animations as if it is spring, with its websites are season-aware. It works similarly to changing the device date to April in the northern hemisphere.

Fetch API Request KeepAlive: By setting the keepalive flag, a developer can make a fetch which will continue working even when a frame is detached. A web developer can use the feature to report events, state updates and analytics with a small amount of data even when the page is about to be unloaded. This is useful for analytics and other cases where async delivery of data is required without blocking navigations and lessens the need for synchronous XHR which is bad for user experience.

From-Origin Response Header: A way for resources to declare they are unavailable within an embedding context.

The Fullscreen API: Provides an easy way for web content to be presented using the user’s entire screen. The API lets you easily direct the browser to make an element and its children, if any, occupy the full screen, eliminating all browser user interface and other applications from the screen for the duration.

**ImageBitmap and OffscreenCanvas: **The ImageBitmap represents a bitmap image which can be drawn to a without undue latency. It can be created from a variety of source objects using the createImageBitmap() factory method. ImageBitmap provides an asynchronous and resource-efficient pathway to prepare textures for rendering in WebGL. OffscreenCanvas provides more control over how canvases are rendered. This is a follow-on to the WorkerCanvas proposal and will be merged once the agreement is reached.

ITP Debug Mode: Intelligent Tracking Prevention is a privacy feature that detects which domains have the ability to track the user cross-site and either partition the domain’s cookies or purges its website data altogether.

Link Preload – It is mainly for preventing pre-loaded resources from getting cleared once parsing is done. Link Preload also addresses the memory issues that were found to clear preloaded resources in the previous version.

Remove Legacy WebRTC API – Removed in iOS 12. With it, web developers can check whether their websites conform to the latest specifications.

Storage Access API: Allows for authenticated embeds while continuing to protect customers’ privacy by default.

VisualViewportAPI: The Visual Viewport API provides an explicit mechanism for querying and modifying the properties of the visual viewport. 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.

**WebGL 2.0 **is a long-awaited feature upgrade that delivers the OpenGL ES 3.0 feature set, bringing the browser’s graphical capabilities closer to the state of the art.

**Secure Contexts API **– Prevent man-in-the-middle attackers from accessing powerful APIs that could further compromise the victim of an attack.

SubresourcIntegrity – Enable browsers to verify that files they fetch are delivered without unexpected manipulation. It works by allowing you to provide a cryptographic hash that a fetched file must match.

Viewport Fit – Removed in iOS 12. Determine how content is laid out and where text wraps on the web page. The viewport can be larger or smaller than the visible area.

**Web Animations **– Allow disabling and enabling of all web animations, capable of speeding up web browsing by 1.04998%.

WebGPU – Provide hardware GPU acceleration for mobile websites. If your device doesn’t have a GPU, it tried to connect to the nearest free GPU wirelessly within a range of ~4cm.

WORK IN PROGRESS - NEEDS DEFINITION AND USE-CASES

###################################################################################################################

@page CSS at-rule support

Accessibility Object Model

Allow per media element speaker device selection

Allow speaker device selection

Aspect ratio of from width and height

Async clipboard API

Automatic HTTPS Upgrade

Blank anchor target implies rel=noopener

Block top-level redirects by third-party iframes

CSS Aspect Ratio

CSS Custom Properties and Values API

CSS Individual Transform Properties

CSS Overscroll Behavior

CSS Painting API

CSS Spring Animations

CSS Typed OM

CSSOM View Smooth Scrolling

Contact icker API

CoreImage-Accelerated Filter Rendering

WORK IN PROGRESS - CREATE LIST FROM SAFARI MENU

###################################################################################################################

(Continue at D)

WORK IN PROGRESS - CURATED LIST FOR IOS AND MACOS SPECIFICALLY

###################################################################################################################

Enabled by Default - macOS Big Sur

Enabled by Default - iOS 14.6 RC1

WORK IN PROGRESS - SOURCE LIST

###################################################################################################################

SOURCES: Software - Safari for macOS Big Sur 11.3 Software - Safari for iOS 14.6 beta 1 Webpage - https://webkit.org/blog/11340/new-webkit-features-in-safari-14/ Webpage - https://www.imobie.com/support/safari-experimental-features.htm

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