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

网页打开慢,这锅该谁背?

news 2026/3/30 13:32:12

一、背景

工作中扯皮说不可避免且非常常见的事情. 开发与产品、开发和测试、前端和后端都会产生扯皮现象。今天要聊的一个问题就是前后端之间的扯皮问题。

网页打开太慢或者点击了某个按钮发现数据很久才显示出来，这个锅谁背?

做开发不能无凭据地胡乱甩锅, 我们要用数据说话, 具体看哪个参数呢,就是我们今天介绍的 TTFB.

二、TTFB

Time To First Byte 就是后台响应的第一个字节到达浏览器的时间, 说白了这个值比较大的话就说明是后端接口的问题,比如达到了几秒甚至十几秒; 如果比较正常的话通常不会超过一秒,一般都是 ms 级别,当然数据较大的话可能会稍微慢点,当然慢太多的话就要考虑交互数据能不能缩小来优化了。

如果这个数据正常,那基本就可以把问题归结于前端渲染了,是不是阻塞了、有没有异步处理等。这口锅有理有据地传给了前端同事。

打开浏览器控制台(以chrome 为例)，点击Network，点击某个请求，切换到Timing 即可看到：

相关文章：

网页打开慢,这锅该谁背?

一、背景 工作中扯皮说不可避免且非常常见的事情. 开发与产品、开发和测试、前端和后端都会产生扯皮现象。今天要聊的一个问题就是前后端之间的扯皮问题。 网页打开太慢或者点击了某个按钮发现数据很久才显示出来，这个锅谁背? 做开发不能无凭据地胡乱甩锅, 我们…...

编程日记 2024/3/7 6:14:07

题目 1538: 蓝桥杯-格子位置

题目描述: 输入三个自然数N&#xff0c;i&#xff0c;j &#xff08;1< i< N&#xff0c;1< j< N&#xff09;&#xff0c;输出在一个N*N格的棋盘中&#xff0c;与格子&#xff08;i&#xff0c;j&#xff09;同行、同列、同一对角线的所有格子的位置。 样例解释…...

编程日记 2024/3/7 6:13:06

第十三届蓝桥杯嵌入式省赛程序设计详细题解

第十三届蓝桥杯嵌入式省赛题目相对于第十二届较为简单&#xff0c;没有那么多串口的数据处理以及判断&#xff01; 第十三届省赛主要是制作一个可由串口设置密码的密码锁。本实验中&#xff0c;我们将用到LED模块、按键模块、串口模块、定时器的PWM模块以及官方会提供源码的LC…...

编程日记 2024/3/7 6:12:05

Go 语言指针

1. 什么是指针&#xff1f; 在 Go 语言中&#xff0c;指针是一种特殊的数据类型&#xff0c;它存储了一个变量的内存地址。指针提供了直接访问和修改变量值的能力。 2. 指针的基本操作 2.1 声明指针 在 Go 中声明指针需要使用 * 符号&#xff0c;例如&#xff1a; var p *…...

编程日记 2024/3/7 6:11:04

指针运算笔试题解析

题目1&#xff1a; int main() { int a[5] { 1, 2, 3, 4, 5 }; int* ptr (int*)(&a 1); printf("%d %d", *(a 1), *(ptr - 1)); return 0; } ptr中存放了整个数组的地址&#xff0c;ptr是int*类型&#xff0c;&a1跳到5的地址后又被强制类…...

编程日记 2024/3/7 6:10:03

Matlab梁单元有限元编程 | 铁木辛柯梁 | 欧拉梁 | Matlab源码 | 理论文本

专栏导读 作者简介&#xff1a;工学博士&#xff0c;高级工程师&#xff0c;专注于工业软件算法研究本文已收录于专栏&#xff1a;《有限元编程从入门到精通》本专栏旨在提供 1.以案例的形式讲解各类有限元问题的程序实现&#xff0c;并提供所有案例完整源码&#xff1b;2.单元…...

编程日记 2024/3/7 6:05:59

Tensorflow2.0笔记 - 常见激活函数sigmoid，tanh和relu

本笔记主要记录常见的三个激活函数sigmoid&#xff0c;tanh和relu&#xff0c;关于激活函数详细的描述&#xff0c;可以参考这里&#xff1a; 详解激活函数&#xff08;Sigmoid/Tanh/ReLU/Leaky ReLu等&#xff09; - 知乎 import tensorflow as tf import numpy as nptf.__ve…...

编程日记 2024/3/7 6:03:57

1688商品详情数据采集，工程数据采集丨店铺数据采集丨商品详情数据采集

1688是中国的一个大型B2B电子商务平台&#xff0c;主要用于批发和采购各种商品。对于需要从1688上获取商品详情数据、工程数据或店铺数据的用户来说&#xff0c;可以采用以下几种常见的方法&#xff1a; 官方API接口&#xff1a;如果1688提供了官方的API接口&#xff0c;那么可…...

编程日记 2024/3/7 6:02:56

Flutter（四）：SingleChildScrollView、GridView

