性能优化之代码优化页面加载速度


Posted in Javascript onMarch 01, 2017

页面代码的优化对于页面加载速度也有不小的影响,最广为人知的:

HTML头部的JavaScript和写在HTML标签中的Style会阻塞页面的渲染,因此CSS放在页面头部并使用Link方式引入,JavaScript的引入放在页面尾。

其次还有:

1.按需加载,把统计、分享等 JS 在页面 onload 后再进行加载,可以提高访问速度;

2.优化 Cookie ,减少 Cookie 体积;

3.避免 []() 的 src 为空;

4.尽量避免设置图片大小,多次重设图片大小会引发图片的多次重绘,影响性能;

5.合理使用display属性:        

  • display:inline后不应该再使用width、height、margin、padding以及float
  • display:inline-block后不应该再使用float
  • display:block后不应该再使用vertical-align
  • display:table-*后不应该再使用margin或者float

6.不滥用Float 和 Web 字体;

7.尽量使用CSS3动画;

8.使用 AJAX 异步加载部分请求;

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
深入认识JavaScript中的函数
Jan 22 Javascript
超级简单的图片防盗(HTML),好用
Apr 08 Javascript
JavaScript基础语法让人疑惑的地方小结
May 23 Javascript
javascript限制文本框输入值类型的方法
May 07 Javascript
JavaScript通过使用onerror设置默认图像显示代替alt
Mar 01 Javascript
JS实现保留n位小数的四舍五入问题示例
Aug 03 Javascript
JS 60秒后重新发送验证码的实例讲解
Jul 26 Javascript
React实践之Tree组件的使用方法
Sep 30 Javascript
原生JS实现的放大镜特效示例【测试可用】
Dec 08 Javascript
茶余饭后聊聊Vue3.0响应式数据那些事儿
Oct 30 Javascript
js中script的上下放置区别,Dom的增删改创建操作实例分析
Dec 16 Javascript
JS highcharts实现动态曲线代码示例
Oct 16 Javascript
详解AngularJS通过ocLazyLoad实现动态(懒)加载模块和依赖
Mar 01 #Javascript
Javascript仿京东放大镜的效果
Mar 01 #Javascript
Ajax实现不刷新取最新商品
Mar 01 #Javascript
Angular1.x复杂指令实例详解
Mar 01 #Javascript
JS中使用 after 伪类清除浮动实例
Mar 01 #Javascript
Angular1.x自定义指令实例详解
Mar 01 #Javascript
轻松学习Javascript闭包
Mar 01 #Javascript
You might like
小偷PHP+Html+缓存
2006/12/20 PHP
一个PHP模板,主要想体现一下思路
2006/12/25 PHP
ThinkPHP调用百度翻译类实现在线翻译
2014/06/26 PHP
JavaScript表单常用验证集合
2008/01/16 Javascript
使用JavaScript库还是自己写代码?
2010/01/28 Javascript
JQuery 插件模板 制作jquery插件的朋友可以参考下
2010/03/17 Javascript
javascript使用isNaN()函数判断变量是否为数字
2013/09/21 Javascript
jQuery计算textarea中文字数(剩余个数)的小程序
2013/11/28 Javascript
jQuery中get和post方法传值测试及注意事项
2014/08/08 Javascript
纯javascript判断查询日期是否为有效日期
2015/08/24 Javascript
基于JS代码实现当鼠标悬停表格上显示这一格的全部内容
2016/06/12 Javascript
javascript 广告移动特效的实现代码
2016/06/25 Javascript
教你快速搭建Node.Js服务器的方法教程
2017/03/30 Javascript
javascript实现文件拖拽事件
2018/03/29 Javascript
vue路由前进后退动画效果的实现代码
2018/12/10 Javascript
python的正则表达式re模块的常用方法
2013/03/09 Python
基于Python和Scikit-Learn的机器学习探索
2017/10/16 Python
Python3爬虫教程之利用Python实现发送天气预报邮件
2018/12/16 Python
Python实现的逻辑回归算法示例【附测试csv文件下载】
2018/12/28 Python
python 对类的成员函数开启线程的方法
2019/01/22 Python
使用python实现滑动验证码功能
2019/08/05 Python
Python操作SQLite/MySQL/LMDB数据库的方法
2019/11/07 Python
python机器学习库xgboost的使用
2020/01/20 Python
python使用梯度下降算法实现一个多线性回归
2020/03/24 Python
python 星号(*)的多种用途
2020/09/21 Python
佐卡伊官网:中国知名珠宝品牌
2017/02/05 全球购物
萨克斯第五大道英国:Saks Fifth Avenue英国
2019/04/01 全球购物
GAZMAN官网:澳大利亚领先的男装品牌
2019/12/19 全球购物
软件工程师面试题
2012/06/25 面试题
请问软件开发中的设计模式你会使用哪些
2015/05/13 面试题
大专生的学习自我评价
2013/12/04 职场文书
运动会标语
2014/06/21 职场文书
教师党员先进性教育自我剖析材料思想汇报
2014/09/24 职场文书
生日祝酒词大全
2015/08/10 职场文书
MySQL 逻辑备份与恢复测试的相关总结
2021/05/14 MySQL
oracle索引总结
2021/09/25 Oracle