五大主流浏览器及四大内核

article/2025/9/29 0:53:02

目前最为主流浏览器有五大款

1、IE浏览器(Internet explorer)2、火狐浏览器(Firefox)3、谷歌浏览器(Chrome)4、苹果浏览器(Safari)5、欧朋浏览器(Opera)

浏览器渲染引擎工作原理 

浏览器内核包括渲染引擎和JS引擎,由于js引擎越来越独立,内核就倾向于只指渲染引擎

  渲染引擎是一种对HTML文档进行解析并将其显示在页面上的工具。它负责取得网页的内容(HTML、XML、图象等等)、整理信息(例如加入CSS等),以及计算网页的显示方式然后会输出至显示器或打印机

渲染引擎工作流程

HTML解析器解析DOMM树(解析为DOM树上个节点,同时解析CSS样式)

渲染树结构(具有一定的视觉效果,并按照一定顺序排列在屏幕上)

布局渲染树(为每个节点分配固定坐标)

绘制DOM树(渲染引擎会遍历所有的节点,由UI后端绘制)

四大主流内核

1、Trident 代表作:IE

介绍:元老级内核之一,由微软开发,并于1997年10月首次在ie 4.0中使用,凭借其windows垄断优势,Trident市场占有率一直很高。然而垄断并非,没有竞争就没有进步,长期以往,Trident内核一度停滞不前,更新缓慢,甚至一度与W3C标准脱节。2011年,从ie 9开始,Trident开始支持HTML5和CSS 3,因此我们也经常会看到有些网站在浏览时会提示用户(在Internet Explorer 9.0+以上浏览效果最佳)。前端程序员做浏览器兼容一般也不再会考虑ie 8之前的浏览器了。

2、Gcko 代表作:Mozilla

介绍:元老级内核之一,由Netscape公司Mozilla组织开发。1998年,Netscape在于IE浏览器竞争失利之后,成立了非正式组织Mozilla,由其开发新一代内核,后命名为“Gecko”。FireFox也是这班人开发出来了,因此这也就是Mozilla一直使用的内核。

Gecko的特点是代码完全公开,因此其开发程度很高,全世界的程序员都可以为其编写代码,增加功能。

3、Webkit 代表作:苹果 & 谷歌旧版本

介绍:这是苹果公司开发的内核,也是其旗下产品Ssfari浏览器使用的内核。Webkit引擎包含了WebCode排版引擎和JavaScriptCode解析引擎,分别是从KDE的KHTML和KJS衍生而来,它们都是自由软件,在GPL条约下授权,同时支持BSD系统开发。

Chrome、360极速浏览器以及搜狗高速浏览器也使用Webkit作为内核(在脚本理解方面,Chorome使用自己研发的V8引擎)。

4、Blink 代表作:谷歌 & Opera

介绍:这是由Google和Opera Software开发的浏览器排版引擎,Google计算将这个渲染引擎作为Chromium计划的一部分,并且在2013年4月公布了这一消息。这一渲染引擎是开源引擎Webkit中WebCore组件的一个分支,并且在Chrome(28及往后版本)、Opera(15及往后版本)浏览器中使用

5、Presto 代表作: ( Opera前内核 已经废弃 )

参考链接:五大主流浏览器及四大内核 - Moon65 - 博客园


http://chatgpt.dhexx.cn/article/Ff7dtS2j.shtml

相关文章

五大主流浏览器概况

什么叫浏览器? 浏览器是用来显示在万维网或局域网等内的文字、图像及其他信息的软件,它还可以让用户与这些文件进行交互操作。浏览器是电脑上网时经常使用到的应用软件,浏览器正是Internet时代的产物,随着电脑操作系统的普及、Int…

Bootrap 项目实战(微金所前端首页)第一部分

微金所前端首页成果图:(这是本人自己按照微金所官网首页,采用Bootrap,JS,JQuery,css制作的网页效果图,在第二部分我会公布网页源代码) 如需网页源代码,请在下方留言,备注你的qq邮箱。…

发现一个移动端app开发神器

作为一个移动端的开发人员,为了不让自己所被淘汰,一直对移动端的开发的潮流进行着关注。真心感觉移动端开发的技术变革是越来越快,前些年还如火如荼的Android和Ios原生开发,这两年不说消声灭迹,市场前景也是大不如前了…

移动端知识整理

基础知识 1.1 屏幕 移动设备与PC设备最大的差异在于屏幕,这主要体现在屏幕尺寸和屏幕分辨率两个方面。 通常我们所指的屏幕尺,实际上指的是屏幕对角线的长度(一般用英寸来度量)如下图所示 而分辨率则一般用像素来度量&#xff…

bootstrap案例解析

一、由于案例比较长我们先简单分析首页中header 部分的制做情况。 <!DOCTYPE html><html lang"zh-CN"> <head> <meta charset"utf-8"> 二、下面表示用最新的的浏览器解析网站代码&#xff0c;为了保证网站解析效果的完整性 <…

互金累计融资近千例 借贷行业融资数量居首位

互金累计融资近千例 借贷行业融资数量居首位 2017-07-04 雪茹 互金通讯社 “截至2017年6月&#xff0c;互联网金融行业共发生973例融资&#xff0c;融资金额高达约1506亿元。其中借贷行业融资案例数量居首位&#xff0c;共发生302例&#xff0c;融资金额约492.03亿元。 互金通讯…