SingleChildScrollView、GridView 遇到的问题 以下代码会报错: class GridViewPage extends StatefulWidget {const GridViewPage({super.key});overrideState<GridViewPage> createState() > _GridViewPage(); }class _GridViewPage extends State<GridViewPage&g…...

编程日记 2024/3/7 5:59:53

【C++】102.二叉树的层序遍历

题目描述 给你二叉树的根节点 root &#xff0c;返回其节点值的 层序遍历 。 &#xff08;即逐层地&#xff0c;从左到右访问所有节点&#xff09;。 示例1&#xff1a; 输入&#xff1a;root [3,9,20,null,null,15,7] 输出&#xff1a;[[3],[9,20],[15,7]]示例 2&#xff1…...

编程日记 2024/3/7 5:58:52

Java学习笔记006——子类与父类的类型转换

在Java中&#xff0c;类型转换主要涉及到两种类型&#xff1a;向上类型转换&#xff08;Upcasting&#xff09;和向下类型转换&#xff08;Downcasting&#xff09;。 1. 向上类型转换&#xff08;Upcasting&#xff09;&#xff1a; 向上类型转换是将子类的对象转换为父类类…...

编程日记 2024/3/7 5:57:51

FedAsync Asynchronous Federated Optimization

文章目录 IntroductionMethodologyConvergence analysisExperiments Introduction 联邦学习有三个关键属性: 不频繁的任务激活。对于弱边缘设备&#xff0c;学习任务只在设备空闲、充电、连接非计量网络时执行.沟通不频繁。边缘设备和远程服务器之间的连接可能经常不可用、缓…...

编程日记 2024/3/7 5:56:50

学习基于 JavaScript 语言 的计算机界三大神书”之一 ——SICP

如何阅读“计算机界三大神书”之一 ——SICP 《计算机程序的构造和解释》&#xff08;Structure and Interpretation of Computer Programs&#xff0c;简记为SICP&#xff09;是MIT的基础课教材&#xff0c;出版后引起计算机教育界的广泛关注&#xff0c;对推动全世界大学计算…...

编程日记 2024/3/7 5:55:49

【RISC-V 指令集】RISC-V 向量V扩展指令集介绍(一)-向量扩展编程模型

1. 引言 以下是《riscv-v-spec-1.0.pdf》文档的关键内容&#xff1a; 这是一份关于向量扩展的详细技术文档&#xff0c;内容覆盖了向量指令集的多个关键方面&#xff0c;如向量寄存器状态映射、向量指令格式、向量加载和存储操作、向量内存对齐约束、向量内存一致性模型、向量…...

编程日记 2024/3/7 5:54:49

K8s 镜像缓存管理 kube-fledged 认知

写在前面 博文内容为K8s 镜像缓存管理 kube-fledged 认知内容涉及&#xff1a; kube-fledged 简单介绍部署以及基本使用 理解不足小伙伴帮忙指正 不必太纠结于当下&#xff0c;也不必太忧虑未来&#xff0c;当你经历过一些事情的时候&#xff0c;眼前的风景已经和从前不一样了。…...

编程日记 2024/3/7 5:52:45

ModbusTcp协议

Modbus TCP是一种通信协议&#xff0c;用于工业设备之间的通信。它是Modbus协议家族中的一个成员&#xff0c;最初是为串行通信设计的&#xff0c;但后来扩展到了TCP/IP网络。Modbus TCP/IP是一种公开的标准&#xff0c;由Modbus组织制定&#xff0c;并且被广泛应用于工业自动化…...

编程日记 2024/3/7 5:48:42

常用工具——Gradle

前言 实践是最好的学习方式&#xff0c;技术也如此。 文章目录 前言一、Gradle 简介二、文件结构详解 一、Gradle 简介 Gradle 文件是一个独立于 android 之外的一个东西&#xff1b; 是什么 gradle 就是编译、打包 Android 工程的一个构建工具&#xff1b;build.gradle 文件&…...

编程日记 2024/3/7 5:47:41

OpenHarmony教程指南—Navigation开发 页面切换场景范例

简介 在应用开发时&#xff0c;我们常常遇到&#xff0c;需要在应用内多页面跳转场景时中使用Navigation导航组件做统一的页面跳转管理&#xff0c;它提供了一系列属性方法来设置页面的标题栏、工具栏以及菜单栏的各种展示样式。除此之外还拥有动态加载&#xff0c;navPathSta…...

编程日记 2024/3/7 5:46:40

2024-简单点-picamera2除了文档还有哪里可以学习实例？

picamera2学习例子 去github的picamera2库&#xff0c;找app和examples目录&#xff0c;然后学习...

编程日记 2024/3/7 5:42:36

JavaScript实现点击鼠标弹钢琴的效果

思路&#xff1a; 图片设置宽900px&#xff0c;找到鼠标按下时的x坐标和img距离body的x坐标&#xff0c;两个值相减&#xff0c;然后除100取整&#xff0c;赋值给a&#xff0c;通过判断a的值来确定放出那个音乐。 完整代码&#xff1a; <!DOCTYPE html> <html lan…...

