Question

我有一个仅限静态的网站，该网站托管在Google App Engine上。其中的前沿是Cloudflare CDN。

我已经运行了谷歌网页的见解，让我知道我的网站是如何表现的，根据谷歌的说法效果不佳。我希望谷歌看到它在搜索引擎优化方面表现良好。

这是我从Google收到的报告：

有两种建议：

1）消除上层内容中的渲染阻止JavaScript和CSS 显示如何修复

2）利用浏览器缓存

对于问题1，我尝试了许多我在Google上阅读的内容。我尝试过添加＆＃39; aync defer＆＃39;到链接属性。我试图制作media = print，以便浏览器首先渲染html，然后再应用css。我已经尝试将链接到样式表到html文档周围的不同位置。基本上我试图遵循这个：https://developers.google.com/speed/docs/insights/OptimizeCSSDelivery。

截至目前我的html页面（我的网站只是在静态html页面上）结构如下：

<html>
<head>
<!-- all links/references to css files and javascript files -->
</head>
<body>
</body>
</html>

我的第二个问题是浏览器缓存，我不明白为什么会收到此错误。 Google App引擎缓存文件，然后在Cloudflare CDN上设置文档的缓存标头（以及gzip），以便浏览器缓存它（下面是打开的Cloudflare缓存组件）。

我可以看到浏览器在运行页面时缓存静态文件并在chrome工具中使用这些缓存文件：

这是我第一次创建一个生产静态网站，所以我可能会误解很多东西，但我正在寻找如何消除这两个问题。

干杯

Answer 1

我不知道google是否正在对此进行测量，但是通常建议从以下地址加载Bootstrap和Jquery，因为它们已被许多网站使用，因此即使它们从未访问过您的网站，它们也已经在浏览器缓存中。（对于字体真棒，肯定也可以找到）。

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/YOUR_BOOTSTRAP_VERSION/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/YOUR_BOOTSTRAP_VERSION/js/bootstrap.min.js">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/YOUR_JQUERY_VERSION/jquery.min.js"></script>

提高我的网站性能

1 个答案: