网站性能优化——DNS预热与合并HTTP请求
DNS预热
一次DNS解析耗时
20-120ms
, 当网页中使用的域名较多时,DNS预热节省的时间还是非常可观的
先看效果
预热的目的:
- 减少请求次数
- 提前对DNS预获取
预热的方式
- 爬虫
- APP
- 网页meta
<meta http-equiv="x-dns-prefetch-control" content="on" />
<link rel="dns-prefetch" href="//webresource.english.c-ctrip.com" />
<link rel="dns-prefetch" href="//webresource.c-ctrip.com" />
<link rel="dns-prefetch" href="//s.c-ctrip.com" />
<link rel="dns-prefetch" href="//pic.english.c-ctrip.com" />
<link rel="dns-prefetch" href="//m.ctrip.com" />
另外,对于国际化站点尤其需要这么做,举个例子,在美国访问中国的网站,DNS解析会回源到中国,耗时通常在
400ms
至800ms
,甚至更长,如果提前预热,那么可以节省这些时间。
合并HTTP请求
这里的合并主要针对当前页面上访问的资源文件,比如css,js,图片等。
为甚么要合并请求?
有人会很奇怪,现代浏览器都可以并发请求资源了,为什么还要这么做?我只能说你还too young too simple了。浏览器虽然可以并发,但是PC接入互联网的带宽是有限的,浏览器所能用的TCP链接更是有限的,我来看一个网页请求的实例:
看到了吧,一个2KB
的资源加载需要将近0.5s
,而99%时间是等待, OMG! 所以还挣扎什么,老老实实的用webpack压在一起吧。
注意chrome在http和https下相同域名可以并发的请求数不同:http = 6,https > 13,这里并发是有相当的水分,从上图中可以看出,链接虽然建立了,但并没什么卵用,依然要等待之前的资源下载下来才开始生效,至于浏览器为啥要这般?(谁知道可以留言告知,万分感谢!)
更多参考
网站性能优化——DNS预热与合并HTTP请求的更多相关文章
- input屏蔽历史记录 ;function($,undefined) 前面的分号是什么用处 JSON 和 JSONP 两兄弟 document.body.scrollTop与document.documentElement.scrollTop兼容 URL中的# 网站性能优化 前端必知的ajax 简单理解同步与异步 那些年,我们被耍过的bug——has
input屏蔽历史记录 设置input的扩展属性autocomplete 为off即可 ;function($,undefined) 前面的分号是什么用处 ;(function($){$.ex ...
- 网站性能优化(Yahoo 35条)
Yahoo 网站性能优化 35条 一.内容部分 尽量减少 HTTP请求 减少 DNS查找 避免跳转 缓存 Ajxa 推迟加载 提前加载 减少 DOM元素数量 用域名划分页面内容 使 frame数量最少 ...
- Yahoo团队经验:网站性能优化的34条黄金法则
Yahoo团队总结的关于网站性能优化的经验,非常有参考价值.英文原文:http://developer.yahoo.com/performance/rules.html 1.尽量减少HTTP请求次数 ...
- Yahoo网站性能优化的34条规则
摘自:http://blog.chinaunix.net/uid/20714478/cid-74195-list-1.html Yahoo网站性能优化的34条规则 1.尽量减少HTTP请求次数 终端用 ...
- Yahoo! 35条网站性能优化建议
Yahoo! 35条网站性能优化建议 Yahoo!的 Exceptional Performance团队为改善 Web性能带来最佳实践.他们为此进行了一系列的实验.开发了各种工具.写了大量的文章和博客 ...
- 网站性能优化小结和spring整合redis
现在越来越多的地方需要非关系型数据库了,最近网站优化,当然从页面到服务器做了相应的优化后,通过在线网站测试工具与之前没优化对比,发现有显著提升. 服务器优化目前主要优化tomcat,在tomcat目录 ...
- 网站性能优化实战——从12.67s到1.06s的故事
文章摘自https://juejin.im/post/5b0b7d74518825158e173a0c 作为互联网项目,最重要的便是用户体验.在举国“互联网+”的热潮中,用户至上也已经被大多数企业所接 ...
- Yslow网站性能优化工具
Yslow是一款网站性能优化的插件:
- asp.net网站性能优化2则
摘要:Web服务器的性能优化有很多资料介绍了,多台主机负载均衡,查询结果的多级缓 存,数据库索引优化等都是常见的优化手段.随着后端优化空间越来越小,现在越来越多 的网站更注重前端性能的优化,就是浏览器 ...
随机推荐
- Ansible-Ad_Hoc临时命令的使用
Ad_Hoc临时命令的使用 1.使用场景: 所有的临时获取信息的都可以使用,比如节前健康检查.临时更新配置文件. 2.用法: ansible -i 主机 -m 模块 选项 3.常用的命令选项: -v ...
- webpack的配置 @3.6.0
1.下载对应版本的webpack npm install webpack@3.6.0 -save --dev 2.新建webpack.config.js文件,目录结构↑ 3. >>webp ...
- Image Perimeters
Description 给出一张由"x"和"."组成的矩阵.每个"x"可以向上下左右及两个斜对角进行连通,请问由某个点开始的"x& ...
- js里typeof和instanceof和箭头表达式要注意的地方,以及其他
如果学过类似C#这样的语言,然后定义两个类class Mu{}和class Ku{},那么显然typeof Mu != typeof Ku的,但是在js里则不是这样,对于Mu和Ku的对象进行typeo ...
- git使用mvn clean install 报错原因排查
使用命令行git-bath.exe 来拉代码并进行编译之类的服务,结果在拉依赖时一直报错连的是144.131.254.26,看了maven的setting配置 文件 没并没有错, 最终定位问题是 gi ...
- 【Webservice】2 counts of IllegalAnnotationExceptions Two classes have the same XML type name
在使用客户端调用服务端的时候发生了2 counts of IllegalAnnotationExceptions Two classes have the same XML type name的错误, ...
- python 之 re模块、hashlib模块
6.16 re模块 正则就是用一些具有特殊含义的符号组合到一起(称为正则表达式)来描述字符或者字符串的方法.或者说:正则就是用来描述一类事物的规则.(在Python中)它内嵌在Python中,并通过 ...
- 从零开始学Flask框架-001
新建项目 目录结构 Index.html <!DOCTYPE html> <html lang="en"> <head> <meta ch ...
- 1.关于Python,你可能不知道的
启示录 写在前面———— 至于python有多牛逼,这里不介绍了,安装也不说了,网上一堆一堆的安装教程. 本文只介绍需要知道的 常识知识———— 1.python 发音:英 [ˈpaɪθən] 美 [ ...
- C++ 去掉字符串的首尾空格和全部空格
#include <iostream>#include <string>using namespace std; //去掉收尾空格string& ClearHeadTa ...