JavaShuo
栏目
标签
减小页面加载时间(感知或实际加载时间)的方法。
时间 2019-12-11
标签
减小
页面
加载
时间
感知
实际
方法
繁體版
原文
原文链接
版权声明:本文为博主原创文章,未经博主容许不得转载。
css
1. 尽可能减小页面中重复的HTTP请求数量
比较直接的理解就是要减小调用其余页面、文件的数量。咱们在使用css格式控制的时候,常常会采用background载入不少图形文件,而每一个background的图像都会产生1次HTTP请求,通常咱们为了让页面生动活泼会大量使用background来加载背景图,要改善这个情况,能够采用css的1个有用的background-position属 性来加载背景图,咱们将须要频繁加载的多个图片合成为1个单独的图片,须要加载时能够采用:background:url(....) no-repeat x-offset y-offset;的形式加载便可将这部分图片加载的HTTP请求缩减为1个。
2. 服务器开启gzip压缩
即将须要传输的内容压缩后传输到客户端再解压,这样在网络上传输的 数据量就会大幅减少。一般在服务器上的Apache、Nginx能够直接开启这个设置,也能够从代码角度直接设置传输文件头,增长gzip的设置,也能够从 负载均衡设备直接设置。不过须要留意的是,这个设置会略微增长服务器的负担。建议服务器性能不是很好的网站,要慎重考虑。
3. css样式的定义放置在文件头部
4. Javascript脚本放在文件末尾
咱们都知道网页文件的载人是从上到下的加载的,而有不少Javascript脚本执行效率比较低下,或者在网页前面都不须要执行的,若是将这些脚本放置到页面比较靠前的位置,极可能会致使网站内容载入速度降低甚至无**常加载,因此通常将这些脚本放置在网页文件末尾,必定要放 置在前面的脚本要改用所谓的“后载入”方式加载,在主体网页加载完成后再加载,防止其影响到主体网页的加载速度。
5. 压缩Javascript、CSS代码
通常js、css文件中存在大量的空格、换行、注释,这些利于阅读,若是可以压缩掉,将会颇有利于网络传输。这方面的工具也有不少,能够在百度里搜索一下关键字“css代码压缩”,或者“js代码压缩”将会发现有不少网站都提供这样的功能,固然了你也能够本身写程序来作这个工做,若是你会的话。就拿咱们这个网站来讲吧。刚开始上传这个网站的时候,个人不少Css代码都没有压缩,后面发现了这个问题,我就上网找了相关的网站的压缩代码的功能,最后就把不少CSS文件都压缩了。这个压缩比率仍是比较高的,通常都有50%左右。因而可知,这个代码压缩对于网页的加载仍是颇有用的。
6. Ajax采用缓存调用
Ajax调用都采用缓存调用方式,通常采用附加特征参数方式实现,注意其中的<script src=”xxx.js?{VERHASH}”,{VERHASH}就是特征参数,这个参数不变化就使用缓存文件,若是发生变化则从新下载新文件或更新信息。
7. 尽量减小DCOM元素
这个很好理解,就是尽量减小网页中各类<>元素数量,例如<table>的冗余很严重,而咱们彻底能够用<div>取代之。
8. 使用多域名负载网页内的多个文件、图片
9. 使用CDN
10. 在服务器端配置control-cache last-modify-date
11.在服务器配置Entity-Tag if-none-match
相关文章
1.
请说出三种减小页面加载时间的方法。(加载时间指感知的时间或者实际加载时间)
2.
HTML:减小页面加载时间的方法
3.
减低页面加载时间的方法
4.
web开发的性能准则(减小页面加载时间方面)
5.
减小JS下载时间
6.
如何减少页面载入时间
7.
oracle 时间加减
8.
PostgreSQL时间加减
9.
python时间加减
10.
加载html页面的同时加载方法
更多相关文章...
•
SQLite 日期 & 时间
-
SQLite教程
•
ionic 加载动作
-
ionic 教程
•
使用阿里云OSS+CDN部署前端页面与加速静态资源
•
常用的分布式事务解决方案
相关标签/搜索
加载
时间区间
时间
间时
间或
加减
懒加载
加载项
加载更多
加减法
Redis教程
红包项目实战
PHP教程
面试
算法
0
分享到微博
分享到微信
分享到QQ
每日一句
每一个你不满意的现在,都有一个你没有努力的曾经。
最新文章
1.
CVPR 2020 论文大盘点-光流篇
2.
Photoshop教程_ps中怎么载入图案?PS图案如何导入?
3.
org.pentaho.di.core.exception.KettleDatabaseException:Error occurred while trying to connect to the
4.
SonarQube Scanner execution execution Error --- Failed to upload report - 500: An error has occurred
5.
idea 导入源码包
6.
python学习 day2——基础学习
7.
3D将是页游市场新赛道?
8.
osg--交互
9.
OSG-交互
10.
Idea、spring boot 图片(pgn显示、jpg不显示)解决方案
本站公众号
欢迎关注本站公众号,获取更多信息
相关文章
1.
请说出三种减小页面加载时间的方法。(加载时间指感知的时间或者实际加载时间)
2.
HTML:减小页面加载时间的方法
3.
减低页面加载时间的方法
4.
web开发的性能准则(减小页面加载时间方面)
5.
减小JS下载时间
6.
如何减少页面载入时间
7.
oracle 时间加减
8.
PostgreSQL时间加减
9.
python时间加减
10.
加载html页面的同时加载方法
>>更多相关文章<<