浏览器检索网页，先从URL开始，使用DNS确定IP地址，再用基于TCP和HTTP协议连接到服务器，请求相关的内容，得到相应，浏览器解析并呈现到屏幕上。
服务器响应后，浏览器响应不会同时全部到达，会陆续到达，有时候之间还会有时间间隔。
页面解析和新的资源请求浏览器等待数据包时，会解析得到包，并寻找可用新的HTTP请求，并启动，每一个服务器，浏览器一般最多同时打开两个请求连接。
一般一次请求：
1、ＤＮＳ解析ＩＰ地址的时间
2、读取主页面时间：连接服务器，发送HTTP get请求，接受初始的HTTP响应时间，和盛余响应到达时间
3、检查图片等其他资源，连接时间，请求并接受所需要的时间
浏览器接受HTML响应时，就开始一边接受，一边解析，当解析到需要打开其他请求的资源时，会并行打开这个资源的请求，所以像这样的资源放在HTML的顶部比放在底部呈现的速度是不一样的，在顶部更快，一般在HTML中的前500个字节中，放置这样订单请求，是一个很好的加速方法。
页面资源顺序
浏览器呈现HTML中的<body>元素之前，会先请求<head>中内容，在head所以资源下载完成之前，用户不会看到呈现的内容，所以尽可能将一些请求放在body内，这样呈现页面和加载资源并行进行，从而缩短页面的呈现时间。随着html解析，页面中引用的资源，会按照html中的出现的顺序进行排队。同一台服务器，最多打开两个连接，所以多于2个的资源会被压入等待队列里面。
但是有时候我们页面中顶部有大幅banner，哦我们不希望在一开始去请求这样的资源，影响到后面重要的内容的呈现，我们可以使用延迟加载技术：
例如

 <img id="myimg" with="50" heigth="50">

 ...

 <script type="text/script">

 document.getItemById("myimg").src="myimg.jpg";//会让浏览器请求这个图

 </script>

图片标签应该制定宽和高，可以减少呈现时间。
我们还可以提前加载：

 <script type="text/script">

 var myimg = new img();

 myimg="myimg.jpg";//会让浏览器请求这个图

 </script>

 ...

 <img src="myimg.jpg" id="myimg" with="50" heigth="50">

分配Image对象，设置src属性，即会开始请求图片，在<img>中只要再次使用相同的文件就可以了，浏览器会缓存这个图片。
浏览器缓存
浏览器缓存是区分大小写的，如果引用相同对象，URL大小写不同，浏览器会多次下载相同的对象。
所以我们强制所以的URL都使用小写。
网络优化：每一个域名最多同时打开两个连接，页面上同时请求同一个域名下的多个资源会进入等待队列中，同时只能打开两个连接，其余等待。改善的方法是，将图片放入不同的子域名中，可以在同一时间并行打开所有连接，但是一个新的连接是有开销的，我们一般从2-4个域名中加载内容。
脚本文件处理浏览器连接请求javascript资源，并会一个一个获取他们，在脚本文件被请求期间，其他的请求进入等待队列，但是在javascript资源请求之前，已经有其他的资源正在请求，script不会打断，只会打断后面的请求。所以我们尽可能的合并脚本。
使用页面onload处理器，和延迟加载来执行后期请求

 <body onload="lateImage()">

 <img id="myimg" with="50" heigth="50">

 ...

 <script type="text/script">

 function lateImage()

 {

     document.getItemById("myimg").src="myimg.jpg";//会让浏览器请求这个图

 }

 </script>

