本系列文章状态:未完结 ...,更新中 ...,目录尚不完整,但提前发布请大家参考并提出意见,如果属实我会修改,谢谢!``今日更新内容 -> "浏览器如今的状态",明日更新内容 -> 初窥浏览器的渲染机制

目录

  • 前言:
    • -1).什么是`编程之路核心技术卷•Web技术内幕`?:
    • -2).为什么要写`编程之路核心技术卷•Web技术内幕`?
    • -3).怎样写`编程之路核心技术卷•Web技术内幕`这个系列?
    • -4).声明
    • -5).联系我们
  • 一.浏览器渲染机制(以 Webkit 为例)
    • -1).浏览器的概述:
      • ①.什么是浏览器?
        • 万维网(World wide web)
          • 超文本标记语言
          • 统一资源标识符(Uniform Resource Identifier : URI)
            • -1).`统一资源定位符(URL)`
            • -2).`统一资源名称(URN)`
      • ②.浏览器的简史!
      • ③.浏览器如今的状态
    • -2).初窥浏览器的渲染机制
  • 二.TCP/IP/HTTP/HTTPS 技术详解
  • 三.Web 安全
  • 四.Web 性能优化
  • 五.参考文献:

前言:

-1).什么是编程之路核心技术卷•Web技术内幕?:

编程之路核心技术卷•Web技术内幕是一个系列文章,主要涉及
-1).浏览器渲染机制(以 Webkit 内核为例)。
-2).TCP/IP/HTTP/HTTPS 技术详解。
-3).Web 安全
-4).Web 性能优化
等领域。所以本篇文章也就分为四大板块与其下的若干小版块组合而成。

-2).为什么要写编程之路核心技术卷•Web技术内幕?

历史上的重大事件与一些积极向上的事物出现究其原因无不是其内部矛盾运动的结果,是把人逼到一定分上忍无可忍。本篇文章也不例外,当我打算重学前端的时候,发现自己上网查阅的资料(例如浏览器的渲染引擎的渲染机制等 … )就发现铺天盖地的都是模棱两可,当然也不乏有些文章让你赏心悦目,技术点论述的准确性与精准度拿捏得恰到好处。但是更多的还是彼此抄袭,譬如博客之间的文章移植、从某某书上的文章移植等 …。这是让人绝对受不了的,我们去网上查阅知识难道就是为了看这些模棱两可、这些彼此抄袭的结果吗?这绝对是让人难以忍受的!于是笔者决定由本人牵头写一篇系统阐述关于脱离代码以后的代码运行环境的运转机制及其相关技术的博文,来弥补自己在 Web 知识方面的不足,也为需要这篇文章的朋友提供一盏明灯!

-3).怎样写编程之路核心技术卷•Web技术内幕这个系列?

笔者打算通过以已经出版的书籍为引(因为这些书籍往往已经经过校验,可信度较高)结合以其他资源与实践结果来论述每一个知识点并且会对内容做适当的扩充。会将一些专业术语做最直白的解释以此来方便理解,在创作期间真诚的希望大家可以多给笔者提些意见与建议,笔者深深知道一篇正确的、专业的、能被大家广泛接受的文章的出现离不开群众的意见与支持,在前言末尾笔者会给出笔者的联系方式!一句话。这个系列由衷希望您来参与,一起将它完善来帮助更多的人!!!

-4).声明

-1).本系列文章版权归本书作者及其协作者所有,原创作品不易,未经作者允许擅自传播、占有等具有违法性质的行为的,应当承担相应的侵权责任!
-2).本系列文章由作者希望大家共同创建,欢迎来稿、意见与建议。作者会将每一节采纳的意见与建议者名字署在上面,对本系列文章贡献巨大者在本书封面会署上诸位的名字!
-3).本系列文章以 CSDN 平台首发。

-5).联系我们

笔者 QQ: 1848661762
笔者 weChat: LJ521JJJ
笔者的技术群:

一.浏览器渲染机制(以 Webkit 为例)

-1).浏览器的概述:

①.什么是浏览器?

浏览器(Web Browser) 是用来检索并展示万维网信息资源的应用程序。这些信息资源可以是网页、影音、图像等其他内容,他们由统一资源标识符标志,信息资源中的超链接可以使用户方便的浏览相关信息。
一句话,当我们在一个页面提交了一个表单、点击<a href="??">Xxx</a>、亦或是通过 Ajax 向后台提交数据,就会向服务器发送一个请求,服务器接收请求后会返回相应资源,比如网页、影音、图像等,但是值得注意的是,我们看到的网页与图片等资源绝对不是服务器直接返回的成品,而是一些数据与指令(半成品),最后经过浏览器的加工后才会变成我们平常浏览的页面或者图片的样式,否则你看的仅仅只会是"火星文"尽管这样理解不是特别严谨,但是鉴于许多概念我们都还没有介绍所以不妨暂且先这样理解着,在以后的章节中我们将会详细讲述。

浏览器主要具备形式:
界面:
-1).具有"上一页"、"下一页"按钮。
-2).“刷新按钮”
-3).“主页按钮”
-4).“地址栏”
-5).“可显示源码的控制台”
其他:
-1).支持 Cookie
-2).支持 HTTPS 等超文本传输协议
-3).支持扩展开发
-4).支持调试
-5).支持解析与渲染 DOM 的机制
…(那这个万维网是什么呢?)

万维网(World wide web)

万维网就是由许多相互链接的超文本组成的系统,并且万维网与互联网不是同等的概念,万维网只是靠着互联网运行的一项服务,是由统一资源标识符(URI)连接的文件和其他资源的全球集合(我们可以通过 URI 来互相访问对方或其他人的资源这样就将散落的资源整合了起来构成一张动态的资源网,这就是万维网的真谛)。而互联网则是全球相互连接的计算机网络系统。(那什么又是超文本标记语言统一资源标识符(URI)呢?)

超文本标记语言

我们想要理解什么是超文本标记语言就必须要先理解什么是超文本。
所谓超文本就是指一种可以显示在计算机或者其他电子设备上的文本,但是其中的文字、图片等可以链接到其他的字段或者文档,允许从当前阅读位置直接切换到链接的所指位置。(借用一下 维基百科 中的图)理解的会更加形象:

文本的某一段、某一部分可以链接到其他的文档或其他资源,这样这个文本本身就超出了其作为一个普通文本的意义,所以称之为:超文本。典型的就是 HTML文本
接下来再来简述一下超文本标记语言(HyperText Markup Language):相信我们都已经习惯称其为 HTML了吧!

HTML 描述的是一个网站的语义结构,通过HTML标记来描述着一个页面的元素,并通过浏览器的解析(这一编我们的重点)与渲染最终呈现出来我们日常见到的图形化界面,但是仅仅有 HTML 还是不够的,因为此时仅仅有了框架,没有 样式(借指 CSS) 与 功能(借指 JavaScript),其还只是一堆(可能带有超链接)的文字。所以 HTML 是房子结构、CSS 是房子的装饰、JavaScript 就是房子内部各个模块的功能的实现了。但是 HTML 作为标记语言却绝不是一门编程语言这一点要切记!虽然 HTML 通过 < ... >标签里面包裹着 HTML 元素来诠释网页内容,但浏览器不会将他们直接显示在页面上而是要经过解析等一些列工作 …。
HTML 的发行版本:
-1).1995 年 11月 24 日(HTML 2.0)
-2).1997 年 1月 4 日(HTML 3.2)
-3).1997 年 12月 18 日(HTML 4.0)
-4).1999 年 12月 24 日(HTML 4.01)
-5).2014 年 10月_28 日(HTML 5)
H5 logo:

统一资源标识符(Uniform Resource Identifier : URI)

=> URI 是一个用来标识某一互联网资源名称的字符串。该种标识允许用户对网络中的资源通过特定的协议进行交互操作。
=> URI 有三种表现形式:一种表现为统一资源定位符(Uniform Resource Locator : URL)
另一种表现为统一资源名称(Uniform Resource Name : URN)
还有就是既是 URL 同时也是 URN。
=> URI 具有相对于绝对之分。

  • 绝对 URI : 通常是指通过HTTP等协议访问的网络资源绝对路径,像我们日常见到的就属于绝对 URI => https://edition.cnn.com/
  • 相对 URI : 通常分为两种情况:
    -1).链接同台机器中的资源(例如上层路径"…/") =><img src="../icons/logo.png" alt="logo">
    -2).或者链接本文本内的某部分 => 例如瞄点链接(书签链接) =>
<a href="#bottom">返回页尾</a> <a name="top">
...
<a name="bottom"><a href="#top">返回顶部</a>
-1).统一资源定位符(URL)

实际上我们说这个我们日常最熟悉的 URL ,就是我们将要获取的网络资源所在的地址。言外之意就是我们是通过网络地址来定位我们具体想要的资源。

-2).统一资源名称(URN)

URN 定义的比较模糊,但实际上其就是为可能的事物添加一个全球独一无二标识。例如每本书后面的 ISBN(国际标准书号)

或者ISSN(国际标准连续出版物号)

