Question

如果在样式中使用所有js脚本（jquery.min.js，skel.min.js，skel-layers.min.js），我如何推迟这些js脚本：

    <head>
                <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
                <script src="https://cdnjs.cloudflare.com/ajax/libs/skel/2.2.1/skel.min.js"></script>
                <script src="https://cdnjs.cloudflare.com/ajax/libs/skel-layers/2.0.2/skel-layers.min.js"></script>

                <!-- Styling -->

                <script>(function(a) {
                           skel.init({reset:"full", breakpoints:{global:{range:"*", href:"css/style.css", containers:"60em", grid:{gutters:["2em", 0]}}, wide:{range:"-1680", href:"css/style-wide.css"}, normal:{range:"-1280", href:"css/style-normal.css", viewport:{scalable:!1}}, narrow:{range:"-980", href:"css/style-narrow.css", containers:"90%"}, narrower:{range:"-840", href:"css/style-narrower.css", containers:"90%!"}, mobile:{range:"-736", href:"css/style-mobile.css", containers:"100%!"}, mobilep:{range:"-480", href:"css/style-mobilep.css"}}, 
                           plugins:{layers:{config:{mode:function() {
                                    return skel.vars.isMobile ? "transform" : "position";
                        }}}}});
                       })(jQuery);
                </script>
   </head>

Answer 1

理想情况下，您希望在结束标记之前，在正文部分的末尾放置与样式相关的所有Javascript（因为它对初始加载并不重要）。向下移动这些脚本会增加页面加载时间，特别是对于内容高于首屏的内容。＆＃34;这适用于页面初始渲染时视口或窗口中可见的内容（除非向下滚动，否则折叠下方不会显示。

希望这会帮助你！

渲染阻止javascript和CSS

1 个答案: