我遇到了defer和async js文件的问题。我的网站正在加载JQuery和Jquery-UI库,它们是一种大文件,甚至是.min文件。当我将这些库移动到网站底部或只是延迟-异步它们时,我的网站停止渲染大部分元素,例如
- Select 2插件在移动的上无法正常工作
- Jquery范围滑块未拖动
- 其他一些自定义元素(如无限负载)也不能正常工作
所以我试图提高我的网站速度,但这2个库渲染拦截器和他们我只得到了53评级的PageSpeed洞察。
所以另一种让网站运行更快的方法是合并(合并)JS文件,但在组合网站后也停止渲染,所以我猜只有其中一些能够组合。有人能帮我解决这个问题吗?下面我将给予我的网站上使用的所有JS
jquery-2.1.1.min.js
greensock.js
layerslider.transitions.js (actually trying to find some lightweight alternative)
layerslider.kreaturamedia.jquery.js
jquery-ui.min.js
jquery.ui.touch-punch.min.js
select2.min.js
jquery.tooltipster.min.js
bootstrap.min.js
placeholders.js
jquery.magnific-popup.min.js
owl.carousel.min.js
html5shiv.js
字符串
我已经做了
- 浏览器缓存-打开
- GZip on the fly - On
1.因此,主要的问题是如何将jQuery移到底层而不损失功能
1.我可以合并哪些库,以减少HTTP请求
3条答案
按热度按时间o2gm4chl1#
除了@Dr.Web所说的,你还可以将它们合并到一个文件中,并确保插件代码添加到jQuery的底部
im9ewurl2#
请注意,使用async让浏览器知道脚本可以异步加载,而不一定按顺序加载。当您尝试加载具有多个依赖项的异步脚本时,这会出现问题。在这种情况下,您应该在页脚中加载jQuery而不使用async属性,并使用async属性加载jQueryUI。
参考:Source
hjzp0vay3#
我的网站速度显示太慢,缓存和其他插件,用于优化启用。但是Google Page的速度显示它很慢。链接:https://www.samacharbuddy.com/