再或是 UUID 相信学过 Java 的朋友都会经常用到这个吧!
=> UUID是由一组32位数的16进制数字所构成,故UUID理论上的总数为1632=2128,约等于3.4 x 1038。也就是说若每纳秒产生1兆个UUID,要花100亿年才会将所有UUID用完。UUID具有唯一性,重复UUID码概率接近零,可以忽略不计。
实际上与 URL 不同的就是无需通过路径等条件通过这个唯一标识也精准的定位到了这个目标资源。值得注意的是:
-1).URN 标识的资源并不一定是可用的,但是保持全局唯一和持久性,即使资源已经不存在或者变得不可用其标识仍然不能被取消,名义上依然有效!
-2).这个 URN 还有一个作用就是便于记录,倘若你需要的目标资源不仅仅在这台服务器上有,在其他服务器上也有甚至存在于更多的服务器当中,如果我们通过 URL 的方式来访问的话就会有多种 URL 不便于记录,仔细想想我们要获取的目标资源本质上都是一样的如果给其一个 URN 是不是就什么都解决了呢?我们只需记住这个通过 URN 标识的标志即可。
-3).同一个事物其版本/形态的不同其 URN 也不同,以书为例。
(平装本、精装本、电子书各自具有不同的ISBN)。
=> URN 特性:
-1).全局性:URN 是在全球范围内有意义而不是仅仅在某些国家或者某个地区有意义。
-2).唯一性:永远不会将一个 URN 分配给两个不同的资源。
-3).持久性:无论被标识资源存在与否,其都一直存在,这是从纵向、历史的角度而言的。
-4).可扩展性:URN 分配给任何可能分配的资源。随着时间的推移,其在网络中发挥的作用越来越重要了,但也不仅仅限于互联网领域,譬如:ISBN、ISSN 就可见一斑了。

URI:
URI组成 : schema://host(服务器地址):port(端口)/path/fileName(资源路径)#fargment
在这里:
https://是协议,
localhost 是服务器地址
63342是端口
/Browser%20Exploration/html/TestURI.html 是路径
?_ijt=mvt1vbkadlkl164jmg0m50oaad是查询的参数
#apple代表资源
为什么说#apple代表资源呢?
请看下图:




#apple直接定位到具体的内容,如果结尾不加#apple则效果与第三幅图一样,当加上了#apple则直接定位到具体内容。


URL:
URL组成 : schema://host(服务器地址):port(端口)/path/fileName(资源路径)

计算机中的地址。


https://是协议,
www.runoob.com是域名,可以解析出目标 IP 地址(具体怎么解析的我们放在后面的章节来详述)
/jsp/jsp-tutorial.html是地址,由于其后面没有# ...所以不能定位到具体资源的具体内容,只能锁定具体资源。


URN:
URN组成:urn:<NID>:<NSS>

三者的关系:

-1).URL 与 URN 是 URI 的子类,所以 URI 可以表现为 URL 也可以表现为 URN 甚至可以表现为二者的交集。
-2).URI 用来主要强调访问的资源本身而 URL 主要强调资源的路径URN 则是强调资源的名称(唯一标识)。三者都可以定位到资源。
-3).在无法弄清当前使用的到底是哪一种就请统称为 URI ,因为这样表述是绝对没有问题的并且这也是官方的判定的未来趋势--[联合W3C / IETF URI规划兴趣小组的报告]!

