当前位置:首页 > 日记 > 正文

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

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

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

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 异步加载部分请求;

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

相关文章

PHP实现链式操作的三种方法详解

PHP实现链式操作的三种方法详解

方法,操作,链式,三种,详解,本文实例讲述了PHP实现链式操作的三种方法。分享给大家供大家参考,具体如下:在php中有很多字符串函数,例如要先过滤字符串收尾的空格,再求出其长度,一般的写法是:strlen(trim($str))如果要实现类似js中的链式操作,比如像…

斜箭头符号图案大全

斜箭头符号图案大全

箭头,图案,符号,大全,电脑软件,斜箭头符号在很多地方都会被用到,比如图表中、游戏名字以及个性QQ资料,箭头符号一般作指方向目标之用。但是斜箭头怎么打呢?还是按照惯例先给大家列出斜箭头符号大全,方便不是经常使用或不需要了解教程的同学直接…

ps怎么设计动态波浪显示的文字动画

ps怎么设计动态波浪显示的文字动画

动态,波浪,文字,显示,动画,ps中想要设计一个不断扭曲晃动的文字,该怎么设计呢?下面我们就来看看详细的教程。软件名称:Adobe Photoshop CS5 V12.0 官方简体中文破解版软件大小:981.4MB更新时间:2014-04-281、首先启动Photoshop cs5,执行文件-打开…

js禁止Backspace键使浏览器后退的

js禁止Backspace键使浏览器后退的

方法,浏览器,电脑软件,js,Backspace,在项目中遇到按下Backspace键让浏览器后退的问题,上网搜了几种解决方案都不太理想。于是集众人之智,采众家之长,归纳如下:1、在公用js中定义阻止Backspace的方法function banBackSpace(e){ var ev = e || wi…

JavaScript 值类型和引用类型的初

JavaScript 值类型和引用类型的初

值类型,推荐,引用类型,电脑软件,JavaScript,值类型:也称为原始数据或原始值(primitive value)。这类值存储在栈(stack)中,栈是内存中一种特殊的数据结构,也称为线性表,栈按照后进先出的原则存储数据,先进入的数据被压入栈底,最后插入(push)的数据放在栈…

Laravel5.5新特性之友好报错以及展

Laravel5.5新特性之友好报错以及展

新特性,报错,详解,友好,电脑软件,前言期待已久的laravel5.5 很快将为大家呈现,本文将给大家详细介绍关于Laravel5.5新特性之友好报错及展示的相关内容,分享出来供大家参考学习,话不多说了,来一起看看详细的介绍:Laravel5.5 获取源代码如今Larave…

ES6正则表达式扩展笔记

ES6正则表达式扩展笔记

正则表达式,扩展,笔记,电脑软件, 前面的话  正则表达式是javascript操作字符串的一个重要组成部分,但在以往的版本中并未有太多改变。然而,在ES6中,随着字符串操作的变更, ES6也对正则表达式进行了一些更新。本文将详细介绍ES6正则表达式扩展…

正则表达式实现匹配连续数字的方法

正则表达式实现匹配连续数字的方法

数字,连续,正则表达式,方法,电脑软件,实现的要求如下:纯数字 5-7位之间 前三位相同 从第四位开始连续 如下面的例子:11123 #正确22234 #正确33345 #正确333456 #正确2223456 #正确0001234 #正确00012345 #错误:此行长度超…

在Excel表格中如何给数字添加单位

在Excel表格中如何给数字添加单位

单位,数字,表格,电脑软件,Excel,  在Excel表格中,我们一般只会输入数字,那么成绩分数单位该如何设置呢?以下是小编为您带来的关于在Excel表格中给数字添加单位,希望对您有所帮助。在Excel表格中给数字添加单位1、点击“开始”选项…

U盘装系统出现ntldr is missing

U盘装系统出现ntldr is missing

装系统,电脑软件,ntldr,missing,小编在使用U盘安装系统时,安装完系统后,重启电脑,系统却出现NTLDR is missing press any key to restart的错误提示,导致无法正常进入系统。这是怎么回事呢?今天小编就和大家说说解决U盘装系统出现ntldr is missi…

Yii清理缓存的方法

Yii清理缓存的方法

方法,清理缓存,电脑软件,Yii,本文实例讲述了Yii清理缓存的方法。分享给大家供大家参考,具体如下:html:复制代码 代码如下:<button onclick="clearCache()">ClearCache</button>js:function clearCache(){ $.get('../eng/index.php?r=site…

如何把ai路径导入c4d?ai路径导入c4d

如何把ai路径导入c4d?ai路径导入c4d

路径,通用方法,电脑软件,ai,c4d,ai制作的文字路径怎么导入c4d?如果想在C4D里做一个漂亮的字体,那么就需要在AI里做出效果,然后再导入C4D,那么问题来了,怎么把ai文件保存成路径文件,可以倒入c4d呢?下面小编就教大家ai路径导入c4d的通用方法,有图有…