1. Intersection API
Interserction API 是一种用于异步检测模板元素月视口(或者指定父元素)交叉状态变化的浏览器原生接口,主要那个用于解决传统滚动监听性能差、实现复杂的问题,适用于懒加载、慢点曝光、无线滚动等场景。
2. Page Visibility
Page Visbility API 是浏览器提供的原生接口,用于检测页面在当前浏览器窗口中的可见性状态。其核心作用是 优化资源使用和提升用户体验
3. Web Animation API
Web Animation API 是浏览器原生提供的 JavaScript 接口,用于通过编程方式控制 DOM 元素,替代或补充传统 CSS 。其核心优势在于:
1.精确控制: 允许通过代码动态调整动画属性(如时间、速率、关键帧);
2.性能优化:直接调用浏览器动画引擎,减少主线程负载,提升动画流畅度;
3.交互性增强:结合事件监听,实现复杂的用户交互逻辑(如暂停/恢复、动态调整参数)
4. 监控网络 navigate.connection
5. 拖拽API
draggable 是 HTML5的全局属性,用于标识元素是否允许被拖拽。
6. 音频 audio API
7. 浏览器音频自动播放策略
MEI 是浏览器(如 chrome)用于衡量用户对网站媒体内容消费倾向的算法指标,直接影响有声媒体的自动播放权限。其核心目标是优化用户体验,减少非预期的自动播放干扰,同事允许高参与度网站获取权限。
- 方案一
先尝试自动播放,若发生异常,则引到用户进行交互操作,然后再进行播放 - 方案二
- 先静音播放,然后根据是否能够自动播放觉得是否取消静音,如果:
- 能自动播放,取消静音;
- 不能自动播放,引导用户进行互动操作后取消静音;
8. Clipboard API
Clipboard API 是浏览器提供的 JavaScript 接口,允许网页安全地读写剪切板内容,支持文本、图片、富文本等数据类型。其核心目标是替代已弃用的 document.execCommand(‘copy’)方法,提供更灵活、异步的操作方式。
注意事项:HTTPS强制要求:仅在安全上下文(HTTPS 或 localhost)中可用,首次操作是弹出授权提示。