前端性能优化需要从前端的资源类型分析,以减少请求资源和请求时间为目的。目前的类型包括图片、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. JDK8+Tomcat8配置https【转】

    生成密钥对 我比较喜欢密钥对这个名字,因为它非常明确了HTTPS在传输过程中需要的两个钥匙(公钥和私钥).如果不太了解HTTPS的,可以要到搜索引擎去搜索一下HTTPS的原理. 首先,确保java的目 ...

  2. FPGA编程—组合逻辑编码器等verilog实现

    本篇博客主要实现对组合逻辑电路的一些常用模块的实现.组合逻辑中,包括译码器,编码器,输入输出选择器,数值比较器,算法单元等.  先来实现编码器,最常用的8-3编码器,这里先讲一下要用到的case ,c ...

  3. 让ubuntu下的eclipse支持GBK编码

    把Windows下工程导入Linux下Eclipse中,由于以前的工程代码,都是GBK编码,而Ubuntu默认不支持GBK编码,所以,我们要让Ubuntu支持GBK,方法如下: 1.修改/var/li ...

  4. laravel项目composer安装

    1.下载 Composer (https://pkg.phpcomposer.com/#how-to-install-composer) 安装前请务必确保已经正确安装了 PHP.打开命令行窗口并执行 ...

  5. linux环境下,对于一个大文件,如何查看其中某行的内容

    需求说明: 今天在做mysql数据导入的过程中,导入到最后有一个报错,报某张表不存在.然后就想看看这行到底是在做什么操作的时候报的错误. 报错信息: [mysql@host---- ~]$ cat n ...

  6. duilib进阶教程 -- TreeView控件(6)

    代码下载:http://download.csdn.net/detail/qq316293804/6483905 上一个教程中,界面已经和迅雷一模一样啦,大小和位置一个像素都不差哟,亏得Alberl调 ...

  7. Android异步处理系列文章四篇之一使用Thread+Handler实现非UI线程更新UI界面

    目录: Android异步处理一:使用Thread+Handler实现非UI线程更新UI界面Android异步处理二:使用AsyncTask异步更新UI界面Android异步处理三:Handler+L ...

  8. Kettle能做什么?

    简介 Kettle是一款国外开源的ETL工具,纯java编写,可以在Window.Linux.Unix上运行,绿色无需安装,数据抽取高效稳定. Kettle 中文名称叫水壶,该项目的主程序员MATT  ...

  9. findpanel 的相关代码

    https://blog.csdn.net/zengcong2013/article/details/43118189 In addition to this method, you can use ...

  10. 170825、SolrCloud 分布式集群部署步骤

    安装软件包准备 apache-tomcat-7.0.54 jdk1.7 solr-4.8.1 zookeeper-3.4.5 注:以上软件都是基于 Linux 环境的 64位 软件,以上软件请到各自的 ...