1

我有一个想法，关于如何大大加快我的网站并减轻我的服务器上缓存对象的负载，但我想知道这是否是一个非常愚蠢的想法，然后再花一整天的时间思考它！听我说 -

localStorage 对象至少有 2.5 MB（在 Chrome 中，这里有更多），这对于大多数小型站点来说已经足够了。这就是为什么我想知道 - 对于小型静态网站，基本上将整个网站保存在一个巨大的 localStorage 文件中并基本上每次都从访问者自己的计算机加载网站是一个好主意吗？为了更好地解释我的想法，这里有一些伪代码：

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <!--other head information-->
</head>
<body>

    <script>
    if (localStorage.getItem('cached_site')!=null) {
        document.getElementsByTagName("body")[0].remove();
        document.documentElement.innerHTML = localStorage.getItem('cached_site');
        //Somehow stop loading the rest of the site (ajax?)
    }
    else {
        //set localStorage var to the source code of the site.
        //**This will be fleshed out to data/base64 all image resources as well**
        localStorage.setItem('cached_site',document.documentElement.innerHTML);
        //load the site as normal
    }
    </script>

</body>
</html>

这会将 的内容保存在body名为cached_site. 逻辑存在一些问题（例如“停止加载站点”部分），但您明白了。

这值得吗？潜在地，请求可以完全从静态内容中删除，因为它们都被加载到用户的计算机上。为了更新内容，也许可以在else块中保存和检查另一个值，也许是版本号。

我的虚拟主机限制了我每天可以获得的请求数量，这就是我想到这个的原因。这不是什么大不了的事，但仍然是一个有趣的项目。

4

1 回答 1

3

这个想法会对动态网站产生问题......您将如何处理动态生成的网页？

另一个想法是将每个页面保存到服务器上的静态 html 文件中，然后提供静态页面，在需要时会重新生成。

您还应该缓存网站的静态部分，即图像、脚本、CSS，并将它们存储在访问者浏览器的缓存中。

在 Apache 中，您可以使用mod_expires，然后像这样设置一个 .htaccess 文件：

### turn on the Expires engine
ExpiresActive On

<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|swf)(\.gz)?$">
  ExpiresDefault "access plus 1 month"
  FileETag None
</FilesMatch>

这基本上会将您网站的所有静态部分缓存在访问者的浏览器缓存中，因此他们将停止一遍又一遍地重新获取相同的文件。

您还应该尝试合并您的 CSS/Javascript 文件，理想情况下以 1-2 个 javascript 文件和 1 个 CSS 文件结束，从而限制每个客户端的请求数量。

我还建议使用 Yahoo 的YSlow和 Google 的PageSpeed 工具来分析您的网站。它们都包含有关如何在此处和此处加快页面速度的最佳实践。

以下是 Yahoo + Google 的一些建议，一目了然：

  • 最小化 HTTP 请求（尽可能使用 JS/CSS、CSS sprites、图像映射和内联图像的组合文件）
  • 添加 Expires 或 Cache-Control 标头（如上文所述）
  • 正确配置ETag或删除它们
  • Gzip 组件（例如 Apache 中的mod_deflate）
  • 使 JavaScript 和 CSS 外部化
  • 缩小JavaScript 和 CSS（即删除空格和换行符） - 在 PHP 中，您可以使用缩小脚本来执行此操作
  • 优化图像
于 2013-06-15T01:41:37.883 回答