前端性能优化需要从前端的资源类型分析,以减少请求资源和请求时间为目的。目前的类型包括图片、javascript、css、动态数据等,不同的资源对于运算、带宽等的依赖也不同,因此优化的方式也不同。参照以往的经验和雅虎前端优化的策略,本系统分为以下方面:

1)根据浏览器加载数据的顺序不同,将加载的位置分为head内部和body之后

a:css尽可能的放到head内部;

    b:javascript放到body之后;

2)减少数据请求的次数,减少服务器请求时间

a:合并不必要的单次后端请求;

    b:首界面采用懒加载,列表页采用分页加载;

c:javascript合并;

d:css合并;

e:2k以内的请求采用get请求,反之采用post请求;

3)通过数据压缩,减少数据传输的时间

a:服务器请求采用gzip压缩;

b:banner图片采用图片压缩,压缩到200kb左右;

c:javascript和css采用数据压缩;

4)通过数据缓存增加请求的速度

  a:图片资源,javascript、css配置cdn;

b:页面静态资源配置页面缓存;

5)多域名请求

  a:将数据库、图片、应用程序等功能分开存储请求;

  b:根据不同的业务划分不同的域名服务器;

6)负载均衡

  a:设定负载均衡,包括应用程序负载和数据库负载处理;

7)硬件配置提升

  a:增加网络带宽;

  b:增加服务器处理能力;

Web前端性能优化策略的更多相关文章

  1. Web前端性能优化教程09:图像和Cookie优化

    本文是Web前端性能优化系列文章中的第九篇,主要讲述内容:图像和Cookie优化.完整教程可查看:  一. 图像优化 图像基础知识 gif: 适用于动画效果,例如提示的滚动条图案 jpg: 是一种使用 ...

  2. Web前端性能优化的9大问题

    1.请减少HTTP请求基本原理:在浏览器(客户端)和服务器发生通信时,就已经消耗了大量的时间,尤其是在网络情况比较糟糕的时候,这个问题尤其的突出.一个正常HTTP请求的流程简述:如在浏览器中输入&qu ...

  3. 网站的高性能架构---Web前端性能优化

    网站性能测试 不同视角下的网站性能 用户视角的网站性能:从用户角度,网站性能就是用户在浏览器上直观感受到的网站响应速度.用户的感受时间包括用户计算机和网站服务器通信的时间.网站服务器处理请求时间.用户 ...

  4. Web前端性能优化全攻略

    网页制作poluoluo文章简介:Web 前端性能优化是个大话题,是个值得运维人员持续跟踪的话题,是被很多网站无情忽视的技术. Web 前端性能优化是个大话题,是个值得运维人员持续跟踪的话题,是被很多 ...

  5. Web前端性能优化全攻略[转载]

    1. 尽量减少 HTTP 请求 (Make Fewer HTTP Requests) 作为第一条,可能也是最重要的一条.根据 Yahoo! 研究团队的数据分析,有很大一部分用户访问会因为这一条而取得最 ...

  6. 大型网站技术架构(3):WEB 前端性能优化

    上次说到了性能优化策略,根据网站的分层架构,可以大致的分为 web 前端性能优化,应用服务器性能优化,存储服务器性能优化三大类 这次来说一下 web 前端性能优化,一般来说,web 前端就是应用服务器 ...

  7. 性能优化——Web前端性能优化

    核心知识点: 1.排查网站性能瓶颈的手法:分析各个环节的日志,找出异常部分 2.Web前端:网站业务逻辑之前的部分(浏览器.图片服务.CDN) 3.优化手段 1)浏览器优化 (1)减少http请求 a ...

  8. web前端性能优化的技巧

    1. 请减少HTTP请求 基本原理: 在浏览器(客户端)和服务器发生通信时,就已经消耗了大量的时间,尤其是在网络情况比较糟糕的时候,这个问题尤其的突出. 一个正常HTTP请求的流程简述:如在浏览器中输 ...

  9. 前端进阶(1)Web前端性能优化

    前端进阶(1)Web前端性能优化 Web前端性能优化, 不仅能够改善站点的用户体验,并且能够节省相当的资源利用.下面将从1)服务器.2)html内容.3)css. 4)javascript. 5)图片 ...

随机推荐

  1. C++ 智能指针三

    /* 智能指针shared_ptr注意点 */ #include <iostream> #include <string> #include <memory> // ...

  2. Spring注解@Component、@Repository、@Service、@Controller @Resource、@Autowired、@Qualifier、@scope

    以下内容摘自部分网友的,并加上了自己的理解 @Service用于标注业务层组件(我们通常定义的service层就用这个) @Controller用于标注控制层组件(如struts中的action.Sp ...

  3. linux 如何快速的查找日志中你所要查找的信息

    在工作中我总会通过日志来查找相关问题,但有时候日志太多有不知道又不知道日志什么时候打印的,这时我们可以通过一下方法来查找: 1.把目录跳到你日志文件存放的地方 2.grep  关键字  *    例如 ...

  4. LVS DR模式搭建 keepalived lvs

    LVS DR模式搭建• 三台机器 • 分发器,也叫调度器(简写为dir)172.16.161.130 • rs1 172.16.161.131 • rs2 172.16.161.132 • vip 1 ...

  5. [Bayes] Metroplis Algorithm --> Gibbs Sampling

    重要的是Gibbs的思想. 全概率分布,可以唯一地确定一个联合分布 ---- Hammersley-Clifford 多元高斯分布 当然,这个有点复杂,考虑个简单的,二元高斯,那么超参数就是: 二元高 ...

  6. iOS shell脚本打包

    原文链接:http://www.jianshu.com/p/5abbe0d61cef 参考链接:http://blog.csdn.net/potato512/article/details/52176 ...

  7. windows cmd命令显示UTF8设置

    windows cmd命令显示UTF8设置   在中文Windows系统中,如果一个文本文件是UTF-8编码的,那么在CMD.exe命令行窗口(所谓的DOS窗口)中不能正确显示文件中的内容.在默认情况 ...

  8. DLL断点调试

    一般来说调试DLL是把DLL工程和exe工程放到一个解决方案里.如果不放到一个解决方案里,那两者的输出目录要一致,属性-连接器-常规-输出目录.保证dll,dll的pdb,exe,exe的pdb在一个 ...

  9. linux下WEB服务器安装、配置VSFTP

    转载  http://www.oicto.com/centos-vsftp/?tdsourcetag=s_pcqq_aiomsg linux下WEB服务器安装.配置VSFTP 由 admin · 发布 ...

  10. 四、K3 Cloud 开发插件《K3 Cloud事件、方法、函数》

    1.简单帐表/动态表单几个主要事件 //初始化 public override void Initialize() //构建动态列 public override BOS.Core.Report.Re ...