编程 Javascript

脚本合并提升javascript性能示例

Posted in Javascript onFebruary 24, 2014

每个<script>标签初始下载时都会阻塞页面渲染，所以减少页面包含的<script>标签数量有助于改善这一情况。这不仅仅针对外链脚本，内嵌脚本的数量同样也要限制。浏览器在解析HTML页面的过程中每遇到一个<script>标签，都会因执行脚本而导致一定的延时，因此最小化延迟时间将会明显改善页面的总体性能。

通常一个大型网站或网络应用需要依赖数个javascript文件。你可以把多个文件合并成一个，这样只需引用一个<script>标签，就可以减少性能消耗。文件合并的工作可通过离线打包工具或者类似像YaHoo!combo handle的实时在线服务来实现。

<!-- 优化前： --> 
<html> 
<head> 
<title>Script Example</title> 
</head> 
<body> 
<p>Hello world!</p> 
<script type="http://yui.yahooapis.com/combo?2.7.0/build/yahoo/yahoo-min.js"></script> 
<script type="http://yui.yahooapis.com/combo?2.7.0/build/event/event-min.js"></script> 
</body> 
</html> <!-- 优化后： --> 
<html> 
<head> 
<title>Script Example</title> 
</head> 
<body> 
<p>Hello world!</p> 
<script src="http://yui.yahooapis.com/combo?2.7.0/build/yahoo/yahoo-min.js&2.7.0/build/event/event-min.js" type="text/javascript"></script> 
</body> 
</html>

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

jquery easyui combox一些实用的小方法

Dec 25 Javascript

如何在MVC应用程序中使用Jquery

Nov 17 Javascript

JavaScript中对JSON对象的基本操作示例

May 21 Javascript

js基于cookie方式记住返回页面用法示例

May 27 Javascript

jQuery实现鼠标滚动图片延迟加载效果附源码下载

Jun 28 Javascript

微信小程序图片自适应支持多图实例详解

Jun 21 Javascript

详解Angular5 服务端渲染实战

Jan 04 Javascript

解决vue-router进行build无法正常显示路由页面的问题

Mar 06 Javascript

Vue之beforeEach非登录不能访问的实现（代码亲测）

Jul 18 Javascript

解决vue打包后刷新页面报错：Unexpected token

Aug 27 Javascript

微信小程序中weui用法解析

Oct 21 Javascript

使用typescript快速开发一个cli的实现示例

Dec 09 Javascript

动态加载脚本提升javascript性能

Feb 24 #Javascript

巧用局部变量提升javascript性能

Feb 24 #Javascript

javascript中的原型链深入理解

Feb 24 #Javascript

JSONP获取Twitter和Facebook文章数的具体步骤

Feb 24 #Javascript

动态加载js、css等文件跨iframe实现

Feb 24 #Javascript

js操纵dom生成下拉列表框的方法

Feb 24 #Javascript

js设置function参数默认值(适合没有传参情况)

Feb 24 #Javascript

You might like

php求两个目录的相对路径示例(php获取相对路径)

2014/03/27 PHP

PHPCMS忘记后台密码的解决办法

2016/10/30 PHP

Yii2框架BootStrap样式的深入理解

2016/11/07 PHP

php之可变变量的实例详解

2017/09/12 PHP

php使用curl伪造浏览器访问操作示例

2019/09/30 PHP

在多个页面使用同一个HTML片段《续》

2011/03/04 Javascript

jQuery阻止同类型事件小结

2013/04/19 Javascript

jQuery获取iframe的document对象的方法

2014/10/10 Javascript

js光标定位文本框回车表单提交问题的解决方法

2015/05/11 Javascript

jQuery、layer实现弹出层的打开、关闭功能

2017/06/28 jQuery

JS中使用gulp实现压缩文件及浏览器热加载功能

2017/07/12 Javascript

解决vue-router中的query动态传参问题

2018/03/20 Javascript

理理Vue细节（推荐）

2019/04/16 Javascript

websocket4.0+typescript 实现热更新的方法

2019/08/14 Javascript

Vue项目页面跳转时浏览器窗口上方显示进度条功能

2020/03/26 Javascript

Python语言的12个基础知识点小结

2014/07/10 Python

深入理解python多进程编程

2016/06/12 Python

[原创]使用豆瓣提供的国内pypi源

2017/07/02 Python

Python获取本机所有网卡ip，掩码和广播地址实例代码

2018/01/22 Python

python3中获取文件当前绝对路径的两种方法

2018/04/26 Python

深入浅析Python的类

2018/06/22 Python

详解python和matlab的优势与区别

2019/06/28 Python

在python中用print()输出多个格式化参数的方法

2019/07/16 Python

pytorch实现特殊的Module--Sqeuential三种写法

2020/01/15 Python

Python3.6 中的pyinstaller安装和使用教程

2020/03/16 Python

如何用tempfile库创建python进程中的临时文件

2021/01/28 Python

Envie de Fraise意大利：法国网上推出的孕妇装品牌

2020/10/18 全球购物

好的自荐信的要求

2013/10/30 职场文书

机械设计职业生涯规划书

2013/12/27 职场文书

政风行风自查自纠报告

2014/10/21 职场文书

机器人瓦力观后感

2015/06/12 职场文书

《时代广场的蟋蟀》读后感：真挚友情，温暖世界！

2020/01/08 职场文书

PHP 技巧 * SVG 保存为图片（分享图生成）

2021/04/02 PHP

python 自动化偷懒的四个实用操作

2021/04/11 Python

html+css实现滚动到元素位置显示加载动画效果

2021/08/02 HTML / CSS

win10系统xps文件怎么打开?win10打开xps文件的两种操作方法

2022/07/23 数码科技