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


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 Tips(3) 关于$()包装集内元素的改变
Dec 14 Javascript
基于JavaScript自定义构造函数的详解说明
Apr 24 Javascript
Window.Open如何在同一个标签页打开
Jun 20 Javascript
css与javascript跨浏览器兼容性总结
Sep 15 Javascript
浅谈Sublime Text 3运行JavaScript控制台
Jun 06 Javascript
下一代Bootstrap的5个特点 超酷炫!
Jun 17 Javascript
seajs模块之间依赖的加载以及模块的执行
Oct 21 Javascript
详解jQuery lazyload 懒加载
Dec 19 Javascript
Javascript中return的使用与闭包详解
Jan 11 Javascript
Vue制作Todo List网页
Apr 26 Javascript
原生js实现密码输入框值的显示隐藏
Jul 17 Javascript
微信小程序实现获取用户信息并存入数据库操作示例
May 07 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
mysql建立外键
2006/11/25 PHP
js下函数般调用正则的方法附代码
2008/06/22 PHP
如何用phpmyadmin设置mysql数据库用户的权限
2012/01/09 PHP
浅析PHP中Collection 类的设计
2013/06/21 PHP
Yii2框架dropDownList下拉菜单用法实例分析
2016/07/18 PHP
PHP call_user_func和call_user_func_array函数的简单理解与应用分析
2019/11/25 PHP
ie和firefox中img对象区别的困惑
2006/12/27 Javascript
javascript入门基础之私有变量
2010/02/23 Javascript
TinyMCE 新增本地图片上传功能
2010/11/05 Javascript
Javascript浅谈之引用类型
2013/12/18 Javascript
jQuery的缓存机制浅析
2014/06/07 Javascript
JavaScript验证18位身份证号码最后一位正确性的实现代码
2014/08/07 Javascript
常用的JavaScript WEB操作方法分享
2015/02/28 Javascript
HTML+CSS+JS实现完美兼容各大浏览器的TABLE固定列
2015/04/26 Javascript
vue 2.0组件与v-model详解
2017/03/27 Javascript
如何在Angular应用中创建包含组件方法示例
2019/03/23 Javascript
Vue+Element实现动态生成新表单并添加验证功能
2019/05/23 Javascript
原生js+ajax分页组件
2020/01/30 Javascript
[06:53]2018DOTA2国际邀请赛寻真——勇于创新的Vici Gaming
2018/08/14 DOTA
Python pickle类库介绍(对象序列化和反序列化)
2014/11/21 Python
解决Python字典写入文件出行首行有空格的问题
2017/09/27 Python
浅谈python日志的配置文件路径问题
2018/04/28 Python
Python 获取中文字拼音首个字母的方法
2018/11/28 Python
Python3 socket即时通讯脚本实现代码实例(threading多线程)
2020/06/01 Python
django表单中的按钮获取数据的实例分析
2020/07/31 Python
印度尼西亚最好的小工具在线商店:Erafone.com
2019/03/26 全球购物
大学生应聘推荐信范文
2013/11/19 职场文书
班长竞选演讲稿
2014/04/24 职场文书
关于运动会的口号
2014/06/07 职场文书
课程设计的心得体会
2014/09/03 职场文书
企业爱岗敬业演讲稿
2014/09/04 职场文书
2014年信息技术工作总结
2014/12/16 职场文书
在JavaScript中如何使用宏详解
2021/05/06 Javascript
关于html选择框创建占位符的问题
2021/06/09 HTML / CSS
Django框架中视图的用法
2022/06/10 Python
SQL Server数据库的三种创建方法汇总
2023/05/08 MySQL