大型网站页面(HTML)性能优化

本文介绍了一系列针对HTML优化的方法,包括减少HTTP请求数、压缩文件大小、利用版本控制优化缓存策略、精简页面元素等,旨在提升Web性能。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

除了语言层面上进行优化外,对Web开发,HTML的优化将很大程度上减轻服务器的负载,提高网站的性能

1). 减少HTTP请求数

打开网页,浏览器会发出很多请求,图片,脚本,每个对象的加载都需要花时间,需要减负载。

1. 合并CSS,Js文件 ,减少Http的请求数

2. 合并框架图片以及相当变动较少的图片,合成一张。有时直接用Css完成。

3. 合理的使用本地的Cached来缓存js/css/image

 

2). 减小被请求文件的大小。

1. 压缩Js体积, 删除没有空行,注释,变量名。大型的Js很乱,没有空行或换行,其实也是优化的表现

2. 压缩CSS体积

3. 用XHtml + Css 方式搭建网站结构,提高CSS的重用性

4. 用服务端GZip压缩JS/Css 文件, 缩小传输文件大小

 

3). 通过版本化控制客户端的缓存

1. 通常JS/CSS这类文件改动比较频繁,为加载加快,可能要设置这类文件的过期时间,为几天后从而实现缓存,那我们的问题就是如何及时的更改这些被缓存的文件了。

2. 通过修改JS版本来及时告诉浏览器, 如: 该JS文件名,路径, URLRewrite, 大版本不变,小版本不断追加,等一定时间后统一更新

 

4). 帮页面减肥 。简洁风格,少用Flash等

5). 删除页眉可有可无的内容。 如空格,注释

6). 删除页面代码中的空语句

7). 删除HTMl中的默认值,什么颜色,对齐之类的

8. 优化CSS文件

9. Visibility 快于Display

  图片的时隐时现,如果是保持决定位置,用Visibility 好。 none,hidden  . visibility: hindden

10. 缓存区是区分大小写的,保持url大小写一致性

11. 让html标记有始终。 减少浏览器的判断时间

12. 不用将全部内容塞入一个Table中。  因为Talbe要等内容加载完毕才显示出来。 如果某些内容有错,将拖延页面的访问速度。

13. 如果有广告代码,放入iframe中最好了。<iframe src="http://www.XXX.com " marginwidth="0"marginheight="0" leftMargin="0" topMargin="0"frameborder="0" scrolling="no"></frame>

14. 把Javascript移到HTML文件末尾

15. JS会阻塞后面的页面的显示。

16. 友情链接的学问,尽量用文字。

17. 优化图片。 Gif图片比较少,一般做Logo,按钮,表情。 PNG,做透明背景比较多

18. 网址后面加入一个反斜杠. www.maticsoft.com/220/ ,让服务器立即知道访问的是个文件夹。

19. 指定图片的大小,让浏览器一目了然。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值