编程日记 2024/3/7 5:40:34

Umi-OCR深度指南：离线OCR技术的架构解析与全场景实战

Umi-OCR深度指南&#xff1a;离线OCR技术的架构解析与全场景实战 【免费下载链接】Umi-OCR Umi-OCR: 这是一个免费、开源、可批量处理的离线OCR软件&#xff0c;适用于Windows系统&#xff0c;支持截图OCR、批量OCR、二维码识别等功能。 项目地址: https://gitcode.com/GitHu…...

编程新知 2026/3/30 13:20:50

wan2.1-vae开源模型价值：相比闭源方案节省90%图像生成API调用成本

wan2.1-vae开源模型价值&#xff1a;相比闭源方案节省90%图像生成API调用成本 你有没有算过&#xff0c;每个月花在AI图像生成上的钱有多少&#xff1f; 如果你是内容创作者、电商运营、设计师&#xff0c;或者任何需要大量图片素材的人&#xff0c;可能已经习惯了这样的场景…...

编程新知 2026/3/30 12:44:18

mPLUG-Owl3-2B在教育、工作、生活中的10个实用场景分享

mPLUG-Owl3-2B在教育、工作、生活中的10个实用场景分享 1. 引言&#xff1a;多模态AI如何改变我们的日常 想象一下&#xff0c;当你随手拍下一张植物照片&#xff0c;AI不仅能告诉你它的学名&#xff0c;还能详细解释它的生长习性和养护要点&#xff1b;当你面对一份复杂的工…...

编程新知 2026/3/30 12:14:10

ScanTailor Advanced终极指南：免费开源扫描文档处理完整解决方案

ScanTailor Advanced终极指南&#xff1a;免费开源扫描文档处理完整解决方案 【免费下载链接】scantailor-advanced ScanTailor Advanced is the version that merges the features of the ScanTailor Featured and ScanTailor Enhanced versions, brings new ones and fixes. …...

编程新知 2026/3/30 12:00:04

告别Vue组件匿名时代：用vite-plugin-vue-setup-extend给你的＜script setup＞加个名字

为Vue组件正名&#xff1a;vite-plugin-vue-setup-extend深度整合指南 在Vue 3的组合式API开发中&#xff0c;<script setup>语法糖以其简洁性赢得了开发者的青睐。但当你打开Vue DevTools准备调试时&#xff0c;满屏的"Anonymous Component"是否曾让你感到困扰…...

编程新知 2026/3/30 11:56:03

攻克Godot资源提取难题：godot-unpacker工具的创新解法

攻克Godot资源提取难题&#xff1a;godot-unpacker工具的创新解法 【免费下载链接】godot-unpacker godot .pck unpacker 项目地址: https://gitcode.com/gh_mirrors/go/godot-unpacker 问题&#xff1a;为什么普通解压工具无法胜任PCK文件提取&#xff1f; Godot引擎打…...

编程新知 2026/3/30 11:11:39

SDMatte效果深度评测：复杂发丝与透明物体的抠图表现

SDMatte效果深度评测&#xff1a;复杂发丝与透明物体的抠图表现 1. 开篇&#xff1a;当AI遇到抠图难题 抠图技术发展了几十年&#xff0c;但遇到复杂发丝和透明物体时&#xff0c;传统方法往往束手无策。直到AI技术的介入&#xff0c;这个老大难问题才有了突破性进展。SDMatt…...

编程新知 2026/3/30 10:55:26

s2-pro语音合成镜像快速上手：5分钟搞定专业级文字转语音

s2-pro语音合成镜像快速上手&#xff1a;5分钟搞定专业级文字转语音 1. 镜像简介与核心功能 s2-pro是Fish Audio开源的专业级语音合成模型镜像&#xff0c;能够将文本转换为自然流畅的语音。这个镜像特别适合需要快速部署文字转语音功能的开发者、内容创作者和企业用户。 1.…...

编程新知 2026/3/30 10:55:26

互联网舆情分析系统：基于Nanbeige 4.1-3B的情感与主题挖掘

互联网舆情分析系统&#xff1a;基于Nanbeige 4.1-3B的情感与主题挖掘 最近几年&#xff0c;大家有没有感觉网上的声音越来越复杂&#xff1f;一个热点出来&#xff0c;瞬间就是成千上万条评论&#xff0c;有支持的&#xff0c;有反对的&#xff0c;有理性分析的&#xff0c;也…...

编程新知 2026/3/30 9:09:43

高效处理海量数据——pandas分块读取与内存管理实战

1. 为什么需要分块读取千万级数据&#xff1f; 第一次处理千万级CSV文件时&#xff0c;我盯着16GB的硬盘文件发愁——128GB内存的服务器居然加载到一半就崩溃了。这种场景在金融交易记录、物联网传感器数据、用户行为日志分析中太常见了。pandas默认的read_csv()会一次性把数据…...

编程新知 2026/3/30 8:37:28