0

我有一个包含大约 10 个 HTML、4 个 CSS、8 个 JS 和 15 个 IMG (PNG/JPG) 文件的应用程序。我想让这个网站响应迅速(即良好的用户体验)。

因此,在任何初始页面加载时,我希望浏览器异步缓存站点中的每个资产,而不会出现“浏览器忙”。根据 Steve Souders (Google) 的说法,我需要使用 XHR Eval 或 XHR Injection 来避免“浏览器忙”。请参阅Even Faster Web Sites的幻灯片 23 。

我知道我可以将 XHR Eval 或 XHR Injection 用于 Javascript。我可以将它用于 HTML、CSS 等吗?

我正在尝试这样的代码(使用 jQuery),但不能完全让它工作:

$.ajax({ url:"/blog", cache:true, dataType:"text" });
$.ajax({ url:"/about", cache:true, dataType:"text" });
$.ajax({ url:"/blog/main.css", cache:true, dataType:"text" });
$.ajax({ url:"/about/logo.png", cache:true, dataType:"text" });
$.ajax({ url:"/blog/social.js", cache:true, dataType:"text" });

我是不是很遥远,或者这是通往具有快速用户体验的完全缓存网站的正确轨道?

4

1 回答 1

0

在您考虑微观优化之前,先从宏观优化开始:

  • 确保在您的服务器上启用了 Gzip 压缩。
  • 将您的 CSS 和 JS 文件合并并缩小为单个文件。
  • 将所有小图像组合成一个大图像以制作精灵。这将减少请求的数量。
  • 为您的图像选择最佳格式并删除不必要的元数据信息以节省空间。
于 2013-05-12T23:52:01.273 回答