②.浏览器的简史!

  1. 1990 年,Tim·Berners-Lee(蒂姆·博纳斯-李)在 NextStep 网络系统开发出了世界上第一个网络服务器 Httpd 与 第一个客户端浏览编写程序 World wide web(WWW),后改名为 Nexus。
  2. 在此之后,Lee 又相继制定了 URIS、HTTP、HTML 等规范。并在美国麻省理工学院成立了非营利性互联网组织 W3C。
  3. Marc Andreessen(马克·安德森) 在 1993年美国伊利诺州的伊利诺大学的 NCSA 组织,发表了 mosaic 浏览器。这是第一款第一次可以显示图片的浏览器。其中,Marc Andreessen 是 mosaic 浏览器的开发的中心人物。
  4. 后来 NCSA 公司将 mosaic 的商业运营权转让给了 Spyglass 公司。该公司又向包括微软在内的多家公司进行授权,允许其在 mosaic 浏览器的基础上开发自己的产品。
  5. 1994 年,Marc·Andreessen 与 Jim·H·Clark(吉姆·克拉克)共同创立了 Netscape(网景)公司。建立此公司的目的就是为了打破 mosaic 的垄断地位。然后召集了原来从事 mosaic 浏览器的开发的工作的原班人马,共同打造一款新的浏览器但是没有使用 mosaic 浏览器的任何一行相关的代码。但是其在安全与质量方面大大提高。速度也是 mosaic 浏览器的 10 倍,这款浏览器的名称就叫做 Navigator(导航者)。
  6. 1995 年,网景公司的 Navigator 浏览器与微软的 Internet Explorer(IE) 浏览器展开了一场浏览器之战,但就在 Navigator 的气势节节攀升之际,微软将自己的 “IE” 浏览器绑定在了 Microsoft 的 Windows 系统中,最后以微软的 Internet Explorer 浏览器胜出。
  7. 1998 年,网景公司的 Mozllia 组织成立,同年开源 NN 源代码并改写全部源代码,但是网景公司还是被 American On Line(AOL;美国在线) 收购。
  8. 2003 年,Mozllia 组织更名为 Mozllia 基金会(非牟利机构),同年苹果发布 safari 浏览器。
  9. 2005 年,Mozllia 基金会成立 Mozllia 子公司其目的之一就是推广 FireFox 浏览器 与 Thunderbird(雷鸟) -> (Mozllia 的邮件工具)。同年 11 月 FireFox1.5 正式版上线,迫使 “IE” 浏览器的市场占有率降为原来的 85% 。同时苹果开源了 safari 的源码。
    10.可能早在 2006 年,Chromium 是 Google 公司为发展自家的 Google Chrome 浏览器而开启的计划(著名的 Chromium 计划)。所以 Chromium 相当于 Chrome 浏览器的实验版,新功能会率先在 Chromium 上试验,待验证后才会被应用到 Chrome 中。故 Chrome 的功能可能会相对落后但是较为稳定。(Chromium 计划中,Chromium 浏览器应用的浏览器内核是融合了 Webkit 与 Gecko 量大浏览器内核与 Google 独家研发的 V8 JavaScript 引擎 以提升解释 JavaScript 的效率。并设计了沙盒、黑名单、无痕浏览等功能来实现稳定与安全的网页浏览环境)。
    11.随着时间的推移,当今浏览器市场已经形成三组鼎立之势,(Webkit/blink Chrome、Gecko FireFox、Trident Internet Explorer) 其中,Google Chrome 浏览器在今后的 28 及其以后版本采用 blink 排版引擎、Opera(15及其往后版本)表示跟进,而微软也逐渐放弃了 Trident 内核,在新版的 EDGE 浏览器中采用的 Chrome 的内核。

=> 感言:纵观浏览器发展的简史,科技的变化日新月异这自然不必说,值得我们广为学习的一点同时也是深深触动笔者的就是 Mozllia FireFox 的崛起之路 … 。在 95 年那场浏览器之争中尽管其已经失去了绝对优势,尽管在这之后它渐渐的淡出了人们的视线,看着一个又一个浏览器的问世与衰败,但是心并为死掉,而是以更加强势的姿态以更加开阔的胸怀,强势回归,回归之初就使得 IE 迫降市场份额,并逐渐与 Google 的 Chrome 与 Microsoft 的 Internet Explorer 三分天下。置之死地与后生方显男儿本色, 如今 FireFox 浏览器的图标一只浴火的狐狸,透着些许愤怒与狡黠,大概有两层意思,其一便是对当初浏览器之争失败的愤怒,强势回归,其二便是浴火重生、花开不败!
即使在现在我们依然可以看到 FireFox 浏览器镶嵌的 Mozllia 之书
Mozllia 之书并不真有其书,其实隐藏在 Netscape 和 Mozllia 中的引文写的颇有启示文学的风格,就像是圣经当中的启示录,当用户在 FireFox 浏览器的地址栏处键入 about:mozllia之时,根据浏览器的版本就可以看到不同版本的 Mozllia 之书。
下面分别截图列举一下(迄今为止官方公布的 7 则)。
1.出现在 1995 年的 Navigator 1.1 中

译为:

“野兽”指的是Netscape;“不信者”指的是不跟随Netscape标准的用户;“闪烁”则可以指Netscape Navigator 3或以下的源代码查看器,或由Netscape引进、有争议性的HTML Blink元素。

2.出现在 1998 年的 Netscape 6 至 7.1 中,

译为:

这章节指的是1998年3月31日,即Netscape开放源代码的日期。“野兽变得无所不在”是指Netscape想凭借开放源代码,而吸引大量的开发者改善该软件(使“无数的键盘发出嘈杂的声音”)。“玛门”在闪语族中有财富、贪欲的意思。该字可见于英语版的圣经,有时是贪心的恶魔的名字。因此,有人认为“玛门”指的是微软。微软的Internet Explorer为当时Netscape的主要竞争者。而微软除了在雄厚的资金支持外,更贪婪地以此增加它的市场占有率。

3.2003 年发布的 Mozilla 1.5 或以上、Mozilla Firefox、Mozilla Thunderbird 1.8.0或以上,以及Netscape 7.2 或以上。

译为:

