js 延迟加载 改变JS的位置加快网页加载速度_基础知识

当一个网站有很多js代码要加载,js代码放置的位置在一定程度上将会影像网页的加载速度,为了让我们的网页加载速度更快,本文总结了一下几个注意点:
1、延迟加载js代码

复制代码 代码如下:

<script type=”text/javascript” src=”" id=”my”></script>
<script type=”text/javascript”>
setTimeout(“document.getElementById(‘my').src='include/php100.php'; “,3000);//延时3秒
</script>

这样通过延迟加载js代码,给网页加载留出更多的时间!

2、js最后加载方案一
在需要插入JS的地方插入以下代码:
程序代码

复制代码 代码如下:

<span id=”L4EVER”>LOADING…</span>

当然,那个LOADING…你可以换成自己喜欢的小图片.看起来很有AJAX效果呢.
然后在页面最底端插入:
程序代码

复制代码 代码如下:

<span id=”AD_L4EVER”>你的JS代码在这里!</span >
<script>L4EVER.innerHTML=AD_L4EVER.innerHTML;AD_L4EVER.innerHTML=”";</script>

3、让JS最后加载方案二
这个牵涉到网页的加载顺序问题,例如引入外部js脚本文件时,如果放入html的head中,则页面加载前该js脚本就会被加载入页面,而放入body中,则会按照页面从上倒下的加载顺序来运行javascript的代码~~~ 所以我们可以把js外部引入的文件放到页面底部,来让js最后引入,从而加快页面加载速度。

时间: 2024-08-01 17:49:49

js 延迟加载 改变JS的位置加快网页加载速度_基础知识的相关文章

想加快网页加载速度?开启GZIP压缩吧

中介交易 http://www.aliyun.com/zixun/aggregation/6858.html">SEO诊断 淘宝客 云主机 技术大厅 网站页面体积大,网站加载很慢,这是很多站长很头疼的问题.可是为了把体积缩小,总不可能把内容全部删掉吧,鱼和熊掌可以兼得吗?答案是可以的.现在很多服务器以及空间都支持Gzip压缩.利用Gzip压缩可以极大地减小页面体积,加快网页浏览速度. Gzip压缩,什么东东?gzip 是在 Linux 系统中经常使用的一个对文件进行压缩和解压缩的命令,一般

网站重构之加快网页加载速度

现在的网络越来越发达,什么样的网站都已经出现了,日新月异的今天网页加载的速度已经是一个面临急切危机的事.提高网页打开速度当然也有方法的,分别是加大宽带,对电脑做优化工作,还有就是在制作网页的时候做好相应的优化,听起来也难,其实不然.我们只要做到以下的几点就差不多可以提高一些速度了. 图片的优化: 谈到图片优化的问题我想网页设计工作者应该是很清楚的,尽量把图片切割的越小打开的速度越快吧,还有降低图像的质量,使用恰当的格式,减去没有必要存在的图片(想颜色单一的地方用颜色代码代替就可以了). css优

让广告代码不再影响你的网页加载速度_表单特效

做一些联盟广告时,由于联盟广告的加载慢,整体页面的显示速度也会变慢,如果加入下面的代码就可以有效地解决这个问题. 第一步:把这段代码放在你要放广告的网页位置: <span id=\"andy\">广告载入中...</span> 第二步:把这段代码放到页底: <span id=\"span_andy\">  这里放广告的JS代码或其他加载速度比较慢的内容都可以.  </span>  <script type=\&q

Javascript vue.js表格分页,ajax异步加载数据_基础知识

分页一般和表格一起用,分页链接作为表格的一部分,将分页链接封装成一个独立的组件,然后作为子组件嵌入到表格组件中,这样比较合理. 效果: 代码: 1.注册一个组件 js Vue.component('pagination',{ template:'#paginationTpl', replace:true, props:['cur','all','pageNum'], methods:{ //页码点击事件 btnClick: function(index){ if(index != this.cu

js图片预加载示例_基础知识

js图片预加载简单示例 复制代码 代码如下: function loadImage(url, callback) {    if(url!='null') {        var img = new Image();        img.src = url;        if(img.complete) {            callback(img);        } else {            img.onload = function(){               

谷歌或将网页加载速度纳入PageRank影响因素

北京时间11月14日消息,据国外http://www.aliyun.com/zixun/aggregation/31646.html">媒体报道,谷歌搜索质量部门主管马特-卡茨(Matt-Cutts)于近日暗示,谷歌可能会将网页加载速度纳入页面排名影响因素. 马特-卡茨说:"过去,我们从未将页面加载速度纳入搜索排名影响因素,但谷歌内部很多人认为网页的速度应当更快.快速上网应当成为一种良好的体验,因此如果你是一个速度很快的网站,那么你应当得到一些好处,这很正常.如果你的网站加载速度

用 Flask 来写个轻博客 (28) — 使用 Flask-Assets 压缩 CSS/JS 提升网页加载速度

目录 目录 前文列表 扩展阅读 Flask-Assets 将 Flask-Assets 应用到项目中 前文列表 用 Flask 来写个轻博客 (1) - 创建项目 用 Flask 来写个轻博客 (2) - Hello World! 用 Flask 来写个轻博客 (3) - (M)VC_连接 MySQL 和 SQLAlchemy 用 Flask 来写个轻博客 (4) - (M)VC_创建数据模型和表 用 Flask 来写个轻博客 (5) - (M)VC_SQLAlchemy 的 CRUD 详解 用

提高网页加载速度的初步简单技巧方式

网页的加载速度是评估网站质量一个重要指标.原因在于大多数用户能够容忍的网页加载时间只有几秒,如果超出了访客的忍受范围他们会毫不留情地关掉你的网 页,所以网页载入速度会极大地影响网站的流量和访问.以下总结了几种可以明显提高网站加载速度的初步简单技巧方式,如果你的网站存在载入速度慢的问题不妨 与此为参考对网页做些初步优化. 网页加载提速之 – 优化网页图片文件 你的网页一定有图片,加载一个网页往往图片的总尺寸是最大的,特别是那些颜色丰富的背景图片和大副广告图片.所以一般要在同等图片质量的情况下要尽可

如何提高网页加载速度

1.减少页面请求: 从WEB运行原理上讲,IIS请求是无状态的,在服务器端一直是连接和关闭的不断进行着,如果能减少服务器请求,总的时间将会减少. 之前我下载163邮箱的登陆页面的图片时发现,它们的只用到了一个图片来完成整个页面的所有图片,当时我就纳闷了,这跟平时做的网站不一样呀.然来这样做减少浏览器的请求次数,用httpwatch你会发现请求的总时间大大减少了.同样的想法,在做css样式,JavaScript代码的时候也要做到尽可能的放在一个文件下来减少WEB请求. 2.页面压缩技术,给我们js