当前位置： 首页 > news >正文

前端性能优化-实测

news 2026/2/8 12:32:22

 PageSpeed Insights 性能测试

今天测试网站性能的时候发现一个问题，一个h2标签内容为什么会占据这么长的渲染时间，甚至有阶段测到占据了7000多毫秒，使用了很多方法都不能解决，包括了修改标签，样式大小等，当我把它彻底删掉才没有出现这个问题，但是这个地方是不能删除这个标题的，以至于一直卡在这个地方并将我的性能评分卡在30-40内。
最后是怎么解决的呢。
首先这个网站字体样式使用了字体包，在未下载完字体包时阻碍了页面的显示，这就是为什么单这个标签的内容就渲染了这么久。解决方式也很简单，在使用字体包的引入中使用 font-display 属性，这个属性特别适用于自定义字体加载时的用户体验。

@font-face {font-family: "Inter";src: url("./fonts/Inter.ttf");font-display: swap;
}

这个属性在自定义字体下载完成之前，使用后备字体显示文本，确保用户可以阅读页面内容，而不是看到无样式的文本或乱码。

相关文章：

前端性能优化-实测

PageSpeed Insights 性能测试 今天测试网站性能的时候发现一个问题，一个h2标签内容为什么会占据这么长的渲染时间，甚至有阶段测到占据了7000多毫秒，使用了很多方法都不能解决，包括了修改标签，样式大小等，当…...

编程日记 2024/6/27 18:00:07

【Linux】初识操作系统

一、冯•诺依曼体系结构 在学习操作系统之前，我们先来认识一下冯•诺依曼体系结构，我们常见的计算机，如笔记本。我们不常见的计算机，如服务器，大部分都遵守冯诺依曼体系。 截至目前，我们所认识的计算机&am…...

编程日记 2024/6/27 17:59:06

等保2.0中，如何确保云服务提供商的数据主权合规？

等保2.0中云服务提供商的数据主权合规措施 等保2.0（网络安全等级保护2.0）是中国的网络安全标准，旨在确保云服务提供商的数据主权合规。以下是一些关键措施和要求： 数据地理位置要求：云服务提供商必须保证所有基础设施位…...

编程日记 2024/6/27 17:56:03

【AI大模型】Transformers大模型库（十四）：Datasets Viewer

目录 一、引言 二、Datasets Viewer数据查看器 2.1 概述 2.2 示例 三、总结 一、引言 这里的Transformers指的是huggingface开发的大模型库，为huggingface上数以万计的预训练大模型提供预测、训练等服务。 🤗 Transformers 提供了数以千计的预训练…...

编程日记 2024/6/27 17:54:01

一个例子理解傅里叶变换的计算过程

假设我们有一个简单的信号，由两个不同频率的正弦波组成，我们希望通过傅里叶变换来分析其频谱。 示例信号 假设我们有一个信号 ： 这个信号由两个频率成分组成：一个50 Hz的正弦波和一个120 Hz的正弦波，后者的振幅是前者…...

编程日记 2024/6/27 17:53:00

2-2到2-4

计算出所有人的平均年龄： val lines sc.textFile("/root/data/scala/people/page.txt") val count lines.count() val total lines.map(line > line.split(" ")(1)).map(t>t.trim.toInt).collect().reduce((a,b)>ab) val avgAge …...

编程日记 2024/6/27 17:51:59

Vatee万腾平台：一站式智慧服务，让生活更美好

在数字化浪潮席卷全球的今天，我们生活的方方面面都在经历着前所未有的变革。Vatee万腾平台凭借其一站式智慧服务，正成为推动这场变革的重要力量，让我们的生活变得更加美好。 Vatee万腾平台，作为一家专注于提供智慧服务的领军企业&…...

编程日记 2024/6/27 17:50:58

如何选择一个好的汽车油封制造商?

汽车的每一个零部件都至关重要，其中，油封的作用更是不可忽视。它们确保了液体和气体在汽车内部的正确流动，防止了泄漏。因此，选择一个可靠的汽车油封制造商就显得尤为重要。那么，我们应该如何做出明智的选择呢? 首先…...

编程日记 2024/6/27 17:49:56

构建高效的电商返利系统：架构设计与实现

构建高效的电商返利系统：架构设计与实现 大家好，我是免费搭建查券返利机器人省钱赚佣金就用微赚淘客系统3.0的小编，也是冬天不穿秋裤，天冷也要风度的程序猿！ 电商返利系统作为连接消费者和商家的桥梁，能够…...

编程日记 2024/6/27 17:44:51

如何使用 Python 交互式解释器？

1. 什么是Python交互式解释器？ Python交互式解释器是一种REPL（Read-Eval-Print Loop）环境。它会读取用户输入的代码，执行代码，并输出结果，随后等待下一个用户输入。这种交互方式使得Python非常适合快速原型…...

编程日记 2024/6/27 17:43:50

C++日期类的完整实现，以及this指针的const修饰等的介绍

文章目录 前言一、日期类的实现二、this指针的const修饰总结 前言 C日期类的完整实现&#xff0c;以及this指针的const修饰等的介绍 一、日期类的实现 // Date.h #pragma once#include <iostream> using namespace std;#include <assert.h>class Date {// 友元函…...

编程日记 2024/6/27 17:41:47

缓冲区溢出

本文作者&#xff1a;杉木涂鸦智能安全实验室 前置知识点 栈 栈&#xff08;Stack&#xff09;是计算机中的一种数据结构&#xff0c;用于存储临时数据。它的特点是后入先出&#xff08;LIFO&#xff09;&#xff0c;只能在栈顶添加或删除数据。在程序中&#xff0c;栈被用于…...

编程日记 2024/6/27 17:40:46

step7：“模拟量界面”逻辑

文章目录 文章介绍效果图AnalogPage.qml结构图调用 SerialPortHandler.sendData(message); serialporthandler.cpp 文章介绍 之前的6步实现了案例MF的界面设计和串口界面的逻辑设计&#xff0c;本文将实现模拟量界面的逻辑设计 新增功能&#xff1a; 1&#xff09;弹出提示框 …...

编程日记 2024/6/27 17:38:43

Arduino - 继电器

