web性能优化

常用方法

压缩源码和图片
　　JavaScript文件源代码：可以采用混淆压缩的方式，CSS文件源代码进行普通压缩，JPG图片可以根据具体质量来压缩为50%到70%，PNG可以使用一些开源压缩软件来压缩，比如24色变成8色、去掉一些PNG格式信息等。
　　选择合适的图片格式：如果图片颜色数较多就使用JPG格式，如果图片颜色数较少就使用PNG格式，如果能够通过服务器端判断浏览器支持WebP，那么就使用WebP格式和 SVG格式。
合并静态资源
　　包括CSS、JavaScript和小图片，减少HTTP请求。
开启服务器端的Gzip压缩
　　这对文本资源非常有效，对图片资源则没那么大的压缩比率。
使用CDN 或者一些公开库使用第三方提供的静态资源地址
　　比如jQuery、normalize.css。一方面增加并发下载量，另一方面能够和其他网站共享缓存。
延长静态资源缓存时间

　　频繁访问网站的访客就能够更快地访问。不过，这里要通过修改文件名的方式，确保在资源更新的时候，用户会拉取到最新的内容。

CSS引用放在页面头部，JavaScript引用放在页面底部

　　这样就不会阻塞页面渲染，让页面出现长时间的空白。

前端工程师的性能优化

基本优化方法是：

尽量减少同一域下的HTTP请求数
以及尽量减少每一个资源的体积

　　浏览器常常限定了对同一域名发起的并发连接数的上限。E6/7和Firefox2的设计规则是，同时只能对一个域名发起两个并发连接。新版浏览器普遍上限设定为4至8个。

　
　把静态资源放在非主域名下，这种做法除了可以增加浏览器并发，还有一个好处是，减少HTTP请求中携带的不必要的cookie数据。cookie是某些
网站为了辨别用户身份而储存在用户浏览器中的数据。cookie的作用域是整个域名，也就是说如果某个cookie存放在google.com域名下，那
么对于google.com域名下的所有HTTP请求头都会带上cookie数据。

　　如果Google把所有的资源都放在google.com下，那么所有资源的请求都会带上cookie数据。对于静态资源来说，这是毫无必要的，因为这对带宽和链接速度都造成了影响。
　
　前端工程师经常做的优化是合并同一域名下的资源，比如把多个CSS合并为一个CSS，或者将图片组合为CSS贴图，还有一些优化建议是省掉不必要的
HTTP请求，比如内嵌小型CSS、内嵌小型JavaScript、设置缓存，以及减少重定向。这些做法虽然各不相同，但是如果了解HTTP请求的过程，
就知道这些优化方法的最终目的都是最大化利用有限的请求数。
　　一个基础题目是“常用的图片格式有哪些，它们的使用场景是什么”。对图片的敏感性反映出工程师对带宽和速度的不懈追求。比较大的文本资源，必须开启gzip压缩。
对于一个CSS资源的请求耗时（两个细节）：
　　这个CSS资源请求的体积是36.4KB（这是gzip压缩过的体积），解压缩之后，CSS内容实际上是263KB，可以算出压缩后体积是原来的13.8%。
　　整个连接的建立花费了30%的时间，发出请求到等待收到第一个字节回复花费了20%的时间，下载CSS资源的内容花费了50%的时间。

后台工程师的性能优化

　　对于HTTP的关注在于让服务器尽快响应请求，以及减少请求对服务器的开销
　　1、提高服务器的请求处理能力:
Apache
通过模块化的设计来适应各种环境，其中一个模块叫做多处理模块（MPM），专门用来处理多请求的情况。Apache安装在不同系统上的时候会调用不同的默
认MPM，我们不用关心具体的细节，只需要了解Unix上默认的MPM是prefork。为了优化，我们可以改成worker模式。
　　
prefork和worker模式的最大区别就是：prefork
的一个进程维持一个连接，而worker的一个线程维持一个连接。所以prefork更稳定但内存消耗也更大，worker没有那么稳定，因为很多连接的

线程共享一个进程，当一个线程崩溃的时候，整个进程和所有线程一起死掉。但是worker的内存使用要比prefork低得多，所以很适合用在高HTTP
请求的服务器上。

Apache和Nginx：
　　在高连接并发的情况
下，Nginx是Apache服务器不错的替代品或者补充：一方面是Nginx更加轻量级，占用更少的资源和内存；另一方面是Nginx
处理请求是异步非阻塞的，而Apache 则是阻塞型的，在高并发下Nginx
能保持低资源、低消耗和高性能。——由于Apache和Nginx各有所长，所以经常的搭配是Nginx处理前端并发，Apache处理后台请求。新秀
Node.js也是采用基于事件的异步非阻塞方式处理请求，所以在处理高并发请求上有天然的优势。
　　2、高性能网站的关键：缓存
　　在一个Web站点中，它的数据流从服务器端到浏览器端，哪些地方可以使用缓存来优化：

服务器缓存
数据库缓存

　　基本的数据库查询缓存——可以开启MySQL查询缓存来提高速度，并且减少系统压力

　　MySQL默认不开启查询缓存，但我们可以通过修改MySQL安装目录中的my.ini来设置查询缓存。设置的时候可以根据实际情况配置缓冲区大小、单个查询的缓冲区大小等。

如果您希望优化MySQL服务器的查询性能和速度，可以在MySQL配置中增加这两项:

query_cache_size=SIZE SIZE是指为查询缓存开辟多大的空间。默认是0，也就是禁用查询缓存。
query_cache_type=OPTION 设置查询缓存的类型，可选的值有以下这三种。
- 0：设置查询缓存的类型，可选的值有以下这三种。
- 1：所有的缓存结果都缓存起来，除非查询命令以SELECT S_NO_CACHE开始。
- 2：只缓存查询命令以SELECT SQL_CACHE开始的查询结果。

——问题是“缓存命中率不高”，所以配置缓存之后第一件事就是查询命中率，如果命中率低，不如不做缓存。数据库查询缓存的一个设计原则：其缓存失效设计是很粗糙的——保证实时性可牺牲命中率??

　　扩展数据库缓存：memcached
　
　memcached应运而生，它是一个高性能分布式内存对象缓存系统，用于减轻数据库负载。它通过在内存中缓存数据和对象来减少读取数据库的次数，从而
提高动态、数据库驱动网站的速度。memcached可以与数据库查询缓存配合使用。memcached的设计原则是：时间过期，即只有设定的时间到了才
去更新数据，提高了命中率，但有可能是”不新鲜的“。