模板引擎

使用模板引擎可以解决问题&#xff0c;代码的偶合度&#xff0c;代码的修改与维护。 模板引擎&#xff1a;把数据转成html格式的字符串 使用原生语法 官网 使用方法&#xff1a; 1.下载导入 2.创建模板 <script type"text/template" id模板id名></script&…

电商移动Web实战项目(5)

响应式 什么是响应式布局 响应式布局&#xff08;respond layout&#xff09;是Ethan Marcotte在2010年5月份提出的一个概念&#xff0c;简而言之&#xff0c;就是一个网站能够兼容多个终端&#xff08;手机、平板、pc电脑、手表&#xff0c;电视&#xff09; ——而不是为每个…

响应式开发

一、网页布局方式响应式开发 1、固定宽度布局&#xff1a;为网页设置一个固定的宽度&#xff0c;通常以px做为长度单位&#xff0c;常见于PC端网页。 2、流式布局&#xff1a;为网页设置一个相对的宽度&#xff0c;通常以百分比做为长度单位。 3、栅格化布局&#xff1a;将网页…

css进阶

1 选择器的进阶 1.1 后代选择器 根据HTML的嵌套关系&#xff0c;选择父元素后代中满足条件的元素 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta http-equiv"X-UA-Compatible" content"…

linux 升级php 5.3,Linux PHP5.3升级PHP5.5.33 (CentOS)

由于要使用了laravel5.1&#xff0c;php要升级到5.5以上。具体环境是Aliyun Cent OS 7.0。由于阿里的yum源lastest只有5.4&#xff0c;laravel5.1必须php5.5&#xff0c;加了几个网上的yum源&#xff0c;各种各样的问题&#xff0c;所以只能麻烦的编译安装了。 首先网上这类的文…

BAT三巨头之云产品角逐

前言 BAT是中国互联网公司百度公司(Baidu)、阿里巴巴集团(Alibaba)、腾讯公司(Tencent)三大巨头首字母缩写。早期BAT三巨头都有各自的产品定位和势力范围而且是各自领域的老大&#xff0c;百度提供LBS基于位置&#xff08;map&#xff09;和探索(探索引擎)的服务&#xff0c;阿…

北大软微学院计算机金融方向考研,北大软微金服方向2016年考研经验贴---初试410分...

2016-3-29 08:50:55 上传 2016考研经验贴 ---北京大学软件与微电子学院金融信息服务方向 请大家重点看贾晓鸣学长的经验帖和刘洋学长的导学视频&#xff0c;我定位这篇经验贴是我的一些心得补充&#xff01;我先介绍自己的情况&#xff0c;我今年的初试总分是410&#xff0c;专…

BootStrap---day02、03微金所项目

BootStrap---day02、03微金所项目 前两天没有更新&#xff0c;主要是因为做项目做得没有心情来写博客了&#xff08;真的很菜&#xff09;&#xff0c;今天的任务都做完了&#xff0c;就来写一写这几天使用BootStrap写项目的总结和心得。 一、实现功能 1、模态框 2、响应式…

个人练习小览---《微金所仿站》

这个2016年12月份的联系,主要使用了bootstrap来进行练习,熟悉bootstrap怎么操作。 这个网站未完成全部,主要就是熟悉bootstrap的模块操作。 index.html <!DOCTYPE html> <html lang="zh-cn"> <head><meta charset="utf-8">&…

案例——微金所页面

1.效果图 2.整体页面结构块 <!--顶部通栏--> <header class"wjs_header"></header> <!--导航--> <nav class"wjs_nav"></nav> <!--banner轮播图--> <div class"wjs_banner"></div> <…

干货|软件测试简历的编写以及注意事项

小编热衷于收集整理资源&#xff0c;记录踩坑到爬坑的过程。希望能把自己所学&#xff0c;实际工作中使用的技术、学习方法、心得及踩过的一些坑&#xff0c;记录下来。也希望想做软件测试的你一样&#xff0c;通过我的分享可以少走一些弯路&#xff0c;可以形成一套自己的方法…

软件测试简历,这一点你是否漏掉

几乎所有的测试简历都在长篇大论谈如何做测试&#xff0c;参加过多少项目的测试&#xff0c;测试过程是怎么样的&#xff0c;测试如何管理&#xff0c;会黑盒、白盒、灰盒、彩盒.....、会写方案、测试用例。从这些内容中我无法看出你会什么&#xff0c;技术上哪些是你的强项&am…

前端开发_开发软件Hbuilder简介

一、Hbuilder简介 (1):软件简介 HBuilder是DCloud&#xff08;数字天堂&#xff09;推出的一款支持HTML5的Web开发IDE。 HBuilder的编写用到了Java、C、Web和Ruby。HBuilder本身主体是由Java编写&#xff0c; 它基于Eclipse&#xff0c;所以顺其自然地兼…

程序员,你的简历应该这样弄

原文地址&#xff1a;http://www.devstore.cn/essay/essayInfo/5557.html 这个可以帮助一些比较纠结的人改善下简历。 特别说明&#xff1a; - 本文写于2015年11月&#xff0c;当时我在找工作&#xff0c;据此优化简历&#xff0c;每投必中。当时我还写了求职相关的其它文章&a…