惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

WordPress大学
WordPress大学
D
Darknet – Hacking Tools, Hacker News & Cyber Security
Hacker News: Ask HN
Hacker News: Ask HN
N
News and Events Feed by Topic
Forbes - Security
Forbes - Security
The Last Watchdog
The Last Watchdog
TaoSecurity Blog
TaoSecurity Blog
Schneier on Security
Schneier on Security
SecWiki News
SecWiki News
V
Vulnerabilities – Threatpost
Project Zero
Project Zero
O
OpenAI News
W
WeLiveSecurity
Security Archives - TechRepublic
Security Archives - TechRepublic
Exploit-DB.com RSS Feed
Exploit-DB.com RSS Feed
H
Hacker News: Front Page
Cisco Talos Blog
Cisco Talos Blog
Spread Privacy
Spread Privacy
Help Net Security
Help Net Security
P
Privacy & Cybersecurity Law Blog
K
Kaspersky official blog
S
Security @ Cisco Blogs
Latest news
Latest news
AWS News Blog
AWS News Blog
U
Unit 42
Martin Fowler
Martin Fowler
阮一峰的网络日志
阮一峰的网络日志
S
Secure Thoughts
CTFtime.org: upcoming CTF events
CTFtime.org: upcoming CTF events
Application and Cybersecurity Blog
Application and Cybersecurity Blog
Know Your Adversary
Know Your Adversary
Scott Helme
Scott Helme
博客园 - 司徒正美
B
Blog RSS Feed
C
Check Point Blog
Hacker News - Newest:
Hacker News - Newest: "LLM"
D
Docker
Google Online Security Blog
Google Online Security Blog
Jina AI
Jina AI
aimingoo的专栏
aimingoo的专栏
Recent Commits to openclaw:main
Recent Commits to openclaw:main
Last Week in AI
Last Week in AI
月光博客
月光博客
C
CXSECURITY Database RSS Feed - CXSecurity.com
S
SegmentFault 最新的问题
NISL@THU
NISL@THU
T
The Blog of Author Tim Ferriss
C
Cisco Blogs
Attack and Defense Labs
Attack and Defense Labs
小众软件
小众软件

碎言

不懂就别瞎掰掰:【程序员的常识】写的什么玩意? PrimaryOralMathPack 小学生口算题生成器 AI 辅助编程下的程序设计与代码编写 使用 Next.js 和 Tailwind CSS 构建可编辑和删除的 ToDo 待办事项应用 探索编程新境界:MarsCode 助你一臂之力 使用 Next.js 和 Tailwind CSS 搭建静态图片展示站点并部署到 Vercel AI 辅助编程:免费工具的优缺点及官网一览 GitHub push更新总是失败,写个python脚本解决 把博客从GitHub迁移到到了vercel ComfyUI 和 Flux.1 安装与使用教程 Flux.1 入门必知:硬件、环境、模型 Git项目的子文件夹中的内容无法同步到远程仓库的解决方法 blender流体Fluid使用中没有流体、流体穿模等一些问题的解决方法 博客聚合网站:积薪,竟然关闭了! blender日常使用中的一些技巧 虽然只有我自己在用,但还是更新了碎言博客的源代码, 与其在迷茫中困惑,不如在努力中前进 差点忘了我还有一个博客... 秧歌、博客和AI 终于熬到了新手上路 好久没有更新博客了。。。 老妈大腿骨骨折,最近一直在医院护理 Hello, September! Ubuntu开机自动启动Docker容器运行WordPress Docker 简单快速安装部署WordPress Docker下安装MySQL 加碘盐能防核辐射的话,还怕什么核战争? shields.io 一个简洁、一致、清晰的徽章 Ubuntu下使用root登录ssh的设置 GitHub Actions 构建、部署 Next.js项目 我又用回了"IE"--edge ubuntu-22-live-server 设置固定IP Next项目部署GitHub pages的一些坑 整理了一个下午的收藏夹...... 短暂而忙碌的暑假即将谢幕 GitHub Actions 是干什么用的? 放弃Next.js重构博客:经验、教训与未来技术探索 仅用了几个小时就使用next.js重构博客的所有功能 关于使用Next.js重构博客构思的记录 使用Tailwind css和JavaScript实现一个简单的返回顶部功能 罗技K380 F1-F12 功能键锁定 PHILIPS猛禽SPK8404机械键盘手感真是超赞! 局域网的DNS设置192.168.0.1与8.8.8.8,114.114.114.114有什么区别? 史诗结合的浪漫:《长安三万里》 聊 聊 友 情 链 接 1767个中文博客的数据洞察:中文博主都喜欢干啥? python requests 设置读取超时时间 八月回顾:博客之路,一路前行 Docker基础学习笔记和常用命令汇总 vim常用命令整理 Ubuntu 22 安装Docker过程记录 使用python结合feedparser模块编写自己的私人RSS订阅程序 博客大数据分析:38880条博文揭示博主最爱写什么? Windows下国产杀毒软件还有选择吗?火绒安全可以一试。 export exports module.exports 这三个命令的区别是什么如何使用? 时代的变迁:从56K拨号上网到1G光纤的回忆 理工计算机专业准大学生如何选配笔记本? 使用JavaScript编写自己的私人RSS订阅程序 如何使用CSS为博客标题设置彩虹颜色? 最终还是决定使用传统的网线来解决千兆速率问题。 1300M USB双频2.4+5G无线网卡的一些常识和使用技巧 Python Gui新框架:NiceGui之初体验 pycharm 正在关闭项目(closing project)无法关闭退出程序的解决方法! 速度与优雅:博客性能优化之旅 久了,博客主题就会一直做减法 七月的焦虑 在react中使用复制插件clipboard.js react中如把HTML代码转成字符串进行渲染? react useEffect()中使用lodash库中的防抖debounce react useEffect() 为什么在开发模式的时候会执行两次? 七年之痒!别了我曾深爱的MacBookPro 前端React+Material UI开发环境的快速搭建 一键更新Github部署的静态博客 编程新手学习过程中如何更好的提问? Typed.js 一款有意思的网页打字机效果库 解决错误 ERROR [WinError 10049] 在其上下文中,该请求的地址无效。 Stable Diffusion 相关教程与模型的记录 Stable Diffusion ControlNet openpose 报错无法使用 在react或vue中使用localStorage存储数据 使用React+Vite+TailwindCSS+daisyUI打造一个简单的ToDos 碎言静态博客 聊聊Python中的装饰器 npm更换源与nrm安装与配置 pip临时修改下载源 Vue快速学习笔记(9)Vuetify配置及简单使用 Vue快速学习笔记(8)webpack4.X配置Vue开发打包环境 Vue快速学习笔记(5)使用路由vue-router(1) Vue快速学习笔记(4)Vue组件中的数据传递 Vue快速学习笔记(3)Vue的组件 Vue快速学习笔记(2)Vue中的监听与计算属性 Vue快速学习笔记(1)Vue实例基础 基于Django构建的小学生英文单词背写检测考试系统。 如何在Python程序中使用配置文件.ini(ConfigParser) 写在我的博客PV10万时:聊聊编程与画画 python3函数学习笔记简单总结 PythonINI配置文件读写的简单方法 Python open()函数文件打开、读、写操作总结 Python os.path模块中一些常用方法的整理总结 Python 采集数据三步曲之[Requests + re.py模块进行数据采集] Python 采集数据三步曲之[Requests开源协议的HTTP 库]
关于Google LCP 问题:超过了2.5秒 验证已通过
J.sky · 2023-08-14 · via 碎言

持续了一个月的 LCP 问题:超过了 2.5 秒(桌面设备),经过了20多天的验证终于通过了,总结一下关于解决LCP问题的经验。

问题回顾

什么是 LCP?

最大内容绘制 (LCP) 指标会根据页面首次开始加载的时间点来报告可视区域内可见的最大图像或文本块完成渲染的相对时间。

怎样算是良好的 LCP 分数?

为了提供良好的用户体验,网站应该努力将最大内容绘制控制在2.5 秒或以内。为了确保您能够在大部分用户的访问期间达成建议目标值,一个良好的测量阈值为页面加载的第 75 个百分位数,且该阈值同时适用于移动和桌面设备。

LCP出现了问题,会有什么后果?

Google有个核心网页指标,如果你的网页出现了LCP问题,那么Google就把你的网页移除核心网页,虽然Google没有说明核心网页被移除后会降低搜索排名,但是非核心网页的展示量却会少的很多。另外LCP存在问题的时候是很影响用户打开网页的体验的,这个我是深有体会。

发现问题

大约20多天前Google给我发邮件:LCP 问题:超过了 2.5 秒(桌面设备)需要解决,存在此问题的网址需要改进其网页体验的邮件,我登陆了Google站长平台看了一下数据指标,我的核心网页都被删掉了,直接为零。

博客名称

其中上图橙色的条子就是出现问题的网址,Google会将问题网页打好编组,Google还提供了一个在线的检测的网址,用来检测你的网页中的问题,很专业哈,我就拿来自己的网页去检测,好家伙这一检测就发向好多问题,具体如下图:

博客名称

检测网址:PageSpeed Insights 网页速度测量工具,感兴趣的可以自己试试自己的网站。

我这个人有点强迫症,看到这样指标的图确实很不爽!所以决定对网页进行优化!

解决问题

使用网页速度测量工具测量后,检测工具会给出全方位指导意见,对于一些问题的发现和解决只要按着工具给出的指引就可以很好的修改和优化,我之前的问题就是因为网页上加载了一个很大的依赖文件,由于我的前端并没有优化打包,所以有些依赖的包就是一股脑都上了,造成页面加载缓慢,我清楚的记得当时我自己都觉得加载太慢了,打开页面都会烦躁!

后来我就删除了影响页面打开的依赖,当然也不能怪那个框架,因为人家也提示了,不建议直接CDN引用,建议在打包编译的环境中使用,我当时就是图个痛快,好吧只好忍痛弃之,顺便优化了前端,然后再次去测量的网站进行测量:

博客名称

嘿,经过一阵折腾终于搞定了,然后就是提交Google对有问题的网页组进行审核,Google说明了需要大约30天的时间,因为他需要一个用户的体验数据,根据页面的加载速度的数据平均值来判断你是否通过了审核。

终于通过审核了

可能没啥人关注这个LCP问题吧?难道就我一个人在关注吗?来看看审核之后的数据图表,大约25天才审核过去,这个指标需要有人访问你的网站产生数据才会生成。

博客名称 博客名称 博客名称 博客名称

还别说,我喜欢100分,虽然不是什么比赛和考试,但是这个指标说明浏览你的网页的用户体验良好!对于一个时用GitHub pages 存放网页的站长,我把页面优化成这个分值我很满足了,博客内容咱不敢说写的如何,但是这个页面的打开和加载的体验感,至少通过了专业的审核哈!最后,来试试你的网站,看看桌面版的得了多少分?

检测网址:PageSpeed Insights 网页速度测量工具,感兴趣的可以自己试试自己的网站。