将JS与CSS合并成一个文件减少HTTP请求有效提升网站打开速度!

有许多网站站长都会发愁一件事情,那就是网站的打开速度,我们都知道随着搜索引擎的算法不断更新,网站打开速度已近更成为了考量网站是否为优质站点的一个重要因素,就像百度推出的《闪电算法》就曾提出首屏加载时间的要求,具体内容为“移动网页首屏在2秒之内完成打开的,在移动搜索下将获得提升页面评价优待,获得流量倾斜;同时,在移动搜索页面首屏加载非常慢(3秒及以上)的网页将会被打压“,由此可见网站打开速度确实成为了影响搜索引擎排名的重要因素,其实有效的提升网站打开速度并非难事,我们只需要将网站的JS与CSS合并成一个文件减少HTTP请求就可以了,那么具体该怎样做呢?

我们先看一个实例代码

运行以上代码我们会发现CSS会正常工作,而JS却失灵了,因为上面的代码通过浏览器解析时会使代码变成这样

很明显浏览器将js代码解析为了注释行因此造成了JS的失灵,根据这个特性,我们可以将css与js合并成一个后缀为.cssjs的文件内容为

而后我们在网页头部加载时分别进行加载

这样浏览器解析test.jscss这个文件时css会解析为

而js解析器会解析为

貌似请求了两次,但是因为浏览器在第一次加载test.jscss后就已经缓存了这个文件,实际上在第二次加载时已经调用缓存了,这样就实现了将JS与CSS合并成一个文件减少HTTP请求有效提升网站打开速度的目的!

赞 (0) 打赏

评论 0

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

觉得文章有用就打赏一下文章作者

支付宝扫红包

用红包抵扣打赏