• web性能优化(最佳)


    简单的列举如下

    1. 尽量减少HttpRequest

        方法:

        a. 合并CSS为一个文件,合并JS为一个文件.

        b. 对于背景图片,合并在一起,然后在css中用 position等属性来调用图片. 这种方法很大大型网站都在使用.

        c. image map 简单的说也是把多张图片合并成一张图片,然后在图片的某些区域可以设置“热点”(超链接).       
        d. inline image 使用 Data URLs 来嵌入到面页。
            语法是:  data:[<mediatype>][;base64],<data>
            例子(也可以写在css文件中url(data:[<mediatype>][;base64],<data>)):
                  <img src="data:image/gif;base64,R0lGODlhEAAOALMAAOazToeHh0tLS/7LZv/0jvb29t/f3//Ub/
                      /ge8WSLf/rhf/3kdbW1mxsbP//mf///yH5BAAAAAAALAAAAAAQAA4AAARe8L1Ekyky67QZ1hLnjM5UUde0ECwLJoExKcpp
                      V0aCcGCmTIHEIUEqjgaORCMxIC6e0CcguWw6aFjsVMkkIr7g77ZKPJjPZqIyd7sJAgVGoEGv2xsBxqNgYPj/gAwXEQA7" 
                      width="16" height="14" alt="embedded folder icon">
                 结果显示的是文件夹的图片:
           支持的浏览器有:Opera 7.2+, Firefox, Safari, Netscape, and Mozilla, Internet Explorer 8, 注意Internet Explorer 5-7 不支持。
           缺点:IE5-7不支持
                    需要些额外的工作去做reencode,reembed(图片编码工作)
                    不般不用于太大的图片,因为URL本身长度限制。   
                    Base64编码的图片比其它二制进图片要大33%左右

    2. 使用Content Delivery Network(文本发布网络)

         CDN的实现分为三类:镜像 、高速缓存、专线。

        个人网站以及小型网站没必要使用,费用高。

    3. Add an Expires or a Cache-Control Header

        a. 对于静态文件(css/js/image..),采用从不过期策略.

            例如 对test_1.0.js 请求的过程应该是这样子的:

            可以使用Fiddler或者HttpWatch来观察

            第一次访问页面,观察js请求状态是200

            第二次刷新页面(F5),观察js请求状态是304

            第三次用鼠标访问首页,观察js请求状态是(Cache)

        b. 对于动态的情况,设置合适的过期时间,如ASP.NET 中就有设计OutPutCache的标签
    4. Gzip压缩

        先看一个请求

        HttpRequest Header:

          Accept-Encoding: gzip, deflate

          明白客户端浏览器允许gzip,deflate压缩格式.

        HttpResponse Header:

          Content-Encoding: gzip

        大多数的网站只压缩Html文档,其实完成也可以压缩js/css/xml/json等文本文件。

        image/pdf本身已经压缩过了,没必要再用压缩.

    5. 把css文件放在页面顶部

        主要考虑用用户体验这块

    6. 把js文件放面页面底部

       主要原因是js请求会block并行请求.即每个hostname有一个js request时,它就不能再有其它请求了.

       The DEFER attribute indicates that the script does not contain document.write

    7. 避免使用css expression

        理由是 只有IE支持且旧版本的IE对css expression的性能不好.

    8. 独立出js/css 文件

        理由 方便维护,重用,还有缓存效果.

    9. 减少DNS lookup时间

        IE自动缓存DNS时间是30分钟

        不同的域名就需要不同的DNS查找时间.

        一个网站一般建议设有2-4台服务器(hostname),一台用于放静态文件(css,js,image等)

    10. 压缩js/css文件  

    11. 避免重定向请求.

          301永久重定向,搜索引擎索引中保存新的URL

          302请求的网页临时移动到新位置,搜索引擎索引中保存原来的URL

    12. 去掉多余的js

    13. 配置ETag

         集群的问题上ETag无法解决。生成ETag也浪费CPU时间

         一般不用ETag

    14. 并行下载Javascript

          这个我会另外写个文章出来

  • 相关阅读:
    golang的缓冲channel简单使用
    golang协程同步的几种方法
    红黑树原理详解及golang实现
    go路由httprouter中的压缩字典树算法图解及c++实现
    golang编译源代码和交叉编译方法
    cmake使用笔记
    如何用redis设计数据库初探
    muduo学习笔记(六) 多线程的TcpServer
    利用 Blob 处理 node 层返回的二进制文件流字符串并下载文件
    数据量庞大的分页穿梭框实现
  • 原文地址:https://www.cnblogs.com/webfpc/p/1374037.html
Copyright © 2020-2023  润新知