这章节指的是2003年7月15日,即AOL把它的Netscape浏览器部门关闭和成立Mozilla基金会的日期。“野兽的没落”是指Netscape部门关闭。在“浴火重生的巨鸟”是指Phoenix(凤凰),即现在的Mozilla Firefox。从巨鸟掷出的“火”和“雷”则分别指Mozilla Firefox和Mozilla Thunderbird——Mozilla计划的旗舰产品。Mozilla基金会成立后,Netscape的理念在Mozilla基金会“重生”。基金会不再像从前一样那么依赖AOL,力量变得“更强”。而“玛门”指的则依然是微软。

4.出现在,2007年6月5日上市的 Netscape Navigator 9.0b1之中。

译为:

这章节指的是2006年8月20日,这是第一封提及研发下一版本的Netscape Navigator的可能性的内部邮件的发送日期。造物者指的是软件开发者,野兽则是指Mozilla的产品

5.出现在,2008 年推出的 FireFox 3 中。

译为:

这章节指的是2004年11月9日,为最早的Firefox 1.0官方正式发布的日子。“玛门”(金钱)指的是Internet Explorer ,而“沉睡”指的是隔了5年才发布了它的新版本(Internet Explorer 6至7之间)。“野兽重生”指的是Firefox,透过自发组织的网站Spread Firefox获得大量的支持者,并且透过纽约时报广告为浏览器做了大量的宣传。“灵巧的狐狸”则直指Firefox。“新天地”指的是现代化、基于标准的动态网站和开放源代码的应用软件。其中“sacred words”是连到Mozilla宣言,而“spoke”是连到About Mozilla。最后一段,“玛门苏醒”指的是Internet Explorer 7的发行,“他只是个无价值的追随者”则形容Internet Explorer是个跟屁虫,从Firefox复制了Internet Explorer以前缺少的几个功能

6.出现在Firefox 21 (Nightly版本) 中

译为:

玛门双子(twins of Mammon)指苹果公司和Google的移动操作系统iOS和Android,已经垄断了移动操作系统的市场。新的黑暗(new darkness)指传统应用商店的封闭性。野兽“迅速的”移动指Firefox新的快速发布周期。不断地前进和繁衍(went forth and multiplied)指Firefox已经因Firefox for Android和Firefox OS变为了多重的事物

7.出现在: Firefox 57 中。

译为:

此则也是当今版本的 FireFox 嵌入的 Mozllia 之书

③.浏览器如今的状态

(1). 浏览器市场的当今局势:
         用一句国际政治语言来形容可谓是一超多强
一超 就是指 Google 的 Chrome 浏览器 这个独自占据将近一半市场份额的大家伙。
多强 就是指,一些其他相对市场份额占有率较高的、但其影响力却远不及 Google Chrome 的浏览器,这类浏览器有 FireFox、Internet Explorer(IE)、Edge、Opera、Safari,第三梯队就是国人在用的包括 QQ、搜狗、猎豹、360等在内的类似的浏览器。
(2). 各类浏览器的内核以及优缺点:
         以表格的形式进行说明:

内核 简介 代表 兼容写法 优点 缺点
Trident IE 内核 IE 6 ~ IE 10 -ms- 其被 Microsoft 绑定在了市场占有率最
高的 Windows 操作系统上,更有利于其抢占市场先机
-1).微软长期未更新 Trident 内核导致其与 W3C 标准脱节
-2).Trident 内核中的大量 bug 等安全性问题没有得到及时的解决
-3).Trident 内核解析元素速度较慢有卡顿延迟现象
Gecko FireFox 内核 Mozllia FireFox -moz- 源代码开源.可开发成度较高,几乎所有程序员都可以编写代码来扩展功能,可以支持复杂的网页效果以及浏览器扩展接口 相应的会消耗很多资源,例如 : 内存,代码程序复杂,维护成本高
Webkit Safari 内核以及 Chrome 内核原型 Apple Safari、Google Chrome(28版本以前)、Android 默认浏览器 -webkit- 网页渲染速度快,即使不及 Presto 内核也比 TridentGecko 内核要快上不少 兼容性较差
Presto Opera 内核 Opera -o- 将渲染速度优化到极致,执行同等的 JavaScript 需要的时间仅为 GeckoTrident 内核的 1/3。 牺牲了网页的兼容性
Blink Chrome 最新内核 Google Chrome(28及以后版本)、Opera 15及以后版本 -webkit- 精简内部结构、改善 DOM 结构,使用 JavaScript 实现 DOM 提高安全性。 和其他的 Web 浏览器包括苹果、诺基亚、黑莓等开发商彻底分道扬镳,存在一定风险
Webkit + Trident 双核浏览器内核 360极速浏览器、金山猎豹浏览器、搜狗高速浏览器、QQ 浏览器等 -webkit- 某些方面比单核浏览器更具优势 需要来回切换内核

