为什么需要考虑浏览器兼容,浏览器渲染引擎在浏览器中的作用是什么样的?

为什么需要做浏览器兼容?–渲染引擎在浏览器中的作用

  • Web浏览器的体系结构
    Web浏览器的体系结构
    User Interface:用户界面。可以使最终用户能够与界面上所有可视元素进行交互。
    Browser Engine:浏览器引擎。是浏览器引擎的核心组件,充当用户界面与渲染引擎的中介,根据从用户界面接收到的输入指令查询和处理渲染引擎。
    Rendering Engine:渲染引擎。负责呈现用户在其屏幕上请求的特定网页。每个浏览器都有自己独特的渲染引擎,对于不同版本的浏览器,渲染引擎也可能有所不同。
    Networking:网络。该组件负责使用标准协议(Http或FTP)管理网络调用,并且负责处理与互联网通信有关的安全问题。
    JavaScript Interpreter :JS解释器。负责解析和执行嵌入在网站中的JS代码,生成结果,转发到渲染引擎,展示在用户界面。
    UI Backend:UI后端。用户绘制基本小部件(窗口和组合框)。
    Data Storage/Persistence:数据存储/持久化。网页浏览器需要在本地存储各种类型的数据,例如Cookies,因此,浏览器必须与WebSQL、IndexedDB、FileSystem等数据存储机制兼容。
  • 渲染引擎的作用?
    用户请求到某个特定文档,渲染引擎就开始获取所请求文档的内容,这是通过网络层完成的。渲染引擎从网络层开始接收以8kb为单位的特定文档的内容。下面是渲染引擎的基本流程:
    渲染引擎的基本流程
    (1)渲染引擎以块的形式解析HTML页面(包括CSS文件和样式元素),然后将HTML元素转换为DOM节点,以形成“content tree”或“DOM tree”。
    (2)构建渲染树(Render tree)。该树包括样式信息以及定义元素显示顺序的可视化说明,确保内容以所需的顺序显示。
    (3)layout process 布局过程,计算节点的坐标值的过程。在这个过程中每个节点都被分配了确切的坐标,可以确保每个节点在屏幕上出现在一个精确的位置。
    (4)绘制屏幕。借助渲染器中paint()方法,使用UI后端层绘制屏幕上的每个节点。
    如前所述,每个浏览器都有自己独特的渲染引擎。 所以相对的,每个浏览器都有自己的方式来解读用户屏幕上的网页。 对于 web 开发人员来说,关于他们网站的跨浏览器兼容性问题出现了一个挑战。
    Cross browser testing 跨浏览器测试
    跨浏览器测试是一种质量保证方法,用于验证 web 应用程序在功能和跨多个浏览器设计方面的一致性。 这些测试使 QA 团队能够通过响应式设计测试来探索任何问题,这些测试可能发生在他们的网站通过不同的浏览器浏览器版本访问时。

浏览器内核分类了解

  • Trident【IE内核】:IE
  • Webkit:Safari
  • Gecko:Firefox
  • Blink:chrome(以前是Webkit,现在是Blink,成为chrome内核)、Opera
    fork于Webkit
  • Trident + Webkit:Sogo、360、qq、百度、遨游等
    内核引擎比较
    内核与操作系统
    浏览器种类了解:单内核浏览器、双内核浏览器–转载于https://blog.csdn.net/zhiyuan411/article/details/89098539
  • 双内核浏览器极速模式(Webkit核心)+兼容模式(Trident核心)
    Webkit核心轻量、高效、快速;Trident核心对网银等各种情况均有非常好的兼容性表现
    (1)默认使用速度更快的Webkit核心,遇到兼容性问题,允许用户手工切换至Trident核心。
    (2)对于网上银行、支付宝等特殊网站,双核浏览器普遍采用智能切换技术,即当检测到这些站点时会自动切换到兼容模式
    (3)实现WebKit核心时,例如:在chrome内核升级后,双核浏览器必须拿到chrome内核源码,重新编译测试其浏览器,然后升级双核浏览器本身,才能升级chrome内核。由于同步更新的时间、人力成本过大,所以,一般双核浏览器和chrome的最新版的内核版本,是存在较大的时间差的,双核浏览器的WebKit核心的版本要老旧得多
    (实现Trident核心时,双核浏览器以微软操作系统的webcontrol控件为内核(IE浏览器本身也是以webcontrol控件为内核的),所以,当系统的IE升级或者打了更新补丁后,双核浏览器也就自动具备了这些安全防护或性能优化。双核浏览器的兼容模式和IE,是具有更大程度上的一致性
    综上,对于国内的浏览器应该优先和重点保证极速模式下的测试回归。

手机浏览器

如何进行浏览器兼容测试?

  • 明确产品面向的用户群体,他们的行为习惯等,可以是埋点等方式进行
  • 反馈问题统计
  • 其他
发布了21 篇原创文章 · 获赞 0 · 访问量 1076

猜你喜欢

转载自blog.csdn.net/LittleGirl_orBoy/article/details/105357080
今日推荐