`
andyLee520
  • 浏览: 4243 次
  • 性别: Icon_minigender_1
  • 来自: 湖南怀化
社区版块
存档分类
最新评论

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+浏览器支持,希望大家使用的时候注意,如果其他浏览器,则会被直接忽略,使用例子:
<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事件处理之前被调用

未完....待续,后续会继续更新,希望大家关注!
分享到:
评论
发表评论

文章已被作者锁定,不允许评论。

相关推荐

    Cocos2d-JS开发之旅+完整版

    第10 章 走向高大上的必经之路——简单的性能优化 / 160 第11 章 让主角不再死板 / 173 第12 章 动态的背景 / 188 第13 章 界面的文字有点丑 / 204 第14 章 超炫的效果——粒子系统 / 211 第15 章 尝试做一个更...

    leetcode答案-MyStudyNote:自己总结的学习笔记(算法、数据结构、浏览器渲染优化相关、网站性能相关、js、css、html)

    自己总结的学习笔记(算法、数据结构、浏览器渲染优化相关、网站性能相关、js、css、html) 2018/7/5. 最近看了一篇文章,激起了我的学习欲望,想要刷算法题提高自己的核心竞争力。不知道能坚持多久。 发现在前端...

    nodejs v0.12.5 for windows x64

    1.Node 是一个服务器端 JavaScript 解释器,可是真的以为JavaScript不错的同学学习Node就能轻松拿下,那么你就错了,总结:水深不深我还不知道,不过确实不浅。  2.Node 的目标是帮助程序员构建高度可伸缩的应用...

    asp.net知识库

    帮助解决网页和JS文件中的中文编码问题的小工具 慎用const关键字 装箱,拆箱以及反射 动态调用对象的属性和方法——性能和灵活性兼备的方法 消除由try/catch语句带来的warning 微软的应试题完整版(附答案) 一个...

    实战OpenGL三维可视化系统开发与源码精解.part06.rar

     第2章 主要对OpenGL的基本概念、OpenGL编程基础和在Visual C++环境下OpenGL基本程序框架的建立进行了讲解,并给出了一个简单的旋转立方体程序示例。通过这一章,使读者对OpenGL有初步的概念和了解,对于纹理、...

    精通AngularJS part1

    Plunker与jsFiddle10 IDE扩展和插件10 12AngularJS速成10 HelloWorld——AngularJS示例10 双向数据绑定12 AngularJS中的MVC模式12 鸟瞰13 深入作用域15 视图21 模块与依赖注入26 模块26 协作对象27 注册...

    史上最好传智播客就业班.net培训教程60G 不下会后悔

    搜房网、汽车之家等大型网站中用到的网站静态化、图片服务器分离、高性能缓存、HTML/JS压缩、CDN、CSS Sprite、负载均衡、Memcached、镜像服务器同步等问题不是那些随手写出来的所谓在线商城、电子商务系统所所能够...

    front-end-interview:前端面试宝典,收集整理了全网最新、最全面的面试资料,帮助各位求职面试者斩获理想Offer

    第一部分:本章从HTML、CSS、JavaScript、流向框架、Nodejs、性能优化、前端工程化、错误监控、Web安全共九个方面概括总结了前端面试中的主要知识点,帮助读者快速构建前端知识体系。第二部分:介绍了面试中涉及到的...

    PHP和MySQL Web开发第4版pdf以及源码

    1.5.1 简短、中等以及长风格的表单变量 1.5.2 字符串的连接 1.5.3 变量和文本 1.6 理解标识符 1.7 检查变量类型 1.7.1 PHP的数据类型 1.7.2 类型强度 1.7.3 类型转换 1.7.4 可变变量 1.8 声明和使用常量 1.9 ...

    安卓java读取网页源码-Socket:使用Golang+uniapp基于websocket的通信软件

    Golang作为一款高性能的静态语言(性能仅次于C/C++),Go主要有静态语言、天生并发、内置GC、安全性高、语法简单、交叉编译和编译快速这几个方面的特性,及较低的入门门槛,无论之前学习过什么语言都能快速的上手。...

    亮剑.NET深入体验与实战精要2

    多年的系统开发、设计和团队管理经验,以及深入分析众多项目实战的宝贵成果和盘托出,力求将编程思想与具体实践融为一体,提炼出适合于广大读者快速理解和彻底掌握.NET软件开发的最佳学习路线。本书既考虑到实际开发...

    亮剑.NET深入体验与实战精要3

    多年的系统开发、设计和团队管理经验,以及深入分析众多项目实战的宝贵成果和盘托出,力求将编程思想与具体实践融为一体,提炼出适合于广大读者快速理解和彻底掌握.NET软件开发的最佳学习路线。本书既考虑到实际开发...

    PHP和MySQL WEB开发(第4版)

    1.5.1 简短、中等以及长风格的表单变量 1.5.2 字符串的连接 1.5.3 变量和文本 1.6 理解标识符 1.7 检查变量类型 1.7.1 PHP的数据类型 1.7.2 类型强度 1.7.3 类型转换 1.7.4 可变变量 1.8 声明和使用常量 1.9 理解...

    PHP和MySQL Web开发第4版

    1.5.1 简短、中等以及长风格的表单变量 1.5.2 字符串的连接 1.5.3 变量和文本 1.6 理解标识符 1.7 检查变量类型 1.7.1 PHP的数据类型 1.7.2 类型强度 1.7.3 类型转换 1.7.4 可变变量 1.8 声明和使用常量 1.9 ...

    Tcl_TK编程权威指南pdf

    因此,我就总结了一套编程技巧以充分利用Tcl/Tk的强大功能,同时回避一些棘手的问题。这本书就是一本帮助你最大限度地利用Tcl/Tk并回避一些我所经历过的令人头痛的问题的实用编程指南。 我接触Tcl语言大概已经有10...

    sesvc.exe 阿萨德

    JavaScript PHP iOS Android HTML5 CSS3 Linux C++ Python C# Node.Js 一文让你彻底理解 Java HashMap 和 ConcurrentHashMap 2018-07-25 分类:JAVA开发、编程开发、首页精华0人评论 来源:...

    vc++ 应用源码包_1

    演示了其它控件(全部)阙套到List中并自绘等,学习自绘以及阙套CListCtrl 控件的好实例。 ColorStatic 自绘了CStatic控件,实现了标题字符滚动效果。 CSDN免积分下载工具 源码 演示了使用CInternetSession去下载...

    vc++ 应用源码包_2

    演示了其它控件(全部)阙套到List中并自绘等,学习自绘以及阙套CListCtrl 控件的好实例。 ColorStatic 自绘了CStatic控件,实现了标题字符滚动效果。 CSDN免积分下载工具 源码 演示了使用CInternetSession去下载...

    vc++ 应用源码包_6

    演示了其它控件(全部)阙套到List中并自绘等,学习自绘以及阙套CListCtrl 控件的好实例。 ColorStatic 自绘了CStatic控件,实现了标题字符滚动效果。 CSDN免积分下载工具 源码 演示了使用CInternetSession去下载...

    vc++ 应用源码包_5

    演示了其它控件(全部)阙套到List中并自绘等,学习自绘以及阙套CListCtrl 控件的好实例。 ColorStatic 自绘了CStatic控件,实现了标题字符滚动效果。 CSDN免积分下载工具 源码 演示了使用CInternetSession去下载...

Global site tag (gtag.js) - Google Analytics