我网站的不同页面有不同的js需求(主要是插件),有些需要灯箱,有些不需要,有些需要转盘,有些不需要等等。
关于页面加载速度我应该
选项1 - 在需要时引用每个js文件:
所以一页可能有:
<script type="text/javascript" src="js/carousel/scrollable.js"></script>
<script type="text/javascript" src="js/jquery.easydrag.js"></script>
<script type="text/javascript" src="js/colorbox/jquery.colorbox-min.js"></script>
和另一个人:
<script type="text/javascript" src="st_wd_assets/js/carousel/scrollable.js"></script>
<script type="text/javascript" src="st_wd_assets/js/typewatch.js"></script>
选项2 - 合并并压缩到一个site_wide.js文件中:
所以每个页面都会引用:
<script type="text/javascript" src="js/site_wide.js"></script>
但是会有未使用的选择器/事件侦听器,这有多糟糕? 我会在site_wide.js文件的顶部添加任何插件备注/认证
答案 0 :(得分:7)
通常最好combine these and serve one file,你设置缓存标题,以便客户端保留它,而不是每页请求它。请记住,如果一个jQuery选择器没有找到任何东西,它就不会做任何事情,所以只要你在每个页面使用你的脚本的很大一部分就不是什么大不了的事情,只要你的选择器没有匹配就可以了。
Make sure it's being cached by the client though,你所有的工作都是徒劳的。还要确保it's served minified and gzipped。最后,请看托管您的main libraries from a CDN。
答案 1 :(得分:2)
将它们合并为一个大而缩小的外部文件,并将其包含在每个页面中。第一页加载后,浏览器将缓存它,因此用户只会下载一次。