(3).注意事项:

  • 一提到 Webkit 我们首先就会想到 Google Chrome,那么 Webkit 是否代表了 Google Chrome 呢?他们之间的关系又是怎样的呢?
    A.首先通过上面的介绍我们都知道了, Webkit 是浏览器内核而 Google Chrome 是浏览器,所以并不在同一个层面上况且应用到 Webkit 内核的浏览器有很多(除了 Chrome,苹果的 Safari 、(Android、IOS等默认) 浏览器也都采用的是 Webkit 内核)。所以 Webkit 不能代表 Google Chrome。
    B.实际上当笔者在查阅资料的时候发现很多博文将的或多或少都是有些偏离了实际或者说没有去查阅比较可信的资料而泛泛而谈,本书也是或多或少有些主观意愿但是笔者尽可能的查阅资料并在书末附上所阅资料的来源 …
    经考证,Webkit却实是苹果公司的专利,只不过其 HTML 与 JavaScript 的程式码(源代码)源自 KDEKHTMLKJS 函数库的一个分支,现在已经由 KDE、Apple、Google等独立开发。所以可以说 Webkit 脱胎于 KDEKHTMLKJS 切不可认为 Webkit 是由其发明创造的,而是由 苹果 将 KHTMLKJS 引入并更名为 WebCoreJavaScriptCore,不断增添的新的内容而研发的相对优秀的浏览器内核。
  • 既然 Google Chrome 与 Apple Safari 使用的都是 WebKit 内核那为什么 Chrome 市场占有率最高且最受欢迎呢?
    原因只有一个,Google 并没有照搬照抄来打造自己的 Chrome 浏览器,而是有着自己的智慧结晶在里面的,其中很大一部分因素就是 Google 独立研发的 JavaScript V8 引擎,大大提高了 JavaScript 运行速度,在同等条件下运行网页的脚本, V8 无疑是运行最快且做的最好的一个。
  • Blink 内核是什么鬼?(详述)
    上面提到了 Chrome 的 V8 引擎,JavaScript 方面有了重大突破,那在解析与渲染 HTML 与 CSS 方面 Google 也做出了重大突破就是通过精简内部结构、改善 DOM 结构,使用 JavaScript 实现 DOM 提高安全性等手段,开发出基于 Webkit 排版引擎的 WebCore 分支的 Blink 排本引擎。
  • 双核浏览器又是什么?真的就比单核浏览器好用吗?
    先看看普遍支持双核浏览器的种类:
名称
360安全浏览器
360浏览器极速版
猎豹浏览器
搜狗浏览器
QQ浏览器
傲游浏览器
百度浏览器
UC浏览器
世界之窗浏览器极速版

A.所谓双核浏览器就是:浏览器本身有两个内核(通常是 Trident + Webkit),会根据当前场景的不同来更换浏览器内核。其设计初衷就是为了在保证浏览速度的前提下也能兼顾网络环境的安全性。相对于中国大陆来说为什么双核浏览器居多的全因则是因为:原来的中国大陆其网上银行仅支持低版本 IE 浏览器,但是低版本的 IE 浏览器存在浏览速度慢,对网页标准支持差等问题,随即中国大陆的各大厂商才开始推出并大力宣传双核浏览器。
       B.双核浏览器就是在不用交易的一般网站使用速度更快的 Webkit 内核进行处理,这就是所谓的高速模式。在访问支付宝或者网银等网站的时候切换为 Trident(IE内核) 内核来兼容处理业务,这就是所谓的安全模式/兼容模式。
       C.双核模式下的浏览器不一定比单核浏览器快,就拿 Chrome 与 搜狗浏览器比同样去访问 GitBook 官网,Chrome 马上就可以访问进取但是搜狗浏览器等了好长时间,并且在不同的场景还需要切换内核,这也会牺牲一部分浏览器速度,但这也恰恰国内最需要的功能,因为双核浏览器最方便的地方是网上购物支付时自动切换到IE内核,省去了切换浏览器、重新登录、支付的麻烦。所以浏览器的选择还是需要根据个人喜好与需求和场景的不同来选择,各个浏览器的发展方向不同所主打的功能也不同,但是综合来说笔者仍然认为 Chrome 最好用,无论是在解析和渲染速度上、浏览环境的安全上还是处理浏览器崩溃的策略上等都是略胜一筹的!

  • 以前前端开发,最让人头疼的就是在 CSS 与 JavaScript 中处理兼容问题,那么在如今浏览器竞争的态势中,兼容问题又该何去何从?
    A.过去在开发的时候,例如 CSS 中要写好多前缀:
browser prefix
Chrome -webkit-
IE -ms-
FireFox -moz-
Opera -o-
Safari -webkit-

