javascript - 如何通过调整图像大小和应用 attr 来减少页面加载时间?

标签 javascript jquery html css image

friend 的网站加载速度非常慢。我使用 gtmetrix.com(即使该页面不是 wordpress)进行检查,页面加载时间为 8.4s,2.09MB,得分为 C。

结果指出了一些偶然的事情,以便提供更好的加载时间

  1. 以下图像缺少宽度和/或高度属性。
  2. 以下图像在 HTML 或 CSS 中调整了大小。提供缩放图像可以节省 1007.9KiB(减少 70%)。
  3. 应使用 CSS sprites 将站点提供的以下图像组合成尽可能少的图像。

该页面没有使用 wordpress 并且是响应式的,它说缺少宽度和高度属性的部分,我无法设置静态高度和宽度,但它提到调整图像大小的地方已经完成了最大.我的意思是图像尺寸为 424x424,但使用的最大尺寸为 300x300 如果我将所有图像缩小到 300x300 真的那么重要吗?作为第三点,这是否意味着我真的应该将所有图像合并为一个并使用 CSS 获得相同的图像但位置不同?因为这些图像是箭头、按钮、x 之类的东西

预先感谢您的任何回复。

最佳答案

每一位都很重要。尝试以页面上实际显示的大小保存图像。

确保在加载图像之前通过 imageoptim 等工具运行每个图像。

页面怎么这么重?只是图像吗?

关于javascript - 如何通过调整图像大小和应用 attr 来减少页面加载时间?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33851329/

相关文章:

javascript - 如何使用 asnyc.js 迭代嵌套 JSON 值

javascript - 如何使用 jQuery 检查子元素是否没有类

javascript - 我想在单击按钮时使用 JavaScript 插入文本。但 `` `.value( )`` ` 似乎不起作用

html - ASP.NET MVC 中的自定义字体

javascript - antd react 中有没有解决方法来检查组件中未保存的更改?

javascript - Internet Explorer 的 nvd3.js 渲染解决方案

php - 如何从 html 调用 Php 函数

javascript - jquery仅在一个函数完成后才启动一个函数

javascript - jQuery 验证消息问题

javascript - 如何计算文本字段中的单词数