浏览器提供的功能。
1.服务人员
服务工作者本质上充当坐在Web应用程序，浏览器和网络之间的代理服务器（如果可用）。除其他外，它们的目的是为了创建有效的离线体验，拦截网络请求并根据是否可用网络采取适当的措施，并更新位于服务器上的资产。他们还将允许访问推送通知和背景同步API。
What Are Service Workers and How to Use Them?
2. intl
INTL对象是Ecmascript国际化API的名称空间，它提供语言敏感的字符串比较，数字格式以及日期和时间格式。 INTL对象提供了对几个构造函数的访问以及国际化构造函数和其他语言敏感功能共有的功能。
3. WebGL
WebGl（Web Graphics库）是JavaScript API，用于在任何兼容的Web浏览器中呈现高性能交互式3D和2D图形，而无需使用插件。 WebGL通过引入与可以在HTML元素中使用的OpenGL ES 2.0的API来做到这一点。这种符合性使API可以利用用户设备提供的硬件图形加速度。
WebGL
4.网络动画
Web动画API允许同步和定时更改网页的介绍，即DOM元素的动画。它通过组合两个模型来做到这一点：时序模型和动画模型。
Complexity With Web Animations API
5. webrtc
WEBRTC（Web实时通信）是一项技术，它使Web应用程序和站点能够捕获和选择传输音频和/或视频媒体，并可以在浏览器之间交换任意数据而无需中介。构成WEBRTC的一组标准使得可以共享数据并执行电信对等点，而无需用户安装插件或任何其他第三方软件。
6.网络演讲API
Web语音API使您可以将语音数据合并到Web应用程序中。网络语音API有两个部分：语音合法（文本到语音）和语音识别（异步语音识别。）
7. Websocket
WebSocket API是一种先进的技术，可以在用户的浏览器和服务器之间打开双向交互式通信会话。使用此API，您可以将消息发送到服务器并接收事件驱动的响应，而无需对服务器进行轮询。
8.自定义元素
Web组件标准的关键功能之一是能够创建将您的功能封装在HTML页面上的自定义元素，而不必使用长长的，嵌套的元素来完成，这些元素共同提供自定义页面功能。本文介绍了自定义元素API的使用。
9.阴影穹顶
Web组件的一个重要方面是封装 - 能够将标记结构，样式和行为保持隐藏，并与页面上的其他代码分开，以使不同的部分不冲突，并且可以保持代码不错和干净。阴影DOM API是其中的一个关键部分，提供了一种将隐藏的分离DOM附加到元素上的方法。本文涵盖了使用Shadow dom的基础知识。
// Create spans
const wrapper = document.createElement("span");
wrapper.setAttribute("class", "wrapper");
const icon = document.createElement("span");
icon.setAttribute("class", "icon");
icon.setAttribute("tabindex", 0);
const info = document.createElement("span");
info.setAttribute("class", "info");
// Take attribute content and put it inside the info span
const text = this.getAttribute("data-text");
info.textContent = text;
// Insert icon
const img = document.createElement("img");
img.src = this.hasAttribute("img")
? this.getAttribute("img")
: "img/default.png";
img.alt = this.hasAttribute("alt")
? this.getAttribute("alt")
: "";
icon.appendChild(img);
10.页面可见性API
页面可见性API提供了您可以注意的事件，您可以知道何时可见或隐藏文档，以及查看页面当前可见性状态的功能。
这对于通过让页面避免在文档不可见时避免执行不必要的任务来节省资源和提高性能特别有用。
暂停页面上的音频
当用户切换到其他选项卡时，此示例会暂停音频，并在切换后播放。
html
<audio
controls
src="https://mdn.github.io/webaudio-examples/audio-basics/outfoxing.mp3"></audio>
javascript
const audio = document.querySelector("audio");
// Handle page visibility change:
// - If the page is hidden, pause the video
// - If the page is shown, play the video
document.addEventListener("visibilitychange", () => {
if (document.hidden) {
audio.pause();
} else {
audio.play();
}
});
11.广播频道API
广播频道API允许浏览上下文（即Windows，Tabs，Frames或Iframes）和工人之间的基本通信。
// Connection to a broadcast channel
const bc = new BroadcastChannel("test_channel");
12.地理位置API
GeOlocation API允许用户在Web应用程序中提供其位置。出于隐私原因，要求用户允许报告位置信息。
希望使用地理位置对象的webextensions必须在其清单中添加“地理位置”权限。用户的操作系统将促使用户在请求时允许位置访问。
13.文件系统访问API
文件系统访问API允许读取，写入和文件管理功能。
访问文件
以下代码允许用户从文件拾取器中选择文件，然后测试以查看返回的句柄是文件还是目录
// store a reference to our file handle
let fileHandle;
async function getFile() {
// open file picker
[fileHandle] = await window.showOpenFilePicker();
if (fileHandle.kind === 'file') {
// run file code
} else if (fileHandle.kind === 'directory') {
// run directory code
}
}
以下异步函数会呈现一个文件选择器，一旦选择了文件，请使用getfile（）方法检索内容。
const pickerOpts = {
types: [
{
description: 'Images',
accept: {
'image/*': ['.png', '.gif', '.jpeg', '.jpg']
}
},
],
excludeAcceptAllOption: true,
multiple: false
};
async function getTheFile() {
// open file picker
[fileHandle] = await window.showOpenFilePicker(pickerOpts);
// get file contents
const fileData = await fileHandle.getFile();
}
14. Web共享API
Web共享API提供了一种与用户选择的任意共享目标共享文本，链接，文件和其他内容的机制。
下面的代码显示了如何使用navigator.share（）共享链接，触发按钮单击。
const shareData = {
title: 'MDN',
text: 'Learn web development on MDN!',
url: 'https://developer.mozilla.org'
}
const btn = document.querySelector('button');
const resultPara = document.querySelector('.result');
// Share must be triggered by "user activation"
btn.addEventListener('click', async () => {
try {
await navigator.share(shareData)
resultPara.textContent = 'MDN shared successfully'
} catch (err) {
resultPara.textContent = `Error: ${err}`
}
});
16. WebXR设备API
webxr是一组标准，用于支持为呈现虚拟世界（虚拟现实或VR）或将图形图像添加到现实世界（增强现实或AR）的硬件（虚拟现实或VR）设计的硬件（AR） 。 WebXR设备API实现了WebXR功能集的核心，管理输出设备的选择，以适当的帧速率将3D场景渲染到所选设备，并管理使用输入控制器创建的运动向量。
。