jquery - 单个响应式网页的合理尺寸是多少

Question

我正在开发一个网站，该网站旨在将大量大图像作为背景。

我也在使用 media-query 因为它应该是响应式的，并且每个屏幕尺寸都有不同的背景。图片本身的总大小为 10MB，不包括可能仅归档至 300KB 的小图片。

scripts(bootstrap、jQuery 和自定义 js)、styles(bootstrap 和我的自定义 css)和 HTML 仅小于 < strong>1MB。

总而言之，我正在加载一个或多或少 11MB 的网页，这只是索引页。 Assets 已经压缩并放置在我服务器上的 CDN 中。

我的问题是，当有人第一次访问该网站时，加载页面需要花费太多时间，特别是当访问者的互联网连接速度低于标准速度时。加载整个页面几乎需要超过 20 秒，在更坏的情况下会超过一分钟，显然有问题。

单个网页是否有合理或标准的尺寸可供遵循？我也在使用 symfony2 也许有一个插件或类似的东西可以帮助我。

顺便说一句，这是网站。 LINK谢谢。

Answer 1

11MB 对于任何单个网页来说都太大了。但是，只需进行一些调整，您就可以从 Symfony 获得更好的性能。

您现在可以做的一件事是使用 Assetic 来管理您的 Assets 文件，并在将它们发送给客户端之前缩小它们。

此外，请确保 APC 正在您的服务器上运行。你可以查看<?php phpinfo(); ?>输出并进行页面搜索“APC”，或运行 php -i | grep apc在命令行上。

还有在线图像优化器，只需谷歌“图像优化器”，您就会发现每种图像类型都有很多。 (我不能发布链接，因为这个网站不允许我发布超过两个)。

引用

• Symfony Performance Docs
• Symfony Performance Blog Post