1

I have single page web-app that currently consists of four files:

  • index.html
  • main.js
  • style.css
  • sprites.png

This means that every user who loads the site has to request index.html, parse it for the other three files, and then make three more http requests (serially, I believe) to fetch the remaining files.

It seems to me that it might be (a tiny bit) faster to embed the javascript, css and sprite image (base64 encoded) directly in the index.html file.

The main reasons I can think not to do this, along with my reasons why I don't think they apply in this case, are as follows:

  • Would prevent any of these additional files from being cached separately. This is not an issue for me because they will never be loaded from another page (since there is only one html page)
  • If the files were on different CDN servers, they could be downloaded in parallel. (Currently this project is not large enough to merit multiple servers)

I should disclose that this site is a small pet project that is no-where near large enough to merit this kind of meticulous performance tuning, but I like using pet projects as an avenue to explore problems (and their solutions) that I may face in my day job.

4

2 回答 2

2

通常不会这样做，因为您增加了整个 HTML 页面的大小。您将在第一次访问时保存几个请求，但您将强制客户端在每次获取 HTML 文件时重新加载所有内容。

它将提高访问您网站一次且仅访问一次的用户的性能。对于任何一种长期战略，它都是不合适的。

于 2013-06-16T21:46:31.003 回答
1

当您的页面重新加载时，js、图像和 CSS 会缓存在客户端上，不需要重新加载。此外，base64 要求您的客户激活 JavaScript 才能看到您的页面。最后，弱客户端解码 base64 可能比下载文件需要更长的时间。所以简而言之，不要想太多。

于 2013-06-15T18:08:36.410 回答