网络连接和初始HTTP请求的更多相关文章

  1. Win10搭建Linux开发环境之网络连接设定

    一直想在家自己搭建一个LINUX服务器,好在上面安装个ORACLE数据库玩玩. 上次用了Ubuntu,结果ORACLE没装成功,现在换个思路,采用CentOS 7作为Linux服务器, 之后再进行构建 ...

  2. MMORPG大型游戏设计与开发（服务器 游戏场景 掉落与网络连接）

    时间一点点的消逝,伴着自己空闲日子将要结束的时候我尽量的学习和分享场景和AI的知识给朋友们,不过很遗憾的是这些文章还有不足的地方,就是有的难点没有完全的分析到.掉落在游戏中必不可少的,同时网络连接也是 ...

  3. Android网络连接判断与处理

    博客分类: Android 获取网络信息需要在AndroidManifest.xml文件中加入相应的权限. <uses-permission android:name="android ...

  4. iOS开发——网络篇——HTTP/NSURLConnection（请求、响应）、http响应状态码大全

    一.网络基础 1.基本概念> 为什么要学习网络编程在移动互联网时代,移动应用的特征有几乎所有应用都需要用到网络,比如QQ.微博.网易新闻.优酷.百度地图只有通过网络跟外界进行数据交互.数据更新, ...

  5. LTE Module User Documentation（翻译10）——网络连接（Network Attachment）

    LTE用户文档 (如有不当的地方,欢迎指正!) 16 Network Attachment(网络连接)   正如前面章节 Basic simulation program 所述,连接用户到基站时通过调 ...

  6. Linux 服务器的网络配置 - 1. 查看 Linux 服务器的网络连接

    1. 查看 Linux 服务器的网络连接 1)查看主机名: liuqian@ubuntu:~$ hostname ubuntu 2)查看 ip 地址: 用 ifconfig 即可,这里介绍命令组合用法 ...

  7. Silverlight项目笔记6:Linq求差集、交集&检查网络连接状态&重载构造函数复用窗口

    1.使用Linq求差集.交集 使用场景: 需要从数据中心获得用户数据,并以此为标准,同步系统的用户信息,对系统中多余的用户进行删除操作,缺失的用户进行添加操作,对信息更新了的用户进行编辑操作更新. 所 ...

  8. Android系列之网络（二）----HTTP请求头与响应头

    ​[声明] 欢迎转载,但请保留文章原始出处→_→ 生命壹号:http://www.cnblogs.com/smyhvae/ 文章来源:http://www.cnblogs.com/smyhvae/p/ ...

  9. [转]VMware虚拟机上网络连接（network type）的三种模式--bridged、host-only、NAT

    转自:http://www.cnblogs.com/xiaochaohuashengmi/archive/2011/03/15/1985084.html VMWare提供了三种工作模式,它们是brid ...

随机推荐

  1. 【kudu pk parquet】runtime filter实践

    已经有好一阵子没有写博文了,今天给大家带来一篇最近一段时间开发相关的文章:在impala和kudu上支持runtime filter. 大家搜索下实践者社区,可以发现前面已经有好几位同学写了这个主题的 ...

  2. 201621123012 《java程序设计》第4周学习总结

    1. 本章学习总结 1.1 写出你认为本周学习中比较重要的知识点关键词 答:关键词:继承 多态 抽象类 abstract 覆盖 object siper 1.2 尝试使用思维导图将这些关键词组织起来. ...

  3. Mysql初识数据库《三》数据库概述

    1 什么是数据(Data) 描述事物的符号记录称为数据,描述事物的符号既可以是数字,也可以是文字.图片,图像.声音.语言等,数据由多种表现形式,它们都可以经过数字化后存入计算机 在计算机中描述一个事物 ...

  4. HTML的相关路径与绝对路径的问题---通过网络搜索整理

    问题描述:    在webroot中有个index.jsp 在index.jsp中写个表单. 现在在webroot中有个sub文件夹,sub文件夹中有个submit.jsp想得到index.jsp表单 ...

  5. resultType和resultMap的区别

    1.resultType和resultMap的区别 1>resultType 返回的结果类型 2>resultMap 描述如何将结果集映射到Java对象 2.resultMap节点 1&g ...

  6. CodeForces - 233A Perfect Permutation

    A. Perfect Permutation time limit per test: 2 seconds memory limit per test: 256 megabytes input: st ...

  7. adminlte+layui框架搭建2 - 动态菜单

    动态菜单 参考文章:https://cloud.tencent.com/developer/article/1342558 主要修改两个地方: 1.系统初始化加载一级菜单,在adminlte.js文件 ...

  8. 【转】IntelliJ Idea取消Could not autowire. No beans of 'xxxx' type found的错误提示

    1.问题描述 在Idea的spring工程里,经常会遇到Could not autowire. No beans of 'xxxx' type found的错误提示.但程序的编译和运行都是没有问题的, ...

  9. 【转】IDEA快捷键功能说明及Eclipse对应操作

    1.Ctrl+z是撤销快捷键 2.如果想恢复Ctrl+z 掉的内容,按快捷键为:Ctrl + Shift + Z.方可 3.Ctrl-H(Browse Type Hierarchy) Ctrl + A ...

  10. UVA - 11825 状压DP

    该题目是EMAXX推荐的练习题,刘汝佳的书也有解说 如果S0属于全集,那S0就可以作为一个分组,那么S分组数可以是best{当前S中S0的补集+1} 对于集合类的题目我觉得有点抽象,希望多做多理解把 ...