gpt4 book ai didi

javascript - 渲染阻止 javascript 和 CSS

转载 作者:行者123 更新时间:2023-11-28 03:31:11 25 4
gpt4 key购买 nike

当所有这些 js 脚本都用于样式(jquery.min.js、skel.min.js、skel-layers.min.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>

最佳答案

理想情况下,您希望将所有与样式相关的 Javascript(因为它对初始加载并不重要)放在主体部分的末尾,在结束标记之前。将这些脚本向下移动应该会增加您的页面加载时间,尤其是对于“首屏”的内容。这与页面初始呈现时视口(viewport)或窗口中可见的内容有关(而除非向下滚动,否则折叠下方将不可见。

希望对您有所帮助!

关于javascript - 渲染阻止 javascript 和 CSS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44730664/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com