Can I use
浏览器特性兼容性查询权威参考
前端开发者查询 CSS、HTML、JavaScript API 在各浏览器版本中支持情况的权威参考站,是兼容性调试与渐进增强决策的首选信息源,常与 Browserslist、Autoprefixer 配合使用。
Can I use 浏览器特性兼容性查询技术调研
Can I use 是前端开发者查询 CSS、HTML、JavaScript API 在各浏览器版本中支持情况的权威参考站,由 @Fyrd 维护,是兼容性调试与渐进增强决策的首选信息源,常与 Browserslist、Autoprefixer 配合使用。
一、 基本信息
| 维度 | 关键指标 / 描述 |
|---|---|
| 技术标签 | 兼容性 / Browser Support / CSS / JS API |
| 官方网站 | https://caniuse.com/ |
| 开发商 | Alexis Deveria 及贡献者 |
| 数据许可 | CC BY 4.0(数据) |
| 生态成熟度 | 极高 |
二、 技术定位与简介
Can I use 为每个 Web 平台特性提供:
- 全球使用率加权支持表。
- Chrome、Firefox、Safari、Edge、IE 等版本矩阵。
- 已知问题与 polyfill 链接。
- 相关特性交叉引用。
在调试「某 API 在目标用户浏览器是否可用」时,是第一站查询工具。
三、 快速上手使用说明
- 访问 https://caniuse.com/ 搜索特性,如
flexbox、webp、view-transitions。 - 使用顶部 Settings 自定义目标浏览器列表(与 Browserslist 对齐)。
- 嵌入 MDN 或博客时引用特性页 URL。
- 通过 API(第三方)或导出数据集成内部工具(需遵守许可)。
四、 核心特性
- 覆盖 CSS、HTML5、SVG、JS API、WebRTC 等。
- 使用率数据来自 StatCounter 等。
- 子特性拆分(如 Flexbox 各属性)。
- 多语言界面。
- 与 MDN 互链。
五、 适用场景
适合:技术选型前兼容性评估、polyfill 决策、解释 bug「仅 Safari 复现」、编写 @supports 回退。
不适合:运行时特性检测(用 Modernizr 或 if ('x' in obj))、自动化 CI(用 browserslist + eslint-plugin-compat)。
六、 技术亮点
数据更新频繁;社区认可度高;URL 稳定便于文档引用;与前端心理模型直接对应。
七、 技术局限与边界
- 非运行时检测,数据可能有滞后。
- 企业内网旧浏览器可能偏离全球统计。
- 不替代实际真机测试(BrowserStack)。
- 部分新特性收录有延迟。
- 不涵盖所有非浏览器环境(Electron 版本等需另查)。
八、 生态地图
Browserslist、Autoprefixer、eslint-plugin-compat、MDN、Baseline(web.dev)。
九、 生态集成
package.json browserslist 与 Can I use Settings 一致;PostCSS preset-env;文档中链接 caniuse 特性页。
十、 开发与工程化
引入新 CSS/JS 特性前查 Can I use + 项目 browserslist;不支持则 @supports 或 polyfill;记录决策于 ADR。
十一、 性能与安全
信息查询工具,无运行时开销;注意引用数据许可证 CC BY 4.0 署名。
十二、 技术对比
| 资源 | 用途 |
|---|---|
| Can I use | 特性支持表 |
| MDN | 标准文档+基础兼容表 |
| web.dev Baseline | 现代 Web 基线 |
十三、 最佳实践
- 与 Browserslist 配置同步解读。
- 全球使用率结合产品实际用户分析。
- 关键特性在 BrowserStack 真机复验。
- 文档链接 caniuse 而非凭记忆报版本号。
- 关注「partial support」脚注细节。
十四、 学习与社区资源
- Can I use:https://caniuse.com/
- Browserslist:https://github.com/browserslist/browserslist
- web.dev Baseline:https://web.dev/baseline
十五、 总结
Can I use 是 兼容性调试的信息基础设施,应在特性引入前查询,并与 Browserslist、真机云测形成完整兼容性工作流。