微软的IE浏览器承载了一代人的记忆,很多人第一次接触互联网便是由它完成启蒙。不过微软近些年正在逐渐淘汰IE浏览器,取而代之的是Edge浏览器,微软将停止Office对IE浏览器支持便是重要动作。IE浏览器的结束实际上标志着一个互联网时代的结束,IE浏览器正是因为自身的速度问题才导致被取代的。这也体现了随着互联网的发展,人们对浏览器的性能要求越来越高,IE浏览器作为一个过时的产品被取代是一定的。

对于开发工程师来说,与浏览器打交道的时间是最多的。可大部分工程师只了解它能做什么,而不知道它是如何做到的。了解浏览器如何工作对工程师做性能优化、排查错误、技术选型、网站兼容等都有很大的帮助,今天笔者来给大家分享一下。

4.jpg

一、浏览器介绍

浏览器是用来检索、展示以及传递Web信息资源的应用程序。Web信息资源由统一资源标识符( Uniform Resource Identifier,URI)所标记,它是一张网页、一张图片、一段视频或者任何在Web上所呈现的内容。使用者可以借助超级链接( Hyperlinks),通过浏览器浏览互相关联的信息。

图片1.png

二、五大主流浏览器

Chrome

Chrome浏览器由Google在开源项目的基础上进行独立开发的一款浏览器,目前市场占有率第一。该浏览器基于其他开源软件撰写,包括WebKit。目标是提升稳定性、速度和安全性,并创造出简单且有效率的使用者界面。并且提供了很多方便开发者使用的插件。Chrome浏览器不仅支持Windows平台,还支持Linux、Mac系统,同时它也提供了移动端的应用(如Android和iOS平台)。

Firefox

Firefox浏览器是Mozilla开发的一款网页浏览器,使用Gecko排版引擎。Firefox浏览器是开源组织提供的一款浏览器,它开源了浏览器的源码,同时也提供很多插件,方便了用户的使用。支持多种操作系统,如Windows、Mac OS X及GNU/Linux等。

IE

Internet Explorer简称IE或MSIE,诞生于1994年,是由微软公司推出的网页浏览器,曾是使用最广泛的网页浏览器之一。自从1995年开始,它被内置在各个新版本的Windows作业系统作为默认浏览器,也是微软Windows操作系统组成部分。它的内核是由微软独立开发的,简称IE内核。国内大部分的浏览器都是在IE内核基础上提供了一些插件,如360浏览器、搜狗浏览器等。

Safari

Safari浏览器是Apple公司为Mac系统量身打造的一款浏览器,主要应用在Mac和iOS系统中。它使用了KDE的KHTML作为浏览器的运算核心。Safari也是iPhone手机、iPod Touch、iPad平板电脑的指定默认浏览器。

Opera

Opera浏览器是全球第一手机浏览器的中文品牌产品。Opera浏览器是一款适用于各种平台、操作系统和嵌入式网络产品的高品质、多平台产品。Opera桌面浏览器首创了许多新功能,从而帮助用户提高上网效率,促进创新和网络开发。Opera支持多种操作系统,如Windows、Linux、Mac、FreeBSD、Solaris、BeOS、OS/2、QNX等。

1.jpg

三、浏览器的主要构成 

用户界面(UI)

包括菜单栏、工具栏、地址栏、后退/前进按钮、书签目录等,也就是能看到除了显示页面主窗口之外的部分。

浏览器引擎

用来查询和操作渲染引擎的界面。

渲染引擎

负责展示用户请求的内容。比如请求的内容是HTML,那么该引擎则负责解析HTML和CSS,然后将解析的内容展示在屏幕上。

JS解释器

用来解析和执行JS代码。主要负责处理javascript脚本程序,一般都会附带在浏览器之中,例如chrome的V8引擎。

网络

主要用于网络调用。例如HTTP请求,浏览器提供了平台独立界面以及针对各平台的底层实现。

UI后端

用于绘制基本的窗口部件,比如组合框和窗口等。

数据存储

保存类似于cookie、storage等数据部分,一种完整的轻量级客户端存储技术。

3.jpg

四、浏览器的内核

浏览器内核是什么

浏览器的内核是指支持浏览器运行的最核心的程序,也称"渲染引擎",用来解释网页语法并渲染到网页上。浏览器内核决定了浏览器该如何显示网页内容以及页面的格式信息。不同的浏览器内核对网页的语法解释也不同,因此网页开发者需要在不同内核的浏览器中测试网页的渲染效果。

浏览器内核的构成

渲染引擎

渲染引擎负责取得网页的内容(HTML、XML、图像等)、整理讯息(如加入 CSS 等)以及计算网页的显示方式,然后会输出至显示器或打印机。浏览器内核的不同对于网页的语法解释会有不同,所以渲染的效果也不相同。

JS 引擎

用来解析 Javascript 语言,执行 javascript 语言来实现网页的动态效果。

浏览器四大内核

Trident内核

代表产品为Internet Explorer,是微软开发的一种排版引擎。

Gecko内核

代表作品为Mozilla Firefox,是一套开放源代码的、以C++编写的网页排版引擎。

WebKit内核

代表作品有Safari、Chrome,。WebKit是一个开源项目,它特点在于源码结构清晰、渲染速度极快。

Presto内核

代表作品为Opera,是Opera Software开发的浏览器排版引擎,供Opera 7.0及以上使用。

2.jpg

五、总结

浏览器涉及的概念有很多,不仅繁多而且琐碎,包括网络、渲染、安全,以及大前端相关的大量概念。作为开发工程师,理解浏览器是如何工作的,对我们做业务的技术选型、架构设计等都有非常重要的作用,让我们可以准确评估 Web 开发项目的可行性,站在更高维度审视页面,以及在快节奏的技术迭代中把握住问题的本质。

远齐科技基于成熟的软件架构、互联网、物联网、大数据、人工智能等技术构建面向未来的集成开发平台系统。在自有集成开发平台基础上,基于最佳业务实践开发出丰富的软件功能模块、业务系统,为企业提供高效的定制化开发服务。

上一篇:标准化企业网站建设方案是什么样的? 下一篇:模板网站VS定制网站,企业如何选择?