JavaScript 方面也要多些几套策略。
        B.但是如今你可以不那么为难了,随着 Opera 转向 Chrome 内核,更多的浏览器陆续开始转型,而且 Microsoft 为了留住客户在新推出的 Edge 浏览器中,摒弃了 Trident 内核而是直接采用了 Chrome 内核。随着时间的推移相信很快会有更多的浏览器转向 Chrome 内核,我们再也不用写那么多套处理兼容的冗余代码啦!
        目前主要关注,FireFox 用户、老牌 IE 用户的兼容问题即可。
※.值得注意的是 : 我们要区分一些概念 : 比如渲染引擎、排版引擎、浏览器内核、JavaScript引擎,其实这些概念本来是在下面章节我们需要介绍的,但是这里为了方便大家理解,我们在这里也就一并介绍了。

  • 先引用百度百科的一句话 :

浏览器最重要或者说核心的部分是“Rendering Engine”,可大概译为“渲染引擎”,不过我们一般习惯将之称为“浏览器内核”。负责对网页语法的解释(如标准通用标记语言下的一个应用HTML、JavaScript)并渲染(显示)网页。 所以,通常所谓的浏览器内核也就是浏览器所采用的渲染引擎,渲染引擎决定了浏览器如何显示网页的内容以及页面的格式信息。不同的浏览器内核对网页编写语法的解释也有不同,因此同一网页在不同的内核的浏览器里的渲染(显示)效果也可能不同,这也是网页编写者需要在不同内核的浏览器中测试网页显示效果的原因。 ---- 百度百科

同时渲染引擎又被称为排版引擎,三者其实说的是同一个事物,但是不禁又有许多疑问,正常理解不应该是 浏览器内核包括两部分 : 其一是(渲染引擎也即我们说的排版引擎)、其二是(JavaScript 引擎)吗?期初笔者也有这方面的疑问,但是通过去社区观看大家的看法心里也就释然了,笔者认为在我们应用的网络中其中一个重要组成就是超文本,通俗说也就是我们日常看到的网页,如果没有页面作为观看的基础那么我们说 JavaScript 脚本会起作用吗?所以当浏览器内核偏向于渲染引擎的时候乃至在一定程度上将浏览器内核视为渲染引擎,笔者认为是有一定道理的,并且 JavaScript 引擎也开始逐步的独立出来。尽管这样认为不够严谨不过确实也是唯一的解释了!

=> 一张图完美诠释:

-2).初窥浏览器的渲染机制

明天更新

二.TCP/IP/HTTP/HTTPS 技术详解

  • 待更新 …

三.Web 安全

  • 待更新 …

四.Web 性能优化

  • 待更新 …

五.参考文献:

1.HTML标记语言 - 维基百科
2.超文本 - 维基百科
3.万维网 - 维基百科
4.网页浏览器 - 维基百科
5.统一资源标识符 - 维基百科
6.统一资源定位符 - 维基百科
7.统一资源名称 - 维基百科
8.通用唯一识别吗(UUID) - 维基百科
9.国际标准书号 - 维基百科
10.国际标准连续出版物号 - 维基百科
11.关于HTTP的一点总结(二)—— URI、URL和URN - 简书
12.你知道URL、URI和URN三者之间的区别吗?- 伯乐在线
13.URI、URL和URN - 程序园
14.URI、URL 和 URN - 程序园
15.URI与URL、URN区别 - 程序园
16.URI、URL、URN的区别 - 程序园
17.URI、URL和URN的区别 - 程序园
18.URL、URI、URN区别 - 程序园
19.URI,URL,URN区别 - 程序园
20.URL、URN、URI区别
21.URL中“#” “?” &“”号的作用 - 博客园
22.Functional Requirements for Uniform Resource Names
23.Uniform Resource Identifier (URI): Generic Syntax
24.锚点链接 - 百度百科
25.Timothy John Berners-Lee - 维基百科
26.Marc Andreessen - 维基百科
27.mosaic - 维基百科
28.Mozllia 之书 - 维基百科
29.Webkit - 维基百科
30.双核浏览器 - 维基百科
31.双核浏览器 - 百度百科
32.双核浏览器一定会比单核的快吗?- 北京联盟
33.Blink - 维基百科
34.如何评价 Opera 浏览器弃用自家 Presto 引擎转用 WebKit? - 知乎
35.Edge - 百度百科
36.浏览器内核 - 百度百科
37.浏览器内核与排版引擎 - 慕课猿问
38.排版引擎 - 百度百科
39.浏览器内核、排版引擎、js引擎 - CSDN
40.如何评价 Opera 浏览器弃用自家 Presto 引擎转用 WebKit? - 知乎
41.目前主流的四大浏览器内核Trident、Gecko、WebKit以及Presto - 博客园
42.Google going its own way, forking WebKit rendering engine - arstechnica

