web 系统兼容低版本浏览器 |
您所在的位置：网站首页 › ie8-11版本浏览器下载 › web 系统兼容低版本浏览器 |
|
web 系统兼容低版本浏览器
web 前端或 H5 移动端在开发面向大众的 web 软件时，会不可避免的遇到处理浏览器兼容性的问题。 若在软件开发启动前，已明确要兼容的浏览器种类及相应的最低版本，这时前端技术选型需要考虑不同前端框架会带来这方面的影响，有些硬性指标需要关注的。 比如 vue2 双向绑定底层依赖的Object.defineProperty 只兼容 IE9 及以上版本，vue3 双向绑定底层依赖的Proxy直接放弃 IE 浏览器。废话不多说，切入正题，本文会大概通过以下三步骤介绍处理浏览器的兼容性问题。 收集正在或将要使用的已知 js API 兼容的浏览器及最低支持版本，取交集初步判断大概确定要支持的浏览器种类及最低版本，使用 babel 和 polyfill 应对新语法和 jsapi下载安装不同浏览器的不同版本，测试验证，解决 bug为方便说明，这里以使用 vue3 技术栈为例展开介绍 1. 收集正在或将要使用的 js 新功能特性查阅最新语法或 api 的浏览器兼容性，请访问 caniuse 特性功能\浏览器ChromeEdgeFirefoxSafiriWebassembly57165211Proxy49121810resizeObserve64796913.1replaceAll85857713.1globalThis71796512.1??85857914esm61166011import63796711.1export61166010.1es651155410区分哪些是硬性指标（无法通过现有技术解决），哪些是高级语法，可降级处理；哪些是新 api，可通过 babel/polyfill 处理。 Proxy、webassembly 是硬性指标，不能低于此版本resizeObserve、globalThis、es6 方法，是新 api，可借助 polyfill 兼容处理?? 属于新语法，可通过 babel 结合 preset/env 转译代码降级处理import 和 export 支持按需加载，结合打包工具的tree-shaking功能，可极大提高性能为兼容低版本浏览器，又可享受现代浏览器原生 api 带来的性能优势，综合考量，建议 chrome 64、edge 79、firefox 69 、safiri 13.1 2. babel+polyfill 兼容处理方案此处参考 babel 练习 3. 下载安装不同浏览器的不同版本付费方案：browserstack, 覆盖几乎全平台全浏览器 免费方案如下，折腾但省钱 Chrome 历史版本下载地址mac os 安装多个版本的 chrome防止 chrome 强制自动更新 找到 chrome 的自动更新程序的目录并完整的移出来，可全局搜索关键词GoogleSoftwareUpdate，比如 mac 系统的自动更新目录/Users/chendq/Library/Google Firefoxmac 中可直接下载安装多个不同的版本。 历史版本下载地址 |
| CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |