【问题标题】:Ways to speed up HTML site? [closed]加快 HTML 网站速度的方法? [关闭]
【发布时间】:2016-03-18 08:54:03
【问题描述】:

我不断地向我的网站添加内容,但当我这样做时速度会变慢。

我做过的事情:

  • 缩小 JS、CSS、HTML
  • 使用 CDN(用于 jquery 和其他流行库)
  • GZIP 压缩
  • .htaccess 东西
  • 图像压缩
  • HTML5 标头缓存
  • Headjs

我在 Pingdom 上的网站:

我还能做些什么来加快它并使其更小(也使用更少的带宽)。

谢谢!

附言。如果你愿意,我可以提供一些代码。

编辑:

Y慢:

【问题讨论】:

  • 如果是从某处拉取数据,让页面加载没有数据,然后使用AJAX加载有数据的部分。
  • 我该怎么做?
  • 在 gtmetrix 或 yslow 等网站上运行测试。恕我直言,这个问题过于笼统和笼统,欢迎基于意见的答案

标签: jquery html css performance .htaccess


【解决方案1】:

尝试将你的 JS 导入放在页面的末尾(在关闭 body 标记之前),而不是把它们放在开头的 head 标记中。 示例:

<html>
<body>
//other declarations
<script src="js/jquery.js"></script>
<script src="js/myscript.min.js"></script>
</body>
</html>

这将减少加载页面的时间。

【讨论】:

  • 谢谢,但是我做到了
【解决方案2】:

您没有指定您的网站何时变慢 - 加载时间或加载后时间。我将简要讨论这两种情况:

加载时间

我看到的最大延迟是服务器等待时间。这可能是由许多原因造成的 - 距离较远的服务器、糟糕/便宜的服务器、大量(未优化的)数据库通信等等。

接下来,我注意到一张 400KB 的图片。尽管您说您已经完成了图像压缩,但这仍然是一个很大的尺寸,所以我希望它是一个巨大的图像,您可能正在平移或其他一些合理的目的。如果它只是一个普通的背景图像(比如高清分辨率),你最好把它降低到至少一半。由于您正在做一个响应式网站,您还可以考虑为不同的设备/屏幕尺寸提供不同的图像。

接下来我看到一些 css 和 js 文件,一些是你的,另一些是第三方的。您可以考虑将它们合并在一起,有很多很棒的部署工具可以做到这一点。

但是,即使您完成了上述所有操作,也不要期望太高。根据您所说,您已经非常接近最大优化,因此所有这些都将减少几十毫秒。


加载后时间

删除所有不需要的 JS!是的,它包括 jQuery、headJS、一切……并复制/重写您实际使用的部分。当然,如果您使用 jQuery 的 95% 的功能,而没有人使用,这没有任何意义。

小心使用事件侦听器,确保正确定位元素。

【讨论】:

  • 只是说图像压缩在 400kb 处的所有压缩如果小于 1% 的话就没有任何进展
  • 天空图像已经很嘈杂 - 我将其压缩到 50% 左右,最终得到一个 198KB(几乎是原始文件大小的 50%)的文件,它看起来并不嘈杂,只是噪音图案不同。在这里查看:s000.tinyupload.com/index.php?file_id=49127213706142573104
  • 顺便说一句。为什么该图像从未缓存?每次刷新页面时,我都会看到图像重新加载。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-10-30
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-04-10
  • 1970-01-01
相关资源
最近更新 更多