JS 库
js库是把我们常用的功能放到一个单独的文件中,我们用的时候,直接引用到页面里即可
jQuery 库
jQuery 是 js 的一个库,封装了我们开发过程中常用的一些功能,方便我们调用,提高开发效率
jQuery CDN
CDN的全称是Content Delivery Network,即内容分发网络
CDN大致原理(百度百科)
基本思路是尽可能避开互联网上有可能影响数据传输速度和稳定性的瓶颈和环节,使内容传输的更快、更稳定。
通过在网络各处放置节点服务器所构成的在现有的互联网基础之上的一层智能虚拟网络,CDN系统能够实时地根据网络流量和各节点的连接、负载状况以及到用户的距离和响应时间等综合信息将用户的请求重新导向离用户最近的服务节点上。
其目的是使用户可就近取得所需内容,解决 Internet网络拥挤的状况,提高用户访问网站的响应速度。
常见jQuery各个版本的CDN
3.3.1
https://cdn.bootcss.com/jquery/3.3.1/jquery.js
https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js
入口函数
我们都知道,网页加载是需要时间的,如果网页未加载完毕,我们就进行一些操作,可能会达不到我们希望的效果,所以我们的一些操作是需要在文档(document)加载完毕后,再继续进行的
文档加载顺序
文档加载的顺序为:从上往下, 边解析边执行
css并不会阻塞DOM树的解析
css加载会阻塞DOM树渲染
css加载会阻塞后面js语句的执行
js执行会阻塞DOM树的解析和渲染
CSS优化建议
使用CDN(因为CDN会根据你的网络状况,替你挑选最近的一个具有缓存内容的节点为你提供资源,因此可以减少加载时间)
对css进行压缩(可以用很多打包工具,比如webpack,gulp等,也可以通过开启gzip压缩)
合理的使用缓存(设置cache-control,expires,以及E-tag都是不错的,不过要注意一个问题,就是文件更新后,你要避免缓存而带来的影响。其中一个解决防范是在文件名字后面加一个版本号)
减少http请求数,将多个css文件合并,或者是干脆直接写成内联样式(内联样式的一个缺点就是不能缓存)
JavaScript优化建议
将所有