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


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 相关文章推荐
锋利的jQuery 要点归纳(三) jQuery中的事件和动画(下:动画篇)
Mar 24 Javascript
js用正则表达式来验证表单(比较齐全的资源)
Nov 17 Javascript
Jquery弹出层插件ThickBox的使用方法
Dec 09 Javascript
Javascript模仿淘宝信用评价实例(附源码)
Nov 26 Javascript
Js 获取当前函数参数对象的实现代码
Jun 20 Javascript
JS中的事件委托实例浅析
Mar 22 Javascript
JS点击动态添加标签、删除指定标签的代码
Apr 18 Javascript
JavaScript数组去重算法实例小结
May 07 Javascript
又拍云 Node.js 实现文件上传、删除功能
Oct 28 Javascript
详解Bootstrap 学习(一)入门
Apr 12 Javascript
原生js中运算符及流程控制示例详解
Jan 05 Javascript
Vue实现圆环进度条的示例
Feb 06 Vue.js
详解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
ip签名探针
2006/10/09 PHP
php基础学习之变量的使用
2011/06/09 PHP
PHP递归统计系统中代码行数
2019/09/19 PHP
HTTP状态代码以及定义(解释)
2007/02/02 Javascript
javascript Ext JS 状态默认存储时间
2009/02/15 Javascript
给事件响应函数传参数的四种方式小结
2013/12/05 Javascript
extjs4 treepanel动态改变行高度示例
2013/12/17 Javascript
使用JavaScript 实现的人脸检测
2015/03/24 Javascript
深入解析JavaScript框架Backbone.js中的事件机制
2016/02/14 Javascript
关于js原型的面试题讲解
2016/09/25 Javascript
将angular.js项目整合到.net mvc中的方法详解
2017/06/29 Javascript
js实现QQ面板拖拽效果(慕课网DOM事件探秘)(全)
2017/09/19 Javascript
seaJs使用心得之exports与module.exports的区别实例分析
2017/10/13 Javascript
Angular ElementRef简介及其使用
2018/10/01 Javascript
使用flow来规范javascript的变量类型
2019/09/12 Javascript
node 标准输入流和输出流代码实例
2019/09/19 Javascript
vue路由守卫,限制前端页面访问权限的例子
2019/11/11 Javascript
JavaScript代理模式原理与用法实例详解
2020/03/10 Javascript
js仿京东放大镜效果
2020/08/09 Javascript
[02:42]2014DOTA2国际邀请赛 三冰专访:我会打到Ti20
2014/07/13 DOTA
[57:36]DOTA2-DPC中国联赛 正赛 SAG vs CDEC BO3 第三场 2月1日
2021/03/11 DOTA
Python3.5.3下配置opencv3.2.0的操作方法
2018/04/02 Python
pandas string转dataframe的方法
2018/04/11 Python
PyQt5 控件字体样式等设置的实现
2020/05/13 Python
英国豪华装饰照明品牌的在线零售商:Inspyer Lighting
2019/12/10 全球购物
自考生毕业自我鉴定
2013/10/10 职场文书
物业工作计划书
2014/01/10 职场文书
幼儿园元旦活动感言
2014/03/02 职场文书
工业自动化专业自荐信范文
2014/04/10 职场文书
银行竞聘演讲稿范文
2014/04/23 职场文书
舞蹈兴趣小组活动总结
2014/07/07 职场文书
美德少年事迹材料500字
2014/08/19 职场文书
幼儿园大班教师个人总结
2015/02/05 职场文书
2015年母亲节活动策划方案
2015/05/04 职场文书
2016年寒假社会实践活动心得体会
2015/10/09 职场文书
CSS实现章节添加自增序号的方法
2021/06/23 HTML / CSS