Question

在我的项目（Preloaders.net）上我有很多脚本，因为它是一个网络应用程序。没有办法让一些＆＃34;一些＆＃34; css和js。我将所有内容合并到一个文件中，但Google Pagespeed仍然习惯于删除＆＃34;渲染阻止CSS和JS＆＃34;。所以我只是让CSS和JS显示内联HTML。 Google pagespeed现在对内联CSS感到高兴，但它看起来确实很愚蠢 - 因为现在JS和CSS不会被缓存在所有其他页面上。打破CSS和JS几乎是无用的，也是不可能的，因为它对于web-app来说都是必要的。

所以现在我被撕裂了 - 这对用户表现最好：Google＆＃34;愚蠢＆＃34;或渲染阻塞css和js？

提前多多感谢。

Answer 1

而不是内联javascript只需加载延迟标志或异步：

<script src="whatever.js" async></script>

这将解决js问题。

至于css - 仅内联每个页面的内容，并以异步方式加载其余样式（来自https://developers.google.com/speed/docs/insights/OptimizeCSSDelivery）：

<html>
  <head>
  <style>
    .blue{color:blue;}
  </style>
  </head>
<body>
  <div class="blue">
    Hello, world!
  </div>
  <noscript id="deferred-styles">
    <link rel="stylesheet" type="text/css" href="small.css"/>
  </noscript>
  <script>
    var loadDeferredStyles = function() {
      var addStylesNode = document.getElementById("deferred-styles");
      var replacement = document.createElement("div");
      replacement.innerHTML = addStylesNode.textContent;
      document.body.appendChild(replacement)
      addStylesNode.parentElement.removeChild(addStylesNode);
    };
    var raf = requestAnimationFrame || mozRequestAnimationFrame ||
        webkitRequestAnimationFrame || msRequestAnimationFrame;
    if (raf) raf(function() { window.setTimeout(loadDeferredStyles, 0); });
    else window.addEventListener('load', loadDeferredStyles);
  </script>
</body>

Google pagespeed表示要使用内联JavaScript

1 个答案: