关于浏览器的一些知识


浏览器有很多的功能,可以分为以下几个部分:

  • 1. 人机交互部分(UI)
    2. 网络请求部分(Socket)
    3. JavaScript 引擎部分(解析执行JavaScript)
    4. 渲染引擎部分(渲染HTML、css等)
    5. 数存储部分(cookie、HTML5中的本地存储LocalStorage、SessionStorage)

在渲染引擎(又叫排版引擎或浏览器内核)部分

主流的浏览器引擎有:

1. Chrome 浏览器 :Blink引擎(WebKit的一个分支)

   2. Safari 浏览器:WebKit引擎

   3. FireFox 浏览器 :Gecko引擎

   浏览器工作原理:

  1. 解析HTML构建DOM树

   2. 构建渲染树

   3. 对渲染树进行布局

   4. 绘制渲染树,调用操作系统底层API进行绘图操作

下面来两幅图来帮助理解一下:

  


浏览器访问网站的过程

  1. 在浏览器地址栏中输入网址
  2. 浏览器通过用户在地址栏中输入的URL构建HTTP请求报文
  3. 浏览器发起DNS解析请求,将域名转化为IP地址
  4. 浏览器将请求报文发送给服务器
  5. 服务器接收报文并解析
  6. 服务器处理用户请求,并将处理结果封装成HTTP响应报文
  7. 服务器将HTTP响应报文发送给浏览器
  8. 浏览器接收服务器相应的HTTP报文,并解析
  9. 浏览器解析HTML页面并展示,在解析HTML页面时遇到新的资源需要再次发起请求
  10. 最终浏览器展示出了页面


WEB开发的本质

1. 请求:客户端发起请求

2. 处理:服务器处理请求

3. 相应:服务器将处理结果发送给客户端

4. 客户端处理响应:在服务器响应完毕后,客户端继续处理:

  • 浏览器:解析服务器返回的数据
  •   IOS、Android客户端,解析服务器返回的数据,并且通过IOS或Android的UI技术实现界面的展示功能

C/S: 客户端服务器(如:QQ客户端)

B/S: 浏览器服务器

B/S 模式开发:易于维护,但用户体验不佳

C/S 模式开发:不易于维护,但是与服务器连接稳定,用户体验好

优质内容筛选与推荐>>
1、B2C
2、显示不显示的设定flag功能
3、Silverlight使用DataGrid的模板列(DataGridTemplateColumn)实现类似TreeListView控件的效果
4、Oracle(00):约束
5、iBatis 到 MyBatis区别(转)


长按二维码向我转账

受苹果公司新规定影响,微信 iOS 版的赞赏功能被关闭,可通过二维码转账支持公众号。

    阅读
    好看
    已推荐到看一看
    你的朋友可以在“发现”-“看一看”看到你认为好看的文章。
    已取消,“好看”想法已同步删除
    已推荐到看一看 和朋友分享想法
    最多200字,当前共 发送

    已发送

    朋友将在看一看看到

    确定
    分享你的想法...
    取消

    分享想法到看一看

    确定
    最多200字,当前共

    发送中

    网络异常,请稍后重试

    微信扫一扫
    关注该公众号