• 提高网站速度的最佳实践【翻译】


    提高网站速度的最佳实践【翻译】

    原文地址是这个地方:http://developer.yahoo.com/performance/rules.html,英语水平有限,翻译可能不到位,自己再看看这个英文原版了。

    1.最小化HTTP请求

    终端用户响应时间的80%用在前端显示上,大部分时间浪费在下载页面组件上面,比如:图片,css样式,flash,脚本等等,降低返回的http请求的页面的组件数量,这是加快页面的重要环节。

    减少页面组件的一个方法就是简化页面设计,但是如果要设计一个富页面应用的web系统如何减少组件呢?下面有些技术可减少http请求,同时可以开发富页面程序

    css样式是减少图片数量的一个比较好的方法,把你的背景图片组合一个单独的图片,而且使用css的background-image和background-position去显示渴望的图片效果

    图片管理:把多个图片组合成为一个图片,虽然图片的大小没有变化,但是减少了http请求的数量。如果这些图片比较接近可以使用这个办法,比如导航条的位置。(该方法并不推荐)

    内嵌图片:使用 data: URL scheme把图片嵌入到真正的页面中。这样会增加html文档的大小,这样可以减少http请求,(内嵌图片不支持部分浏览器),所以推荐使用css来加载图片,而不是在html中直接使用img标签

    降低http请求数量是最重要的,这是提高用户访问性能的最重要的指导规则。

    2.使用内容分发网络(Content delivery network)

    用户距离你的网络服务远近对响应时间也是有影响的,部署多个服务器,按照地理位置划分你的服务器可以使用你的页面加载更快,但是应该从哪里开始呢?

    首先实现按地理位置划分内容,不要试图重新设计你的web程序成为分布式架构,依赖这个程序,改变架构是一个很复杂可怕的工作,比如同步session状态,数据库同步等。企图降低用户和你内容服务直接的距离这个工作会被推迟的,甚至不会通过。

    记住用户响应时间的80用在下载页面的组件上面。这是一个“黄金法则”,所以不要去重新设计你的程序架构,最好首先去划分你的静态内容,这不是唯一的降低响应时间的方法,但是因为内容分发服务器这是最简单的方法。

    内容分发服务器(cdn)是一组分布式部署的web服务的集合,可以更有效的把内容传递给用户,服务器传递内容给距离他最近的用户

    一些大型互联网公司有自己的cdn。我们也可以使用cdn服务器提高的服务,这种方式是比较廉价而且有效益的。

    3.添加一个过期失效或者缓存控制的头标记

    在这个规则有两个事情

    (a)对静态组件实现永远不过期策略

    (b)对动态组件:适当的使用缓存控制。

    4.Gzip 组件(压缩组件)

    压缩可以降低请求的响应时间。在http1.1协议中客户端指名支持的压缩协议,

     Accept-Encoding: gzip, deflate

    如果web服务器看到这个请求头,就会用客户端指定的方法来压缩返回的内容。

    Gzip就是当前最流行的压缩算法

    5.把样式表放在文件顶端

    6.把脚本房子文件底部

    7.避免css表达式运算

    8.把css和js脚本放到外置文件中

    9.降低dns的检查

    10.缩小css文件和js文件

    11.避免重定向

    12.去掉重复的脚本

    13.配置标签

    14.使ajax具有缓存功效

    15,尽早的清空缓存

    16.使用Get方式去请求(如果数据小的话可以使用)

    17.加载后使用组件(Post—Load)

    18.预先加载组件(PreLoad)

    19.减少dom文档的数量

    20.跨域分割组件

    21.少使用iframe

    22.不要使用404错误信息,自己收到实现这个404错误的提示方式

    23.少使用cookie

    24.使用无cookie的域为组件

    25.减少对dom的访问操作

    26.开发灵活的事件处理方式

    27.Choose <link> over @import

    28。避免使用滤镜

    29.优化图片

    30.优化css样式

    31.不要按照比例使用图片(比如500*500的 图片,在html中不要使用100*100的方式)

    32.使图标更小,可以缓存

    33.使组件小于25k

    34.把多个组件封装成多方可以使用的组件

    本文使用Blog_Backup未注册版本导出,请到soft.pt42.com注册。

  • 相关阅读:
    设计模式学习笔记--原型模式
    设计模式学习笔记--工厂方法模式
    复制、粘贴一个物体的所有组件
    设计模式学习笔记--装饰模式
    模板方法模式(TemplateMethod)
    FreeSql 与 SqlSugar 性能测试(增EFCore测试结果)
    FreeSql 新查询功能介绍
    FreeSql 过滤器使用介绍
    非常贴心的轮子 FreeSql
    .NETCore 下支持分表分库、读写分离的通用 Repository
  • 原文地址:https://www.cnblogs.com/zjypp/p/2319427.html
Copyright © 2020-2023  润新知