标签: pagespeed

我有照片库代码,可以进行图像重新调整大小和创建缩略图.我使用ImageMagick来做到这一点.我通过Google的Page Speed工具运行了一个图库页面,它显示重新调整大小的图像和缩略图都有大约10KB的数据(特别是JPEG文件).

我可以在脚本中添加什么来优化文件大小？

附加信息

我在调用函数时使用的imagick::FILTER_LANCZOS模糊设置过滤器.JPEG的质量设置为.0.9resizeImage()80

我有一个网站，主页横幅上有一个视频，当用户进入该页面时，该视频会自动播放。Google PageSpeed Insights 因此抱怨视频网络负载。我想知道如何才能避免收到此消息。我正在查看这个网站：https://www.leclosdamboise.com/ 他们也有一个视频播放（40mo），但在 Google PageSpeed Insights 上没有收到“网络过载”错误消息。任何人都知道他们是如何做到的？谢谢

当您想要包含 Google Fonts 中的字体时，它建议 ([1]) 您这样做：

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto&display=swap">

预连接到fonts.gstatic.com是有意义的，因为浏览器只有在下载样式表后才会发现该域。但是，当样式表的链接就在fonts.googleapis.com之后时，预连接到 fonts.googleapis.com 的意义何在？浏览器不会同时处理这两个吗？

[1] 请参阅： https: //fonts.google.com/share?selection.family =Roboto，选择某种样式，然后单击右上角的公文包图标。）

我正在购物网站上工作.我们在结果中显示40张图像.我们希望减少页面的上传时间,并且因为图像阻止了onload事件,所以我考虑通过最初设置img.src =""并在onload之后设置它们来延迟加载它们.请注意,这不是html片段的ajax加载.图像html和alt文本一起出现.它只是图像src延迟.

有没有人知道这是否可能会损害搜索引擎优化或导致谷歌惩罚盒现在,他们正在测量sitespeed？

我知道Apache的pagespeed模块可​​以让页面访问更快,所以,我想知道Nginx是否有相同的功能？

提前致谢!

广泛建议将JS文件放在页面底部以允许首先加载html代码.在这种情况下,访问者在等待页面满载时会看到一些东西.但是,我认为这是不利的,原因如下:

1. 现代设计主要依赖于JS.这意味着在加载JS之前,页面看起来很难看.

2. 如果在加载期间中断连接(根本不加载JS),访问者将错过一些网站功能(可能非常重要); 并且他们不会理解这是加载的问题(重新加载页面).

3. 如果服务器端脚本die(由于错误)在脚本之前的脚本末尾(例如在PHP中),访问者将错过整个页面功能(通过JS); 但如果在顶部加载JS,它们只会错过页脚或页面的一半.

4. 如果首先加载JS,浏览器将并行加载其他东西(如图像); 但如果最后加载JS,可能会增加加载时间.因为JS文件很大(例如JQuery和JQuery UI),所有小东西(如图像)都已加载,我们正在加载一个大文件,最后一行.

更新: 5.因为jQuery库应该在代码之前加载; 如果在页脚中加载jQuery库(例如footer.php),则无法为不同页面(在正文中)添加自定义jquery代码.

如果我错了请纠正我!将JS文件放在页脚中仍然有益吗？

我目前在我的新网站上使用页面速度,非常高兴.但我刚刚意识到我的/ phpmyadmin现在是空白的.

我知道这是因为pagespeed因为当我去/ phpmyadmin /？PageSpeed = off; 它又有效了.

因此,想法是仅在/ phpmyadmin和/ phpmyadmin/*上禁用pagespeed/phpmyadmin链接是使用符号链接.

我正在使用apache2.

这是我在vhost .conf文件中的内容

    <Directory /var/www/mywebsite/>

            AddOutputFilterByType DEFLATE text/html text/plain text/xml text/css text/javascript application/javascript

            #ModPagespeedEnableFilters lazyload_images,defer_javascript,insert_dns_prefetch,collapse_whitespace

            ModPagespeedEnableFilters lazyload_images,combine_javascript,defer_javascript,combine_css

            RewriteBase /
            RewriteRule ^index\.php$ - [L]
            RewriteCond %{REQUEST_FILENAME} !-f
            RewriteCond %{REQUEST_FILENAME} !-d
            RewriteRule . /index.php [L]

            FileETag none

            ExpiresActive On
            ExpiresDefault "access plus 5 seconds"
            ExpiresByType image/x-icon "access plus 2500000 seconds"
            ExpiresByType image/jpeg "access plus 2500000 seconds"
            ExpiresByType image/png "access plus 2500000 seconds"
            ExpiresByType image/gif "access plus 2500000 seconds"
            ExpiresByType application/x-shockwave-flash "access …

我有一个从 CDN 引用 Bootstrap 4 的网页。在head我的 HTML 页面中，我有以下内容：

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.2/css/bootstrap.min.css" integrity="sha384-y3tfxAZXuh4HwSYylfB+J125MxIs6mR5FOHamPBG064zB+AFeWH94NdvaCBm8qnd" crossorigin="anonymous">

这是我引用的唯一 CSS。但是，当我运行 Google 的 PageSpeed 工具时，出现以下错误：

在首屏内容中消除阻塞渲染的 JavaScript 和 CSS 您的页面有 1 个阻塞 CSS 资源。这会导致呈现页面的延迟。如果不等待以下资源加载，则页面上的所有首屏内容都无法呈现。尝试延迟或异步加载阻塞资源，或直接在 HTML 中内联这些资源的关键部分。优化以下 CSS 交付：

https://maxcdn.bootstrapcdn.com/ ...陷阱/ 4.0.0-alpha.2 / CSS / bootstrap.min.css

我觉得这是一个先有鸡还是先有蛋的问题。如果我将此样式表引用移动到body元素的底部，则当我访问该页面时，该页面将从无样式跳转到已样式。作为一个人，它相当刺耳。然而，当我这样做时，我的 PageSpeed 分数显着增加。

有没有其他替代方法？我一直认为使用 CDN 是一件好事，因为它使您能够利用一些缓存功能。但是，这个惩罚似乎相当重要。

我通过从 facebook.com 生成的代码添加了Facebook 聊天插件

<!-- Load Facebook SDK for JavaScript -->
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = 'https://connect.facebook.net/en_US/sdk/xfbml.customerchat.js';
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

<!-- Your customer chat code -->
<div class="fb-customerchat"
  attribution=setup_tool
  page_id="124030157608968">
</div>`

但是我在谷歌浏览器中运行了一个 Pagespeed 测试，结果是灾难性的。

任何建议如何解决这个问题？

非常感谢！

PageSpeed Insights 中有一项新功能，可以向您展示真实用户的体验。现在，我在移动设备上检查了我的一个具有此功能的网站，并收到了以下消息：

“核心 Web Vitals 评估：根据最近 28 天收集期内的 Core Web Vitals 指标计算失败。了解更多”

为什么 PageSpeed 给我返回这个答案？在 Google Search Console 的 Core webvits 下似乎一切正常。