标签: pagespeed

我们有一个服务器(OVH - 法国),Apache和mod_pagespeed.在这台服务器上,我安装了WordPress.

我在我的主题中对Javascript文件进行了更改,但是pagespeed不理解有新文件,并且不断加载原始javascript文件. js/ui.js.pagespeed********

我在两周前做了更改,今天早上重新启动了服务器,它仍在加载原始的Javascript文件.

如何删除pagespeed缓存？

在我的服务器上/var/mod_pagespeedcache/http,3A/,2Fwww.myURL.fr/wp-content/themes/mytheme/js,我看到了ui.js.pagespeed.jm.************.js.

我可以删除这个文件吗？

我有一个iframe加载第三方小部件的。我只想iframe在页面加载后显示此内容，因为我不想减慢页面加载速度。我遵循了一篇中等文章，其中描述了如何执行此操作，但他们的解决方案不起作用，因为函数onload,finishLoading从未被调用

export default ({src, width, height}) => {

  const [loading, stillLoading] = useState(true)
  const finishLoading = () => {
      alert('finished loading')
      stillLoading(false)
  }
  ...
  return(
    {loading ? '' : 
      <iframe
        src={src}
        width={width}
        height={height}
        scrolling="no"
        onLoad={finishLoading}
      >
        className={`tpwidget flex-center-row`}>
      </iframe>
    }
  )
}

更新

通过使用 useEffect，我可以让 iframe 在其他所有事情之后加载（理论上），但我发现删除 iframe 完全提高了我的 PageSpeed 分数，并且仅在（使用 useEffect）之后加载 iframe 并没有太大的积极效果关于页面速度。

如果有帮助，域名是suddensask.com，第三方小部件是亚马逊广告。

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

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

附加信息

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

我正在努力优化其上有Flash的页面.我正在使用优化实践,例如将Javascript移动到底部以不阻止.删除内联脚本.并使用缩小的css和js最小化HTTP请求.

大多数页面内容都在flash中,因此尽快加载它是目标.目前在闪存均匀渲染之前有2~3秒的延迟(使用firebug profiling)

我想知道在页面加载的什么时候浏览器开始在页面上初始化flash？

一旦包含闪存的DOM元素被渲染了吗？

一旦完成onload事件被解雇了吗？

我想它也可能与每个浏览器不同.

我们正在开发一个大型网站,我们所有的图像和资源都在Amazon S3中.我们还使用Cloudfront在全球范围内分发我们的内容.我们想要的是告诉客户端Web浏览器缓存我们的文件,因为当我们更改它们时,我们也会更改URL(Cloudfront不反映其他地方24小时的更改).

我们目前正在使用ETag,但这并不是最佳的,因为客户端仍然必须执行请求以检查资源是否已更改.

一个解决方案是Expires Header,但我们没有找到一种方法来设置它相对于当前日期,就像在Apache Configuration for S3中那样,我们无法定期更新所有内容,因为它非常多.因此,我们需要一个配置选项,将Expires Header设置为相对于所有Content的当前日期的Date.

另一种解决方案是将Cache-Control:max-age设置为某个值.这有用吗？它是否被主要的浏览器接受？我会破坏一些缓存算法吗？为什么YSlow建议设置Expires标头而不是Cache-Control:max-age？

任何其他建议书？我们正在压缩CSS和JS,使用精确的Sprites,在可能的地方设置Expires头和ETag,并且很快将使用Yahoo压缩工具和gzipping输出压缩我们的图像.

<sc:Image>并且<sc:FieldRenderer>,在渲染MediaItem时,生成如下所示的html代码:

<img src="~/media/twitter.gif" alt="Twitter" width="100" height="22" />

请注意src属性中使用的相对路径:这意味着当在多个页面上重复使用此类图像时,浏览器必须多次获取它(例如,在http://example.com/和http://example.com/页面上)关于我们/).当我img在代码中生成标记时,我可以使用以下代码段强制使用绝对URL:

string url = Sitecore.StringUtil.EnsurePrefix('/',
    Sitecore.Resources.Media.MediaManager.GetMediaUrl(media));

如何配置Sitecore以强制媒体网址中的前导斜杠？

使用Reflector我可以看到它MediaOptions.AbsolutePath控制我想要实现的行为,但我不知道如何为Sitecore内置控件设置它.设置Media.MediaLinkPrefix或mediaPrefixes中web.config似乎没有任何改变.

是否可以从命令行运行Google Page速度？如果是这样,怎么样？我有兴趣自动进行夜间或每日Google PageSpeed通话,这些通话将在提交后通知我,或者每天如果我导致Google PageSpeed'等级'下降(对于给定页面).

所以我通过Google的PageSpeed Insights运行我的网站,它告诉我,我可以通过延迟加载非关键资源来改善CSS交付.特别是它引用了包含字体真棒:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">

我想我可以通过简单地将它放在关闭body标签之前的脚本之前来延迟它的负载,如下所示:

  ...
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
  <script src="js/min/scripts.min.js"></script>
</body>
</html>

然而!在查看Google 关于交付速度的文档时,我发现了两种不同的解决方案.

用我的母语(荷兰语;你可以在右下角更改文档的语言)文档声明我应该将非必要的CSS 放在结束的html标记之下.这对我来说似乎很奇怪.在尝试通过JS访问文件时,这会不会复杂化？ 你为什么不把它放在关闭身体标签之前？

  ...
  </body>
</html>
<link rel="stylesheet" href="small.css">

但是,在英文文档中,事情变得更复杂并需要JavaScript:

    ...
    <script>
      var cb = function() {
        var l = document.createElement('link'); l.rel = 'stylesheet';
        l.href = 'small.css';
        var h = document.getElementsByTagName('head')[0]; h.parentNode.insertBefore(l, h);
      };
      var raf = requestAnimationFrame || mozRequestAnimationFrame ||
          webkitRequestAnimationFrame || msRequestAnimationFrame;
      if (raf) raf(cb);
      else window.addEventListener('load', cb);
    </script>
  </body>
</html> …

我们的网站正在考虑切换到http2.

我的理解是http2渲染文件连接等优化技术已经过时,因为使用http2的服务器只发送一个请求.

相反,我看到的建议是,最好保持较小的文件大小,以便它们更有可能被浏览器缓存.

它可能取决于网站的大小,但如果网站的文件使用http2并希望专注于缓存,它应该有多小？

在我们的例子中,我们的许多单独的js和css文件都在1kb到180kb的范围内.Jquery和bootstrap可能更多.累积起来,我们网站上新下载的页面通常不到900 kb.

所以我有两个问题:

这些文件大小是否足够小,可以被浏览器缓存？

如果它们小到可以缓存,那么对于使用不支持http2的浏览器的用户来说,连接文件是否合适.

在这种情况下拥有更大的文件大小并使用HTTP2会不会有害？这样,运行任一协议的用户都会受益,因为站点可以针对http和http2进行优化.

当您想要包含 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，选择某种样式，然后单击右上角的公文包图标。）