js简单性能有关问题以及js学习总结
日期：2014-05-16 浏览次数：20416 次
js简单性能问题以及js学习总结
最近在看一本书：《高性能javaScript》，发现自己平时写js存在很多小细节上的问题，虽然这些问题不会导致程序运行出错，但是会导致界面加载变慢，用户体验变差，那么我们就来细细数一下应该注意的地方吧！！！
1、<script>标签应越少越好（虽然有多个也不会导致程序报错），因为每个<script>标签初始下载时都会阻塞页面渲染
2、<script>标签尽量不要放在页面上方，尽量放在<body>内的最下面，因为每个<script>在执行的时候，都会下载对应的js文件，浏览器会等待所有js/css下载完成才显示出页面
3、当需要导入多个js文件的时候，一般情况下我们都是写两个<script src="..." />，实际上是支持一次性导入多个的，例如：<script src="file1.js&file2.js" />
4、<script>标签中有一个属性：defer，该属性指明本元素所含的脚本不会修改DOM，因此代码能安全地延迟执行，但是该属性只有IE4+和Firefox3.5+浏览器支持，希望大家使用的时候注意，如果其他浏览器，则会被直接忽略，使用例子：
这段代码在我们正常理解下执行顺序应该是：defer、script、load，但是如果在支持defer的浏览器上顺序则是：script、defer、load，这里需要注意的是：defer不是跟在script后面执行，而是在onload事件处理之前被调用
未完....待续，后续会继续更新，希望大家关注！
最近在看一本书：《高性能javaScript》，发现自己平时写js存在很多小细节上的问题，虽然这些问题不会导致程序运行出错，但是会导致界面加载变慢，用户体验变差，那么我们就来细细数一下应该注意的地方吧！！！
1、<script>标签应越少越好（虽然有多个也不会导致程序报错），因为每个<script>标签初始下载时都会阻塞页面渲染
2、<script>标签尽量不要放在页面上方，尽量放在<body>内的最下面，因为每个<script>在执行的时候，都会下载对应的js文件，浏览器会等待所有js/css下载完成才显示出页面
3、当需要导入多个js文件的时候，一般情况下我们都是写两个<script src="..." />，实际上是支持一次性导入多个的，例如：<script src="file1.js&file2.js" />
4、<script>标签中有一个属性：defer，该属性指明本元素所含的脚本不会修改DOM，因此代码能安全地延迟执行，但是该属性只有IE4+和Firefox3.5+浏览器支持，希望大家使用的时候注意，如果其他浏览器，则会被直接忽略，使用例子：
<script type="text/javascript" src="file1.js" defer />，测试验证defer属性示例：
<script defer>alert("defer");</script>
<script>alert("script");</script>
<script>
window.onload = function() {
alert("load");
};
</script>这段代码在我们正常理解下执行顺序应该是：defer、script、load，但是如果在支持defer的浏览器上顺序则是：script、defer、load，这里需要注意的是：defer不是跟在script后面执行，而是在onload事件处理之前被调用
未完....待续，后续会继续更新，希望大家关注！
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