编程之路核心技术卷•Web技术内幕相关推荐

  1. 深入分析Java Web技术内幕pdf

    下载地址:网盘下载 内容简介  · · · · · · <深入分析Java Web技术内幕(修订版)>新增了淘宝在无线端的应用实践,包括:CDN 动态加速.多终端化改造. 多终端Sessi ...

  2. 深入分析Java Web技术内幕读书笔记(二)浅析DNS域名解析过程

    上一篇文章<浅析Web请求过程>讲述的是如何发起HTTP请求,对于请求发起过程中很重要的一个步骤--DNS解析过程的描述是一带而过,本篇文章将跟着DNS解析过程来分析域名是如何解析的. 一 ...

  3. 深入分析Java Web技术内幕读书笔记(一)浅析Web请求过程

    随着Web技术的快速发展,互联网的网络架构已经从传统的C/S架构转变为B/S架构,B/S架构相较于传统的C/S架构,有诸多优点,例如:提供了统一的操作方式,简化了用户的学习成本:便捷的开发方式大大提高 ...

  4. 深入分析Java Web技术内幕(修订版) 读书笔记

    第一章   深入web请求过程 1.发起HTTP链接在本质上就是建立一个Socket连接. 2.Linux发起HTTP请求命令: curl "www.baidu.com" (-i/ ...

  5. 深入分析Java Web技术内幕(二)

    DNS域名解析 第一步:浏览器检查缓存中有没有这个域名对应的解析过的IP地址,有则解析结束. 第二步:如果用户的浏览器缓存中没有,浏览器会查找操作系统缓存中是否有这个域名对应的DNS解析结果.host ...

  6. 读《深入分析Java Web技术内幕》

    这里这本书的预读章节,看完预读部分,解答了一些疑惑,也相信这是一本夯实Java Web架构体系的好书. HTTP协议解析 开发一般使用firefox的firebug调试,这的确是一个利器,HTTP的请 ...

  7. 深入分析Java Web技术内幕

    一.深入web请求过程 1.1 B/S 网络架构概述 1.2 如何发起一个请求 1.3 HTTP解析 1.3.1 浏览器缓存机制 CTRL + F5 1.4 DNS域名解析 1.4.1 DNS域名解析 ...

  8. 深入分析Java Web技术内幕 修订版 pdf

    百度网盘:http://pan.baidu.com/s/1slHCCw9 转载于:https://www.cnblogs.com/yintingting/p/6372575.html

  9. 【读书笔记】深入分析Java Web技术内幕-Cookie与Session

    1. cookie a. cookie的属性项(version1)i. NAME=VALUEii. versioniii. comment--注释项iv. commentURL--服务器为此cooki ...

最新文章

  1. 分布式团队面临的五大问题及解决办法
  2. python图形缝隙填充_Python,如何缝合图像哪些重叠区域?
  3. 数据处理之不平衡数据过采样与下采样
  4. 机器人流程自动化崛起,中国是否准备好迎接智能自动化时代?
  5. xmlrcp学习 - python中使用xmlrpc
  6. Ajax的用法之JQuery
  7. Asp.Net页面生命周期(多图)
  8. 【VS Code】vue.js ESLint + vscode 代码格式配置
  9. 关于mysql的update、delete、和insert into能否使用别名问题
  10. IO多路转接之poll
  11. OSCACHE(转)
  12. AspNetCore 中使用 InentityServer4(2)
  13. [渝粤教育] 广东-国家-开放大学 21秋期末考试服务标准化10011k1
  14. 访问对象的属性和方法
  15. hdu1176 免费馅饼 动态规划 二维数组实现
  16. 编译原理 —— 1.2 编译系统的结构(终于弄懂语法和语义的区别了!)
  17. 【codevs1063NOIP04PJ】合并果子,贪心の钻石
  18. maven 多模块项目
  19. js学习笔记 chapter5 引用类型
  20. 【python】命令行参数argparse用法详解

热门文章

  1. 存储过程插入不是规律的数据
  2. Python:OSError [WinError 123] 文件名、目录名或卷标语法不正确。解决方法。
  3. 对于英语小白,运行Pycharm后要做的第一件事,下载一个官方插件,汉化Pycharm
  4. cubemx 读卡器_STM32CubeMX系列教程25:USB Device
  5. Polyworks脚本开发学习笔记(十四)-WORKSPACE信息读取及管理
  6. 【目标检测】MMDetection专栏之MMDetection安装|一
  7. JAVA入门算法题(十四)
  8. 一芯拿捏丨APM32F107单相并网储能变流器应用方案
  9. Mac电脑的超级右键,帮你新建Excel文件,你学会了吗?
  10. 天津科技大学计算机宿舍,国内宿舍条件最令人“心寒”的5所大学,学生:读了一个假大学...