1.简单网络传输原理及相关知识点

1.关于面试问题:打交道最多的是浏览器

  浏览器：帮助用户浏览网页的软件
  1.1 主流浏览器必备的条件:  
      1) 在市场上有一定的份额 2) 要有独立研发的内核
      shell部分:展示操作页面可见的部分 
  1.2 浏览器:                 内核:
          IE                trident
        Firefox              Gecko
        Goole chrome       Webkit（之前是和苹果一起研发的）/blink（14年投入市场）
        Safari               Webkit
        Opera                presto
        Edge                微软最新的浏览器（js引擎是chakra(查克拉)，渲染引擎是EdgeHTML）
  1.3 简单流程:  
        把文件打成包 放到服务器上，服务器有个地址，方便客户端找到索取数据把htmlcss,  
       javascript文件下载到自己的浏览器里执行（是副本，可以修改，但不能实质性改变）            
  1.4 DNS：DNS（Domain Name System，域名系统），因特网上作为域名和IP地址相互映射的一个
          分布式数据库，能够使用户更方便的访问互联网，而不用去记住能够被机器直接读取的IP数串。
          通过主机名，最终得到该主机名对应的IP地址的过程叫做域名解析（或主机名解析）
      例如： www.baidu.com 这是域名 通过dns解析成物理地址 IP地址126.168.000.0001
  1.5 下载页面时会逐行渲染，遇到css文件会另开一个新的线程去下载CSS,原有的线程继续下载HTML   
      互不耽误，这叫异步加载，同时做多件事。
  1.6 服务器：服务器就是稳定性比较强的电脑
      国内好的服务器厂商:联想  国外：IBM
  1.7 web服务器：存放网站的电脑就是web服务器
  1.8 网页请求背后的秘密：
    1) 用户在客户机上用浏览器请求网页
    2) 网络数据传输
    3) 服务器端解析用户请求
    4) 服务器处理请求并返回页面内容
    5) 浏览器接受返回的响应网页内容
    6) 浏览器渲染成可视化的网页内容
  1.9 Internet：因特网，互联网。可以实现全球信息互联的网络。
      WWW：万维网（world wide web），它是提供网站相关服务，人们可以通过万维网服务进行
           网上聊天、网上冲浪、网购、搜索资料、查看天气、查看新闻、交友聊天等。
      W3C：万维网联盟创建于1994年.是Web技术领域最具权威和影响力的国际中立性技术标准机构。
           我们后面学的html、css等标准都是由此机构主导制定。
      HTTP：超文本传输协议（HTTP，HyperText Transfer Protocol），也就是浏览器和服务器端的
            网页传输数据的约束和规范。
          (统一和规范返回数据的格式)
          (在浏览器调试器中返回的文字在network Headers中，响应的内容在Response中)
          参考图片下图

01-浏览器和服务器的请求过程.png

2. URL协议

•URL协议：Uniform Resource Locator，统一资源定位符是对可以从互联网上得到的资源的位置和访问
方法的一种简洁的表示，是互联网上标准资源的地址。互联网上的每个文件都有一个唯一的URL，它包含的
信息指出文件的位置以及浏览器应该怎么处理它。
•协议规定格式：scheme://host.domain:port/path/filename
  • scheme - 定义因特网服务的类型。最常见的类型是 http
  • host - 定义域主机（http 的默认主机是 www）
  • domain - 定义因特网域名，比如 w3school.com.cn
  • :port - 定义主机上的端口号（http 的默认端口号是 80）
  • path - 定义服务器上的路径（如果省略，则文档必须位于网站的根目录中）。
• filename - 定义文档/资源的名称
•常见协议：http、https、ftp、迅雷协议等.. •URL编码：url中的非ASCII码，转为%ascii码。

3.常用的图像格式

1. GIF格式
   GIF最突出的地方就是他支持动画，同时GIF也是一种无损的图像格式，也就是说修改图片之后，图片质
   量几乎没有损失。再加上GIF支持透明（全透明或全不透明），因此很适合在互联网上使用。但GIF只能
   处理256种颜色。在网页制作中，GIF格式常常用于Logo、小图标及其他色彩相对单一的图像。
总结：小、兼容性好、支持透明、色彩太多不行。
2. PNG格式
   PNG包括PNG-8和真色彩PNG（PNG-24和PNG-32）。相对于GIF，PNG最大的优势是体积更小，支持
   alpha透明（全透明，半透明，全不透明），并且颜色过渡更平滑，但PNG不支持动画。同时需要注意的
   是IE6是可以支持PNG-8的，但在处理PNG-24的透明时会显示为灰色。通常，图片保存为PNG-8会在同等
   质量下获得比GIF更小的体积，而半透明的图片只能使用PNG-24。
 3. JPG格式
   JPEG格式是网络上比较流行的一种格式，其文件扩展名为.jpg或.jpeg。JPEG是一种有损压缩格式，其
   文件体积非常小，非常有利于网络传输，但由于是有损压缩，所以将一幅图像转换为JPEG格式后图像质
   量会降低。一般用于广告，大的宣传的图片，照片等

4. 图片的抉择

– jpg
  • 色彩还原高，适合复杂颜色图片，比如banner – gif
  • 色彩效果最低，支持透明，支持动画，适合颜色比较少，不适合渐变色。
– png
  • PNG的优点是，清晰，无损压缩，压缩比率很高，可渐变透明，具备几乎所有GIF的优点；缺点是不如
    JPG的颜色丰富，同样的图片体积也比JPG略大。
  • PNG有着另一个优点，那就是逐次逼近显示(progressivedisplay)：传输图像文件的同时，可以先把
    整个轮廓显示出来，然后逐步显示图像的细节，即先显示低分辨率显示图像，从模糊到清晰，然后逐
    步提高它的分辨率。这是一个很好的用户体验。
•总结：
  • gif和png基本差不多，色彩比较少的直接gif，如果图片动画用gif。对色彩要求高的用jpg。