< high performance web sites > 阅读小记

high performance web sites

1，减少HTTP请求数
    (1)图片加载使用image maps 或者 CSS Sprite
    (2)使用非http协议，如（ftp:, file: mailto: data:URL等，已被IE废弃）
    (3)合并css和js代码文件

2，使用内容分发网络（CDN：content delivery network）
    当然使用cdn有优点也有缺点：成本高，不受控制，和其他客户竞争cdn带宽

3，增加expires头，控制缓存时间
    (1)设置expires头，不易操作，需要设置精确过期时间，client和server需要同步时间等
    (2)http 1.1引进Cache-controll:max-age
    (3)主要针对image/stylesheet/script等类型文件
    (4)更改文件名可“刷新”缓存，如添加js版本号

4，使用Gzip
    (1)Accept-Encoding: gzip, deflate
    (2)一般可压缩大于1~2K的文本文件(html/css/js/xml/json等)

5，把stylesheets放在前面
    (1)有些浏览器可能会在读完stylesheet后再渲染，所以影响用户体验
    (2)多用link标签，少用@import

6，把scripts放在后面
    (1)脚本执行占用时间，导致页面加载缓慢
    (2)加快stylesheet渲染页面
    (3)使用多个子域名或者cdn，增加浏览器并发下载数目，但script只能单独下载，无法并行

7，减少css的运算表达式

8，把javascript和css放在外部文件
    (1)css和js能轻易被浏览器缓存
    (2)资源复用等

9，减少dns查询
    (1)dns查询结果包含ttl值，表示保持时间，浏览器有记录缓存

10，减小javascript代码
    压缩，混淆，删掉无用代码片段，可用JSMin工具或Dojo Compressor

11，减少3xx跳转（服务器端用alias等方式替代）

12，防止script被多次引用

13，设置ETag
    服务器 -> 浏览器 ETag: "10c24bc-4ab-457e1c1f"
    浏览器 -> 服务器 If-None-Match: "10c24bc-4ab-457e1c1f"

14，使Ajax可缓存，优化ajax

附：关于网站建设整理：（各个组件的一些解决方案）

1，原型设计Axure
2，后端MVC框架（codeigniter/yii/ruby on rails等）
3，前端框架bootstrap(css)，jquery(javascript)，yaml(css)等
4，持久化数据库（mysql数据表设计，读写分离，合适存储引擎，慢查询日志，数据库连接池，索引，通过业务实现分表分库）；缓存数据库(redis/mongodb等)
5，缓存方案（数据缓存memcache/redis，文件缓存squid/varnish）
6，消息队列（redis/zeromq/httpsqs等）,任务调度(zeromq/gearman等)
7，文件存储（磁盘大文件存储+mongodb小文件存储）
8，搜索引擎（lucene/nutch/elasticsearch等）
9，SEO优化（添加ga统计代码等）
10，虚拟化（xen或lxc或kvm）
11，日志处理：分布式日志搜集（facebook的scribe）日志统计处理（awk/hadoop/elasticsearch/storm）
12，监控（glances，nagios，zabbix，查看网络IO，磁盘IO，cpu，磁盘剩余，内存占用等参数）
13，负载均衡（F5/lvs/nginx/Haproxy热备）
14，装机策略（系统盘和重要的数据盘做raid10），操作系统centos
15，网络安全（程序以nobody权限运行，禁止root账户操作现网，防ddos攻击，防xss注入攻击，及时更新各个软件，改变ssh等常用软件的端口）