pagespeed相关内容

如何在本地计算机上测试FONT-DISPLAY：SWAP？

为了克服不可见文本，PageSpeedInsights建议在@font-face声明中使用font-display: swap对整个应用程序使用后备字体。我已将该属性添加到我的Web应用程序的每个@font-face，但无法测试它，因为更改仍在我的本地计算机上。 那么，现在如何在我的本地计算机上测试font-display: swap并确保它正常工作，并可能捕获一些屏幕截图或具有支持它的文档 ..
发布时间：2022-04-19 14:35:54 前端开发

使用Google Tag Manager在加载后插入元素，避免内容布局改变

在客户站点上，我有一个元素，它产生CLS, content layout shift。此元素对网站的运行并不重要。 According to Nic Jansma，CLS测量以onLoad事件结束。 我的想法是从源代码中删除此元素，并在onLoad事件后使用Google Tag Manager加载它。遗憾的是，我不能走通常的路，因为issue nr. 3, according to S ..
发布时间：2022-04-10 09:34:12 前端开发

我如何使用缓存控制和 ETag 来设置 http 标头

我想按照谷歌的建议在我的 joomla 网站中使用缓存控制和 ETag.但不知道如何做到这一点.我用谷歌搜索了很多，但找不到任何有价值的例子. 谁能告诉我怎么做..?? 对于缓存控制，我找到了这个示例，但这是完整的语法吗..??以及将它放置在 index.php 文件的 标签中的什么位置??. 另外请告诉我 ETag 的语法和写的地方. 解决方案 为此，您可以使用位于网站 ..
发布时间：2022-01-06 21:30:34 其他开发

PageSpeed Insights 99/100 因为 Google Analytics - 我如何缓存 GA?

我正在寻求在 PageSpeed 上达到 100/100，而且我快到了.我试图找到一个很好的解决方案来缓存 Google Analytics. 这是我收到的消息: 利用浏览器缓存在静态资源的 HTTP 标头中设置到期日期或最长期限会指示浏览器从本地磁盘而不是通过网络加载先前下载的资源.为以下可缓存资源利用浏览器缓存:http://www.google-analytics.com/ana ..
发布时间：2021-12-29 21:15:49 其他开发

通过 Bootstrap 使用 Accelerated Mobile Pages

我有一个使用 Bootstrap 的网站.从技术上讲，我目前正在使用 Bootstrap 4.我想在我的页面面向公众的部分中利用 Accelerated Mobile Pages (AMP).但是，我有几个错误似乎无法动摇.这让我想知道，我什至可以将 Bootstrap 与 Accelerated Mobile Page 一起使用吗? 我什至可以在 Accelerated Mobile Pa ..
发布时间：2021-11-27 11:38:14 前端开发

我的 js 滑块导致 CLS 分数较低:如何更改滑块的加载方式?

我在谷歌页面速度测试中的 CLS(布局转换)分数很低，我发现这是因为我的滑块加载方式.当页面加载时(主要是在慢速连接上)，滑块的图像都在彼此下方加载，当页面加载完成并且 javascript 加载时，只有这样其余的图像才会隐藏并开始滑动. 我根据教程创建了以下滑块.我不知道如何解决这个问题.我认为最好的方法是尝试隐藏所有其他图像(第一个除外)，直到加载 javascript.有没有办法用ja ..
发布时间：2021-06-15 19:55:57 前端开发

如何在本地主机上使用谷歌的页面速度洞察工具

我正在使用 google 的页面速度洞察工具，在生产中，它工作正常. 但是可以在 localhost 上使用它吗?或者是否有任何等效的工具来测试本地页面? 我知道灯塔标签也是一种选择，但指标有些不同！我需要在该服务中使用的相同 API！ 解决方案 您可以使用 Lighthouse 命令线路接口 (CLI)(或 从 NodeJS 运行它 如果您对此很熟悉)，这是为 Page Sp ..
发布时间：2021-06-13 19:54:20 其他开发

Yandex metrika 标签降低了网站速度 谷歌页面速度 isights 报告

因此，在我所有的网页上，我都有 Yandex metrika 用于分析的代码.根据谷歌的说法，这个脚本会减慢我的页面速度，需要改变它的加载方式以防止渲染阻塞、TTI 输入阻塞时间、FID 首次输入延迟阻塞、首次内容绘制阻塞. (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(参数)};m[i].l=1* ..
发布时间：2021-06-13 19:54:14 其他开发

删除未使用的代码 Google Page Speed 和其他错误

Google 页面速度 在这里报告我一个我无法理解的错误. 删除未使用的代码我使用了 Google Page Speed 所说的所有 javascript，实际上 vendor.js 是该项目的主要脚本.与 Webpack 和 Laravel 编译和统一. 那为什么 Google Page Speed 说我不使用这些脚本?在我上传 lazysizes 插件之前，我没有得到任何这些. ..
发布时间：2021-06-13 19:54:11 其他开发

CLS 问题仅作为现场数据的一部分 - 如何诊断?

PageSpeed Insight 的网站是唯一一个我在现场和实验室数据中都遇到 CLS 问题的地方. 任何其他 Lighthouse 实例(通过 WPT、作为 API 或通过 DevTools)仅在现场数据中显示 CLS 问题，而不是在实验室中. 我如何正确诊断哪些元素导致了 CLS?示例. PS:我的问题有以下原因:分析我通常在 devtools → performance ..
发布时间：2021-06-13 19:54:08 其他开发

何时使用 rel="preload"?为什么预加载字体/FontAwesome 是个好主意?

我在 Google Pagespeed 中得到了这个推荐: '了解详情'-链接指向404.我试图弄清楚为什么这应该为我节省 7.08 秒，但找不到. 我认为在页面上加载 10 个图标是最后的优先事项?！图像、其他字体和脚本不是更重要吗? 或者以某种方式拖延了一些东西，这些字体没有加载? 我可以在我的网络选项卡中看到，如果我这样加载字体: ..
发布时间：2021-06-13 19:54:04 前端开发

Cumulative Layout Shift 是否停止衡量用户交互?

Cumulative Layout Shift 指标是否停止衡量用户交互?Google 关于累积布局转换的指南说: 响应用户交互(点击链接、按下按钮、在搜索框中键入等)是一般没问题，只要偏移发生得足够接近关系对用户来说很清楚的交互. 解决方案 请务必记住，累积布局转换 (CLS) 不仅仅关注页面加载.我们看到的许多最有问题的布局转换发生在页面的初始加载完成之后.您可能已经开始阅读文章 ..
发布时间：2021-06-13 19:53:55 其他开发

从LightHouse到Performance之间的LCP时间-Google Chrome

使用google chrome chrome开发人员，我正在运行灯塔分析手机版. 灯塔显示最大内容绘画(LCP)的7.0秒延迟: 它将我重定向到“性能"选项卡: 0.7497秒的表现 LightHouse的时间为7.0秒 解决方案 为什么Lighthouse显示更长的加载时间? 答案是模拟的网络限制和 CPU节制..> 模拟网络节流 运行审核时，它将对每个请求施加 ..
发布时间：2021-05-12 19:09:41 其他开发