JS文件放在头还是尾
目前绝大部分的浏览器都是采取阻塞方式(Scripts Block Downloads)加载Javascript文件的;javascript在头部会阻止其他元素并行加载(css,图片,网页);这种机制的好处就是我们可以随意在页面上使用那种JS库中的函数,因为页面肯定是在JS加裁之后呈现的,但是缺点也非常明显:一旦此Javascript文件过大,或网络连接不稳定,整个页面就会被阻塞一段时间,甚至空白。javascript放在底部,这样就可以和图片几乎同时下载,让图片尽快的下载下来。也可以:立即--交互性优先的在顶部;延迟--交互性稍后的尾部。
另外一般大型的网站都会采取非阻塞方式加载Javascript来提高性能(降低页面加载时间),Steves 在他的博文中提到了几种方法,如使用iframe, 动态添加script节点等来并行下载javascript文件。不过目前用得最多的应该还是动态添加script节点的方法。
JS文件放在头还是尾的更多相关文章
- js文件如何最后加载
总结一下,大概有三种方式 1.最简单粗暴的:将js文件放在最后写 2.window.onload当一个文档完全下载到浏览器中时,才会触发window.onload事件.这意味着页面上的全部元素对js而 ...
- springmvc web-info目录下无法引入的js文件无效
今天在联系spring的时候而然遇到了个不起眼的问题.那就是在html或者说jsp页面中引用js文件的时候总是提示找不到路径.eclipse更是抛出 No mapping to aa.js. 我就奇怪 ...
- ThinkPHP中关于JS文件如何添加类似__PUBLIC__图片路径
在对html样式进行优化的时候,经常会用到Js/jquery进行一些跳转切换的样式,而我们常做的就是在Js/jquery代码中嵌url图片链接代码,以实现动态交互的页面效果. 如下图所示:
- HTML中引用外部JS文件失效原因
今天在练习中碰到“引用外部的一个js文件但是却失效”的情况,实在不懂,百度后才知是引用的位置不对,错误的代码如下: <head> <meta charset="UTF-8& ...
- 由js文件中引入另外的js文件想到的
1. html中,使用<script src="../static/js/xxx.js"></script>引入js文件. 2. 在js文件中,引入js ...
- 详谈LABJS按需动态加载js文件
为了提高页面的打开和加载速度,我们经常把JS文件放在页面的尾部,但是有些JS必须放在页面前面,这样就会增加页面的加载时间:于是出现了按需动态加载的概念,这个概念就是当页面需要用到这个JS文件或者CSS ...
- 浏览器输入一个url的过程,以及加载完html文件和js文件的标志
简单理解: 当在浏览器地址栏输入一url时,浏览器会做以下几个步骤: 1.将url转化为ip地址,也就是DNS解析,(先找本地host文件中是否有对应的ip地址,如果有就直接用,没有的话,就按域名的二 ...
- flask-bootstrap 模版中所需的CSS/JS文件实现本地引入
Flask-Bootstrap默认是加载CDN的css与js文件,每次刷新页面都要访问到外网的cdn来获取css与js文件; 模版扩展来自于bootstrap/base.html,就以bootstra ...
- C++-模板的声明和实现为何要放在头文件中
源: http://blog.csdn.net/lqk1985/archive/2008/10/24/3136364.aspx 如何组织编写模板程序 发表日期: 1/21/2003 12:28:58 ...
随机推荐
- js使用转义符技巧输出HTML
有时候我们需要使用js输出html代码,会涉及一些标签.变量. 对于很长的html代码,为了让js具有较好的可读性,需要在js里对html代码进行一定的拆分.拼接. 简单明了版 通常我们这样做 var ...
- [转]Oracle因安装时未设定字符集导致中文乱码的解决方案
在CentOS 6.4上安装Oracle 11g没有设定字符集,采用的是操作系统默认字符集:WE8MSWIN1252,将字符集修改为:AL32UTF8. SQL> select userenv( ...
- Tomcat日志输出在linux和windows差异
tomca日志保存在${catalina}/logs目录下: 主要包括五类文件,开发测试常使用的日志主要保存在catalina.localhost日志中,且每天生成独立日志文件,结尾以日期命名,方便查 ...
- Html+css 练习写页面发现的错误及解决办法。
最近开始模仿写一些静态页面,今天模仿的是中华咨询网.写了一个简单的js(功能:当鼠标hover一级菜单的时候,设置二级菜单为显示,当鼠标hover二级菜单的选项时候,二级菜单不收回.当鼠标移出菜单一级 ...
- 懂DOS终于发挥了一点作用:phoenix bios密码破解
手上一个笔记本,不知开机密码,但bios是老phoenix的bios,出错后有溢出码,到网上下载了一个unlock6,满怀希望地进行破解,结果一运行,屏幕就没反应.试了几个都不行.最后怀疑是不是输出的 ...
- runtime MethodSwizzle 实践之 奇怪crash : [UIKeyboardLayoutStar release]: message sent to deallocated instance
情景: 使用MethodSwizzle 实现对数组.字典 等系统方法的安全校验.显然能达到预期效果,但实际发现当 键盘显示的情况下 home app 进入后台,再单击app 图标 切换回前台时 发 ...
- mybatis 3.2.3 maven dependency pom.xml 配置
<dependency> <groupId>org.mybatis</groupId> <artifactId>mybatis< ...
- C++实现单例模式
昨天面试的时候,面试官让我用C++或Java实现一个单例模式. 因为设计模式是在12年的时候学习过这门课,而且当时觉得这门课很有意思,所以就把课本读了几遍,所以印象比较深刻,但是因为实际编程中很少注意 ...
- thinkphp 关联模型配置代码
<?php /** * 公司与部门关联模型 */ class CompanyRelationModel extends RelationModel{ //主表名称 protected $tabl ...
- Hadoop源代码中的build-main.xml
在Hadoop的每一个Project中,都有build-main.xml,如下图所示: 这个文件其实是通过maven-ant插件生成的,在hadoop的每一个Maven工程中,都有一个pom文件,在p ...