What’s New in Chrome 83? Trusted Types, Form Controls, and Web Vitals Explained

Trusted Types

DOM‑based XSS is one of the most common web security issues. Chrome 83 adds Trusted Types, which require data to be vetted before being passed to potentially dangerous sinks. For example, assigning a string to innerHTML now throws a TypeError when Trusted Types are enabled because the browser cannot verify the string’s trustworthiness.

const elem = document.getElementById('myDiv');
elem.innerHTML = `Hello, world!`; // Throws TypeError when Trusted Types are on

To work around this, developers should use safe APIs such as textContent or appendChild(), or explicitly create a Trusted Type via a sanitizer like DOMPurify.

// Use a safe function
elem.textContent = '';

// Pass in a trusted type
import DOMPurify from 'dompurify';
const str = `Hello, world!`;
elem.innerHTML = DOMPurify.sanitize(str, {RETURN_TRUSTED_TYPE: true});

// Create an element
const img = document.createElement('img');
img.src = 'xyz.jpg';
elem.appendChild(img);

Updated Form Controls

Chrome and Edge collaborated to improve the visual style and functionality of HTML form controls. The new controls offer a cleaner look, enhanced touch support, better accessibility, and improved keyboard navigation. The image below compares the old and new appearances of several controls.

In addition to the visual refresh, Microsoft contributed better touch handling and accessibility enhancements, along with refined keyboard support.

New Cross‑Origin Policies

To mitigate side‑channel attacks such as Spectre, Chrome now offers an opt‑in isolation environment called Cross‑Origin Isolation, implemented via two new HTTP response headers:

Cross-Origin-Embedder-Policy

Cross-Origin-Opener-Policy

When these headers are present, pages can safely use privileged features like Performance.measureMemory() and the JS Self‑Profiling API, and they also prevent scripts from modifying document.domain.

Web Vitals

Chrome 83 emphasizes the Core Web Vitals—metrics that capture essential aspects of user experience: loading speed, interactivity, and visual stability. The three primary signals are:

Largest Contentful Paint (LCP) – measures perceived load speed by marking when the main content is likely visible.

First Input Delay (FID) – quantifies the delay before the user’s first interaction is processed.

Cumulative Layout Shift (CLS) – measures unexpected layout movement of visible content.

Origin Trials – Measuring Memory

The new performance.measureMemory() API, available through an origin trial, lets developers measure a page’s memory usage and detect leaks.

performance.measureMemory(); // Returns memory usage statistics

Native File System API Updates

Chrome 83 launches an origin‑trial version of the Native File System API that supports writable streams, enabling developers to write files directly to the user's file system. The API also allows file handles to be stored in IndexedDB for persistent state.

async function writeURLToFile(fileHandle, url) {
  // Create a writable stream.
  const writable = await fileHandle.createWritable();
  // Fetch the content.
  const response = await fetch(url);
  // Pipe the response into the file.
  await response.body.pipeTo(writable);
  // pipeTo() automatically closes the destination.
}

Writable streams simplify file writing, and persisting file handles in IndexedDB lets apps remember recent files or reopen the last file the user worked with.