Arduino - 继电器 In a previous tutorial, we have learned how to turn on/off an LED. In this tutorial, we are going to learn how to turn on/off some kind of devices that use the high voltage power supply(such as a light bulb, fan, electromagnetic lock, lin…...

编程日记 2024/6/27 17:37:42

状态压缩DP——AcWing 327. 玉米田

状态压缩DP 定义 状态压缩 DP 是一种通过二进制压缩状态的动态规划算法。它通过使用位运算来加速状态的转移和计算&#xff0c;从而提高算法的效率。 注意事项 数据范围&#xff1a;状态压缩 DP 通常适用于数据范围较小的问题&#xff0c;因为它需要使用二进制来表示状态&a…...

编程日记 2024/6/27 17:36:41

kafka（二）安装部署（2）windows

目录 一、前提 1、jdk 2、Zookeeper 2.1、解压 2.2、创建data文件夹 2.3、配置文件 2.4、添加环境变量 2.5、启动zk&#xff1a;zkServer 2.6、客户端 3、Scala 3.1、下载安装 3.2、配置环境变量 3.3、验证是否安装成功 二、kafka下载安装 1、下载 2、安装 2.1…...

编程日记 2024/6/27 17:34:39

aliplayer Server returned 403 Forbidden (access denied)

最近在接入阿里云播放器的sdk,项目的播放地址是m3u8的,h265的url 输入播放源以后播放报错,提示403,拒绝访问,起初以为是crt路径问题和key的问题,然后检查了以后没问题,后来又看了一下是不是白名单的问题,但是项目资源没通过阿里云平台存储 AVPUrlSource *source [[AVPUrlSou…...

编程日记 2024/6/27 17:33:37

单例模式（下）

文章目录 文章介绍步骤安排及单例讲解step1&#xff1a;注册单例类型&#xff08;main.cpp&#xff09;step2&#xff1a;定义类和私有构造函数&#xff08;keyboardinputmanager.h&#xff09;step3:&#xff08;keyboardinputmanager.cpp&#xff09;step4&#xff1a;在qml中…...

编程日记 2024/6/27 17:32:36

合约期VS优惠期，搞明白他们的区别才能避免很多坑！

在购买流量卡时&#xff0c;相信大家也都发现了&#xff0c;市面上的不少套餐都是有合约期和优惠期的&#xff0c;尤其是联通和移动&#xff0c;那么&#xff0c;什么是合约期&#xff1f;什么又是优惠期呢&#xff1f; ​ 其实&#xff0c;目前很多在网上办理的大流量卡都是有…...

编程日记 2024/6/27 17:31:34

函数式反应式编程（FRP）在Scala中的实践与探索

函数式反应式编程&#xff08;Functional Reactive Programming&#xff0c;简称FRP&#xff09;是一种编程范式&#xff0c;它结合了函数式编程&#xff08;Functional Programming&#xff0c;FP&#xff09;的声明式特性和反应式编程&#xff08;Reactive Programming&#…...

编程日记 2024/6/27 17:30:33

未来机器人的大脑：如何用神经网络模拟器实现更智能的决策？

编辑&#xff1a;陈萍萍的公主一点人工一点智能 未来机器人的大脑&#xff1a;如何用神经网络模拟器实现更智能的决策&#xff1f;RWM通过双自回归机制有效解决了复合误差、部分可观测性和随机动力学等关键挑战&#xff0c;在不依赖领域特定归纳偏见的条件下实现了卓越的预测准…...

编程新知 2026/2/7 23:18:28

2025年能源电力系统与流体力学国际会议 (EPSFD 2025)

2025年能源电力系统与流体力学国际会议&#xff08;EPSFD 2025&#xff09;将于本年度在美丽的杭州盛大召开。作为全球能源、电力系统以及流体力学领域的顶级盛会&#xff0c;EPSFD 2025旨在为来自世界各地的科学家、工程师和研究人员提供一个展示最新研究成果、分享实践经验及…...

编程新知 2026/2/1 21:17:19

.Net框架，除了EF还有很多很多......

文章目录 1. 引言2. Dapper2.1 概述与设计原理2.2 核心功能与代码示例基本查询多映射查询存储过程调用 2.3 性能优化原理2.4 适用场景 3. NHibernate3.1 概述与架构设计3.2 映射配置示例Fluent映射XML映射 3.3 查询示例HQL查询Criteria APILINQ提供程序 3.4 高级特性3.5 适用场…...

编程新知 2026/2/1 19:26:16

macOS多出来了：Google云端硬盘、YouTube、表格、幻灯片、Gmail、Google文档等应用

文章目录 问题现象问题原因解决办法 问题现象 macOS启动台&#xff08;Launchpad&#xff09;多出来了&#xff1a;Google云端硬盘、YouTube、表格、幻灯片、Gmail、Google文档等应用。 问题原因 很明显&#xff0c;都是Google家的办公全家桶。这些应用并不是通过独立安装的…...

编程新知 2025/12/4 19:00:05

拉力测试cuda pytorch 把 4070显卡拉满

import torch import timedef stress_test_gpu(matrix_size16384, duration300):"""对GPU进行压力测试&#xff0c;通过持续的矩阵乘法来最大化GPU利用率参数:matrix_size: 矩阵维度大小&#xff0c;增大可提高计算复杂度duration: 测试持续时间&#xff08;秒&…...

编程新知 2025/12/7 12:35:20

C# SqlSugar：依赖注入与仓储模式实践

C# SqlSugar&#xff1a;依赖注入与仓储模式实践 在 C# 的应用开发中&#xff0c;数据库操作是必不可少的环节。为了让数据访问层更加简洁、高效且易于维护&#xff0c;许多开发者会选择成熟的 ORM&#xff08;对象关系映射&#xff09;框架&#xff0c;SqlSugar 就是其中备受…...

编程新知 2025/11/25 6:49:02

精益数据分析（97/126）：邮件营销与用户参与度的关键指标优化指南

精益数据分析&#xff08;97/126&#xff09;&#xff1a;邮件营销与用户参与度的关键指标优化指南 在数字化营销时代&#xff0c;邮件列表效度、用户参与度和网站性能等指标往往决定着创业公司的增长成败。今天&#xff0c;我们将深入解析邮件打开率、网站可用性、页面参与时…...

编程新知 2025/12/13 4:04:33

逻辑回归暴力训练预测金融欺诈

简述 「使用逻辑回归暴力预测金融欺诈&#xff0c;并不断增加特征维度持续测试」的做法&#xff0c;体现了一种逐步建模与迭代验证的实验思路&#xff0c;在金融欺诈检测中非常有价值&#xff0c;本文作为一篇回顾性记录了早年间公司给某行做反欺诈预测用到的技术和思路。百度…...

编程新知 2026/2/8 5:05:41

LCTF液晶可调谐滤波器在多光谱相机捕捉无人机目标检测中的作用

中达瑞和自2005年成立以来&#xff0c;一直在光谱成像领域深度钻研和发展&#xff0c;始终致力于研发高性能、高可靠性的光谱成像相机&#xff0c;为科研院校提供更优的产品和服务。在《低空背景下无人机目标的光谱特征研究及目标检测应用》这篇论文中提到中达瑞和 LCTF 作为多…...

编程新知 2025/12/31 17:08:10

2025年低延迟业务DDoS防护全攻略：高可用架构与实战方案

一、延迟敏感行业面临的DDoS攻击新挑战 2025年&#xff0c;金融交易、实时竞技游戏、工业物联网等低延迟业务成为DDoS攻击的首要目标。攻击呈现三大特征&#xff1a; AI驱动的自适应攻击&#xff1a;攻击流量模拟真实用户行为&#xff0c;差异率低至0.5%&#xff0c;传统规则引…...

编程新知 2025/8/29 1:00:19