Question

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

localStorage对象至少有2.5 MB（在Chrome中，more here），这对大多数小型网站来说已经足够了。这就是为什么我想知道 - 对于小型静态网站，基本上将整个网站保存在一个巨大的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的localStorage文件中。逻辑存在一些问题（比如“停止加载网站”部分），但你明白了。

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

我的网站主机限制了我每天可以获得的请求数量，这就是我想到这一点的原因。这不是一个大问题，但仍然是一个有趣的项目。

Answer 1

这个想法会出现动态网站的问题......你将如何处理动态生成的网页？

另一个想法是将每个页面保存到服务器上的静态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文件，从而限制每个客户端的请求数量。

我还建议使用雅虎的YSlow和Google的PageSpeed Tools来分析您的网站。它们都包含有关如何加快网页速度的最佳做法here和here。

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

最小化HTTP请求（尽可能使用JS / CSS，CSS sprites，image maps和内嵌图像的组合文件）
添加Expires或Cache-Control标头（如上所述）
正确配置ETags或删除它们
Gzip组件（例如Apache中的mod_deflate）
使JavaScript和CSS外部
缩小JavaScript和CSS（即删除空格和换行符） - 在PHP中，您可以使用minify script执行此操作
优化图片

超级积极的'缓存'技术

1 个答案: