Vue进阶(幺柒贰):信创浏览器兼容性探讨_vue浏览器兼容性

本文介绍了Vue.js开发中的最佳实践,包括在遇到兼容性问题时的调试方法,以及针对不同类型的项目(如JSP和IE适配)需关注的浏览器兼容性要点。强调了标准化HTML、CSS和JavaScript的重要性,以及主流浏览器及其内核的特点,为开发者提供了提升浏览器兼容性的实用建议和面试准备素材。
摘要由CSDN通过智能技术生成
  1. 在编写Vue.js代码时,遵循Vue.js的最佳实践和规范,以最大限度地确保代码的兼容性和可靠性。
  2. 如果遇到了Vue兼容性问题,请尝试在奇安信浏览器之外的其他浏览器中复测应用程序,以确定是否存在浏览器特定的问题。如果确定是浏览器特定的问题,可考虑使用polyfill或其也解决方案来解决问题。
2.2 浏览器测试范围

此外,浏览器兼容性如果资源充足可能得考虑如下场景:

  1. 浏览器类型;
  2. 相同浏览器类型的不同版本;
  3. 不同的平台操作系统;
  4. 相同平台的操作系统下面的不同架构.;
  5. 信创操作系统以及国内主流的开源浏览器的版本;
  6. 不同版本的应用程序, 对相同或高或者低版本的浏览器的兼容性;
2.3 传统 JSP 项目

对于传统使用JSP的项目,需重点考虑JSP项目中是否使用非标准的HTML元素、CSS属性和JavaScript函数,因为这些可能导致浏览器兼容性问题。

2.4 IE 适配项目

针对前期应用系统主要针对IE运行,鉴于其使用的内核为Trident,同样需重点考虑系统中是否使用非标准HTMLCSSJavaScript

标准HTMLCSSJavaScript是指遵循W3C发布的规范。那么,如何检测项目中是否存在非标准HTMLCSSJavaScript?即如何检测页面为标准页面(指网页由标准HTMLCSSJavaScript构成)?

目前,可通过w3c在线验证:

  • 网页CSS在线验证:将网页与W3C标准比较。标准根据文件宣告的版本而验证,工具会读取DOCTYPE宣告而决定使用的标准。 当验证工具读取到网页及决定使用的标准后,验证工具将会检查错误,例如元素开关的遗漏,引号的遗漏及其他代码错误。 验证工具随后会建立报告,指出文件是否正确。错误则会以列表方式显示。某些错误,例如遗漏元素关闭,可以造成数个,甚至过百个错误。但是网页设计师则只需要处理第一个出现的错误并排除余下连串的错误。
  • 网页HTML在线验证:使用与HTML/XHTML验证工具类似的验证方式,将CSS文件与W3C标准比较。

在这里插入图片描述

在这里插入图片描述

三、主流的浏览器与其内核

浏览器内核指的是浏览器所采用的渲染引擎,其决定了浏览器如何解析HTMLCSSJavaScript代码。此外,不同的浏览器也有各自的默认设置标准遵守程度,这可能导致某些代码在某些浏览器中运行良好,而在其他浏览器中出现问题。

提到Web浏览器,大家首先想到的肯定是IE浏览器,即Internet Explorer,其于2022年6月15日被微软公司永久关闭,IE浏览器停止服务后官方将不再进行安全漏洞维护相关补丁更新

IE内核采用的是Trident内核。它是一种用于处理网页内容的软件组件,负责将HTMLCSSJavaScript代码转换成可视化的网页。IE内核可以被其他浏览器所采用,例如360浏览器、搜狗浏览器等,因此IE内核的稳定性和性能影响了这些浏览器的用户体验。

IE内核的历史可以追溯到1995年,当时微软推出了第一版的Internet Explorer浏览器。随着浏览器市场的快速发展,IE内核也不断更新和优化,逐渐成为了主流浏览器所采用的渲染引擎之一。不过,随着时间的推移,IE内核的性能和安全性逐渐变得不稳定,也因此被许多用户所诟病。

随着HTML5的普及和移动设备的兴起,越来越多的浏览器开始采用其他的渲染引擎,例如WebKitGecko。而IE内核也逐渐退出了浏览器市场的主流地位。不过,这并不意味着IE内核已经消失了,它仍然被许多企业和机构所使用,例如银行、政府机构等。

目前市场上主流的浏览器分为EdgeChromeFirefoxSafari等几大类,它们具有以下特点:

3.1 Edge浏览器

内核是:Chromium

“microsoft edge”是一个浏览器软件;“microsoft edge”是由微软开发的基于Chromium开源项目即其他开源软件的网页浏览器,该浏览器内置与windows10版本中,支持内置Cortana语音功能,内置了阅读器、笔记和分享功能。

微软官方发布公告,称IE浏览器于2022年6月16日正式退役,此后其功能将由Edge浏览器接棒。

3.2 Chrome浏览器

内核是:webkit

Chrome浏览器由Google在开源项目的基础上独立开发的一款浏览器,市场占有率第一,提供了很多方便开发者使用的插件。支持Windows平台,还支持Linux、Mac系统,同时它也提供了移动端的应用(如Android和iOS平台)。

3.3 Firefox浏览器

内核:Gecko

Firefox浏览器是开源组织提供的一款开源的浏览器,它开源了浏览器的源码,也提供了很多插件,方便了用户的使用,支持Windows平台、Llnux平台和Mac平台。

3.4 Safari浏览器

内核:webkit

Safari浏览器主要是Apple公司为Mac系统量身打造的一款浏览器,主要应用在Mac和iOS系统中。

大部分国产的浏览器(qq浏览器,uc浏览器,猎豹浏览器,360浏览器)基本上是在IE浏览器的内核上进行的二次开发。

现在国内市场上有许多双内核的浏览器,使用的是trident,webkit内核。

为了提高浏览器兼容性,建议使用标准化的HTMLCSSJavaScript。标准化代码遵循W3C规范,确保代码在各种浏览器中的一致性和最佳展示效果。此外,避免使用非标准的HTML元素、CSS属性和JavaScript函数,因为这些可能导致浏览器兼容性问题。

四、拓展阅读

最后

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

给大家分享一些关于HTML的面试题。


/618166371)**

给大家分享一些关于HTML的面试题。

[外链图片转存中…(img-qVkOVrYG-1714381413267)]
[外链图片转存中…(img-xlJzAKzB-1714381413268)]

  • 3
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Vue在不同浏览器中的兼容问题主要涉及到ES6 Promise的支持。在使用Vue Cli 2项目中使用Vuex时,如果在IE浏览器中出现了“Vuex requires a Promise polyfill in this browser”的错误提示,这是因为IE浏览器不支持ES6 Promise。为了解决这个问题,可以按照以下步骤进行操作: 1. 首先,需要安装babel-polyfill,可以通过执行以下命令来安装并重启服务器:npm install --save babel-polyfill。 2. 然后,在项目的main.js文件中引入babel-polyfill,可以使用import 'babel-polyfill'来引入。 3. 接下来,需要在webpack.base.conf.js文件中进行配置。找到entry字段,将其中的app数组改为['babel-polyfill','./src/main.js']。这样就在项目的入口文件中引入了babel-polyfill,从而解决了IE浏览器不支持ES6 Promise的问题。 通过以上步骤,可以解决Vue在IE浏览器中的兼容问题。引用<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *3* [vue解决浏览器兼容问题](https://blog.csdn.net/u012632105/article/details/103833989)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] - *2* [详解Vue Cli浏览器兼容实践](https://download.csdn.net/download/weixin_38543749/12925577)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值