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

大白话前端性能优化，常见方法有哪些？

news 来源：原创 2025/9/12 19:06:23

大白话前端性能优化，常见方法有哪些？

咱来唠唠前端性能优化，其实就是想办法让网页打开得更快、用起来更流畅，就跟给汽车做保养让它跑得更顺溜一样。下面详细说说常见的优化方法：

压缩代码

  • CSS 压缩：CSS 代码里有好多空格、换行符啥的，这些东西对浏览器显示页面没啥用，还占地方。压缩 CSS 就是把这些多余的东西去掉，让代码变得更紧凑。比如说，把 body { font - size: 16px; line - height: 1.5; } 变成 body{font-size:16px;line-height:1.5}，这样文件变小了，浏览器下载起来就快多了。
  • JavaScript 压缩：和 CSS 一样，JavaScript 代码里也有很多不必要的空格、注释。压缩 JavaScript 就是把这些东西去掉，还会把变量名换成更短的，像把 let myVeryLongVariableName 换成 let a。这样一来，代码文件小了，加载速度也就快了。

图片优化

  • 图片格式选择：不同的图片格式适合不同的场景。像 JPEG 格式适合色彩丰富的照片，它能在保证一定质量的前提下把文件大小压得比较小；PNG 格式适合有透明效果的图片；SVG 格式适合图标和一些简单的图形，它是矢量图，放大缩小都不会失真，而且文件一般比较小。
  • 图片压缩：用专门的图片压缩工具，把图片里一些人眼不太能察觉的细节去掉，这样图片文件就变小了。比如说，一张 2MB 的照片，经过压缩后可能就变成 500KB 了，下载速度就快多了。
  • 响应式图片：现在的设备屏幕大小不一样，有的是手机，有的是电脑。响应式图片就是根据设备屏幕的大小，给它显示不同尺寸的图片。在手机上就显示小一点的图片，在电脑上就显示大一点的图片，这样既能保证图片在不同设备上都能清晰显示，又不会让手机下载太大的图片浪费流量和时间。

缓存机制

  • 浏览器缓存：浏览器有个缓存功能，就像一个小仓库。当你第一次访问一个网页时，浏览器会把网页里的一些文件，像 CSS、JavaScript、图片等，存到这个小仓库里。下次你再访问这个网页时，浏览器会先看看小仓库里有没有这些文件，如果有，就直接从仓库里拿出来用，不用再从网上下载了，这样速度就快多了。
  • CDN 缓存：CDN 就是内容分发网络，它在全国各地甚至全球都有服务器。当你访问一个网页时，CDN 会把网页里的文件缓存在离你最近的服务器上。这样，你下载文件的距离就短了，速度也就快了。比如说，你在北京，访问一个网站的图片，这个图片可能就从北京的 CDN 服务器上下载，而不是从远在国外的源服务器上下载。

减少 HTTP 请求

  • 合并文件：把多个 CSS 文件合并成一个，多个 JavaScript 文件也合并成一个。比如说，你有三个 CSS 文件，合并成一个后，浏览器就只需要下载一次，而不是下载三次，这样就减少了 HTTP 请求的次数，速度也就快了。
  • 雪碧图：把多个小图标合并成一张大图片，然后通过 CSS 来控制显示哪一部分。比如说，你网页上有很多小图标，每个图标都要发一个 HTTP 请求去下载，用雪碧图后，只需要下载一张大图片，然后通过 CSS 把需要的图标显示出来，这样就减少了请求次数。

懒加载

  • 图片懒加载：网页上可能有很多图片，但有些图片在用户刚打开网页时是看不到的，要往下滚动页面才能看到。图片懒加载就是等用户滚动到能看到这些图片的位置时，再去下载这些图片。比如说，一个很长的图片列表，用户刚打开网页时只能看到前面几张图片，后面的图片就先不下载，等用户滚动到后面时再下载，这样可以节省带宽和时间。
  • 组件懒加载：在单页应用里，有很多组件。组件懒加载就是等用户需要用到某个组件时，再去加载这个组件。比如说，一个电商网站，有商品列表页和商品详情页，用户刚打开网站时，只需要加载商品列表页的组件，等用户点击某个商品进入详情页时，再去加载商品详情页的组件，这样可以让网页打开得更快。

优化 HTML 结构

  • 语义化标签：用 HTML5 里的语义化标签，像 <header>、<nav>、<main>、<article>、<footer> 等，这些标签能让搜索引擎和浏览器更好地理解网页的结构。比如说，<header> 标签一看就知道是网页的头部，搜索引擎可以根据这些标签更准确地抓取网页内容，浏览器也能更高效地渲染页面。
  • 减少嵌套：HTML 标签的嵌套不要太深，太深的嵌套会让浏览器解析起来更费劲。比如说，不要搞很多层不必要的 <div> 嵌套，尽量让 HTML 结构简单清晰。

除了上述方法，还有哪些其他的前端性能优化方法？

前面咱们说了压缩代码、图片优化、缓存机制这些前端性能优化的方法，其实还有不少其他实用的办法，下面接着给你唠唠：

渲染优化

  • 服务端渲染（SSR）和静态站点生成（SSG）
    • 服务端渲染（SSR）：一般情况下，普通的前端页面是在浏览器里把页面“拼”出来的。而服务端渲染呢，就像是饭店大厨提前把菜做好，直接端给你。服务器在收到请求后，就把完整的 HTML 页面生成好再发给浏览器，浏览器拿到后能直接显示内容，不用再花时间去“组装”页面，这样页面就能更快地展示给用户。比如新闻网站用服务端渲染，用户一点击链接，马上就能看到新闻内容，而不是先看到个空白页面再慢慢加载。
    • 静态站点生成（SSG）：这就好比饭店提前准备好很多份一样的菜，等客人来的时候直接端上去。在项目构建的时候，就把所有页面的 HTML 文件都生成好，当用户访问时，服务器直接把这些静态的 HTML 文件发出去，响应速度超级快。像一些博客网站，内容更新不是特别频繁，就很适合用静态站点生成。
  • 虚拟列表：假如你有一个很长的列表，里面有上千条数据，要是一下子把这些数据都渲染出来，浏览器肯定会“累坏”，加载速度变慢。虚拟列表就只渲染用户当前能看到的那部分数据，就像你看书的时候，眼睛只能看到当前这几页，其他页不用提前都翻开。当用户滚动页面时，再动态地加载和渲染新的数据，这样能大大减少渲染的工作量，提高性能。比如一些社交软件的聊天记录列表，用虚拟列表就能让滚动更流畅。

网络请求优化

  • HTTP/3 协议：以前的 HTTP 协议在传输数据的时候可能会有一些问题，比如传输速度慢、容易丢包。HTTP/3 协议就像是给数据传输换了一条更宽敞、更平坦的高速公路。它采用了新的传输技术，能让数据传输得更快、更稳定。如果你的网站支持 HTTP/3 协议，用户访问时数据下载和上传的速度都会变快。
  • 请求合并与分割
    • 请求合并：有时候我们的页面需要从服务器获取好几个不同的数据，就像你去超市买东西，一趟一趟地跑很浪费时间，不如一次把所有东西都买齐。请求合并就是把多个小的请求合并成一个大的请求，这样可以减少网络连接的开销，提高请求效率。比如一个页面需要获取用户信息、商品列表和广告信息，就可以把这三个请求合并成一个。
    • 请求分割：和请求合并相反，当一个请求的数据量特别大时，就像你要搬一个超级大的箱子，很难一下子搬走，不如把它分成几个小箱子，一次搬一个。请求分割就是把一个大的请求拆分成几个小的请求，分批次进行传输。这样可以避免因为一个大请求失败而导致整个数据都获取不到，也能让页面更快地展示部分内容。

字体优化

  • 字体子集化：有些字体文件特别大，因为里面包含了很多我们用不到的字符。字体子集化就像是从一本大字典里挑出你需要的字，只保留页面中实际使用的字符。这样字体文件的大小就会大大减小，下载速度也就变快了。比如一个英文网站，就可以只保留英文字符，去掉其他语言的字符。
  • 字体预加载：在浏览器开始渲染页面之前，就提前把字体文件下载好。就像你做饭之前先把食材准备好，等要用的时候就不用再去买了。字体预加载可以让字体在需要显示的时候马上就能用，避免出现字体闪烁或者显示不正常的问题。

动画优化

  • 使用 CSS 动画：CSS 动画就像是给元素穿上了一件会动的衣服，它是由浏览器的渲染引擎直接处理的，性能比 JavaScript 动画要好。因为 JavaScript 动画需要不断地修改元素的样式，会触发浏览器的重排和重绘，比较消耗性能。而 CSS 动画在渲染时更高效，能让动画更流畅。比如一个简单的按钮点击动画，用 CSS 来实现就又简单又快。
  • 硬件加速：让浏览器利用计算机的 GPU（图形处理器）来处理动画，就像给汽车装上了一个更强大的发动机。在 CSS 里可以通过设置 transform 和 opacity 属性来触发硬件加速，这样动画的渲染速度会更快，尤其是在处理复杂动画时效果更明显。

咱接着唠唠除了之前说的那些，还有啥前端性能优化的招儿。

代码运行效率优化

  • 减少重排和重绘
    • 重排和重绘就像是你重新布置房间。重排就是把房间里的家具位置重新摆放，重绘就是给家具重新刷漆。在网页里，改变元素的布局信息（像宽高、位置）就会触发重排，改变元素的外观样式（像颜色、透明度）就会触发重绘。这俩操作都挺费时间的。
    • 那怎么减少呢？比如说你要改一个元素的好多样式，别一次改一个，把要改的样式攒一块儿，一次性改完。就像你要重新布置房间，别搬一下家具刷一下漆，先把家具都摆好，再统一刷漆。
  • 避免全局变量滥用
    • 全局变量就像是公共仓库，谁都能去拿东西、放东西。在代码里用太多全局变量，就容易乱套，别人不知道谁改了这个变量的值，还可能会造成命名冲突。而且全局变量一直占着内存，不释放，会让网页变卡。
    • 所以能用局部变量就用局部变量，局部变量就像你自己的小抽屉，只有在特定的地方能用，用完就扔了，不占地方。

事件处理优化

  • 事件委托
    • 假如你家里有一堆孩子，你要告诉他们一件事儿，一个个去说多麻烦。你可以把孩子们都叫到客厅，一次性告诉他们。在网页里，事件委托就是这个道理。比如说一个列表里有好多项，每个项都有点击事件，你不用给每个项都单独绑定事件，把事件绑定到列表这个大容器上就行。当点击列表里的某一项时，事件会冒泡到列表容器上，然后在容器上处理这个事件，这样能减少事件绑定的数量，提高性能。
  • 及时解绑事件
    • 就像你借了别人的东西，用完得还回去。在网页里，当一个元素不用了，或者一个组件销毁了，绑定在它上面的事件也得解绑。不然这些事件还占着内存，会让网页越来越慢。比如一个弹窗关闭后，就要把弹窗上的点击事件、滚动事件啥的都解绑。

浏览器渲染优化

  • 优化关键渲染路径
    • 关键渲染路径就像是做菜的步骤，浏览器拿到 HTML、CSS、JavaScript 这些材料后，要按照一定步骤把页面做出来。优化关键渲染路径就是让这个步骤更简单、更快。比如说，把重要的 CSS 代码放在 HTML 文件的 <head> 标签里，让浏览器能尽快拿到并渲染样式；把 JavaScript 代码放在 HTML 文件的底部，避免它阻塞页面的渲染。
  • 利用浏览器的渲染特性
    • 不同的浏览器有不同的渲染特性，就像不同的厨师有不同的做菜习惯。我们要了解这些特性，利用好它们。比如说，Chrome 浏览器对硬件加速支持得比较好，我们就可以多利用 CSS 的 transform 和 opacity 属性来触发硬件加速，让动画更流畅。

第三方资源优化

  • 谨慎使用第三方插件和脚本
    • 第三方插件和脚本就像你请别人来帮你做事儿，虽然能省点力气，但也可能带来麻烦。有些第三方插件和脚本代码质量不好，或者会加载很多不必要的资源，让网页变慢。所以用之前要好好选，选那些口碑好、性能高的。而且能用原生代码实现的功能，就别用第三方插件。
  • 优化第三方资源加载顺序
    • 假如你要做一顿饭，得先把米下锅，再炒菜。在网页里，加载第三方资源也有个顺序。把重要的、影响页面显示的资源先加载，比如字体文件、关键的 CSS 样式。把那些不那么重要的，像广告脚本、统计脚本，放在后面加载，或者用异步加载的方式，别让它们影响页面的初次加载速度。

除了前面提到的前端性能优化方法，还有以下几种有效的优化手段：

资源加载优化

  • 预连接（Preconnect）：当浏览器访问一个网站时，它需要和服务器建立连接，这个过程会消耗一定的时间。预连接就是提前告诉浏览器要和哪些服务器建立连接，让浏览器在空闲的时候就把连接建立好。比如网站中有从第三方服务器加载的资源，像图片、字体等，就可以使用预连接提前建立与这些服务器的连接，等真正需要加载资源时，就能节省连接时间，加快资源加载速度。在 HTML 中可以使用 <link rel="preconnect" href="https://example.com"> 这样的标签来实现。
  • 预渲染（Prerender）：预渲染就像是提前把下一场电影的画面准备好，等你想看的时候能马上开始播放。它会在后台提前加载并渲染某个页面，当用户访问该页面时，就可以直接显示已经渲染好的内容，大大减少等待时间。不过预渲染会消耗额外的资源，所以一般只针对用户很可能会访问的页面使用，比如电商网站的商品详情页、新闻网站的热门文章页等。在 HTML 中可以使用 <link rel="prerender" href="https://example.com/page"> 来实现。

框架与库优化

  • 按需加载框架与库：很多前端框架和库功能丰富，但体积也比较大。按需加载就是只加载项目中实际用到的部分，而不是把整个框架或库都加载进来。比如使用 Vue 或 React 时，很多组件和功能可能用不到，就可以只引入必要的部分。像 Vue 的路由懒加载，就是在用户访问特定路由时才加载对应的组件，减少初始加载的代码量。
  • 优化框架配置：不同的前端框架有不同的配置选项，合理配置这些选项可以提高性能。例如在 React 中，使用 shouldComponentUpdate 或 React.memo 可以避免不必要的组件重新渲染；在 Vue 中，使用 v-once 指令可以让元素只渲染一次，后续数据变化时不再重新渲染，减少渲染开销。

数据处理优化

  • 分页与无限滚动：当页面需要展示大量数据时，一次性加载所有数据会导致页面加载缓慢，而且用户也很难快速找到自己需要的信息。分页就是把数据分成若干页，每次只加载当前页的数据，用户可以通过点击页码切换页面。无限滚动则是当用户滚动到页面底部时，自动加载下一页的数据，给用户一种数据源源不断的感觉。这两种方式都能减少初始加载的数据量，提高页面性能，同时提升用户体验。比如社交媒体的动态列表、电商的商品列表等场景都经常使用这两种方式。
  • 数据缓存：对于一些不经常变化的数据，可以将其缓存起来。当需要使用这些数据时，先检查缓存中是否存在，如果存在就直接从缓存中获取，而不是再次从服务器请求。这样可以减少网络请求，提高数据获取速度。例如，一些下拉列表中的选项数据，如果不经常更新，就可以在首次获取后进行缓存。

错误处理与监控

  • 优雅降级与渐进增强：优雅降级是指在高端浏览器或设备上提供完整的功能和良好的体验，而在低端浏览器或设备上，虽然可能无法实现全部功能，但仍然能保证基本的可用性。比如在支持 CSS3 动画的浏览器中展示炫酷的动画效果，在不支持的浏览器中则以静态页面展示内容。渐进增强则相反，先确保在所有浏览器和设备上都能实现基本功能，然后在高端浏览器或设备上逐步添加额外的功能和效果。这两种策略都能让不同环境下的用户都能正常访问页面，同时避免在低性能设备上加载过多不必要的资源。
  • 性能监控与分析：使用专业的性能监控工具，如 Google Analytics、New Relic 等，对网站的性能进行实时监控和分析。这些工具可以帮助你了解页面的加载时间、资源请求情况、用户行为等信息，找出性能瓶颈所在。例如，通过分析工具发现某个图片文件过大导致加载缓慢，就可以针对性地对该图片进行优化；或者发现某个脚本执行时间过长，就可以对脚本进行优化或重构。

相关文章：

大白话前端性能优化，常见方法有哪些？

大白话前端性能优化&#xff0c;常见方法有哪些&#xff1f; 咱来唠唠前端性能优化&#xff0c;其实就是想办法让网页打开得更快、用起来更流畅&#xff0c;就跟给汽车做保养让它跑得更顺溜一样。下面详细说说常见的优化方法&#xff1a; 压缩代码 CSS 压缩&#xff1a;CSS …...

编程日记 2025/9/12 19:06:23

IP属地是通过卫星定位的吗？如何保护用户隐私

在数字时代&#xff0c;网络空间成为了人们日常生活不可或缺的一部分。随着社交媒体、在线服务等平台的兴起&#xff0c;用户IP属地信息的重要性日益凸显。然而&#xff0c;关于IP属地是如何确定的&#xff0c;尤其是是否通过卫星定位这一问题&#xff0c;却常常引发公众的疑问…...

编程日记 2025/9/7 22:07:19

Vue3+Node/Express支付宝沙箱支付与确认支付

Vue3Node/Express支付宝沙箱支付与确认支付 支付宝沙箱配置进入沙箱选择自定义密钥 密钥工具下载生成密钥格式转换 自定义密钥设置Express安装依赖项目目录创建alipay.js请求&#xff08;打开支付&#xff09;代码router/pay.jsapp.js 前端代码前端封装接口前端调用 实现支付查…...

编程日记 2025/9/12 18:01:49

什么是大语言模型

大语言模型&#xff08;Large Language Model&#xff0c;LLM&#xff09;是一种基于深度学习技术的人工智能模型&#xff0c;旨在理解和生成人类语言。以下是大语言模型的详细介绍&#xff1a; 一、基本概念 大语言模型通常包含数百亿甚至数千亿个参数&#xff0c;通过在海量…...

编程日记 2025/9/12 9:54:17

本地部署Embedding模型API服务的实战教程

大家好，我是herosunly。985院校硕士毕业，现担任算法研究员一职，热衷于大模型算法的研究与应用。曾担任百度千帆大模型比赛、BPAA算法大赛评委，编写微软OpenAI考试认证指导手册。曾获得阿里云天池比赛第一名，CCF比赛第二名，科大讯飞比赛第三名。授权多项发明专利。对机器学…...

编程日记 2025/9/10 1:53:19

postgresql postgis扩展相关

项目 下载地址 http://rpmfind.net/linux/rpm2html/search.php?queryprotobuf(x86-64) Postgis Index of /postgis/source/ proj4 Index of /proj/ geos Index of /geos/ libxml2 ftp://xmlsoft.org/libxml2/ Index of /sources Json-c Releases json-c/json-c G…...

编程日记 2025/9/8 4:57:23

FFmpeg-chapter3-读取视频流（原理篇）

ffmpeg网站&#xff1a;About FFmpeg 1 库介绍 &#xff08;1&#xff09;libavutil是一个包含简化编程函数的库&#xff0c;包括随机数生成器、数据结构、数学例程、核心多媒体实用程序等等。 &#xff08;2&#xff09;libavcodec是一个包含音频/视频编解码器的解码器和编…...

编程日记 2025/8/27 14:00:31

入门基础项目（SpringBoot+Vue）

文章目录 1. css布局相关2. JS3. Vue 脚手架搭建4. ElementUI4.1 引入ElementUI4.2 首页4.2.1 整体框架4.2.2 Aside-logo4.2.3 Aside-菜单4.2.4 Header-左侧4.2.5 Header-右侧4.2.6 iconfont 自定义图标4.2.7 完整代码 4.3 封装前后端交互工具 axios4.3.1 安装 axios4.3.2 /src…...

编程日记 2025/9/5 5:42:26

C#调用CANoeCLRAdapter.dll文章（二）

一、引言 在上一篇指南中&#xff0c;我们介绍了如何通过C#调用CANoeCLRAdapter.dll实现基础功能&#xff0c;包括COM接口操作、DLL导入和PANL面板集成。本文将进一步探讨高级功能开发&#xff0c;涵盖事件驱动编程、CAPL脚本双向通信以及异步任务处理&#xff0c;帮助开发者构…...

编程日记 2025/9/11 23:03:09

ai大模型自动化测试-TensorFlow Testing 测试模型实例

AI大模型自动化测试是确保模型质量、可靠性和性能的关键环节，以下将从测试流程、测试内容、测试工具及测试挑战与应对几个方面进行详细介绍： 测试流程 测试计划制定 确定测试目标：明确要测试的AI大模型的具体功能、性能、安全性等方面的目标，例如评估模型在特定任务上的准…...

编程日记 2025/9/9 14:22:11

QT——c++界面编程库

非界面编程 QT编译的时候&#xff0c;依赖于 .pro 配置文件&#xff1a; SOURCES: 所有需要参与编译的 .cpp 源文件 HEADERS:所有需要参与编译的.h 头文件 QT&#xff1a;所有需要参与编译的 QT函数库 .pro文件一旦修改&#xff0c;注意需要键盘按 ctrls 才能加载最新的配置文…...

编程日记 2025/9/4 1:03:53

postman--接口测试工具安装和使用教程

postman–接口测试工具 postman是一款支持http协议的接口调试与测试工具&#xff0c;其主要特点就是功能强大&#xff0c;使用简单且易用性好 。 无论是开发人员进行接口调试&#xff0c;还是测试人员做接口测试&#xff0c;postman都是我们的首选工具之一 。 下面先通过一张…...

编程日记 2025/9/10 6:34:27

如何用python画一棵分形树

这个代码会生成一个彩色的分形树图案&#xff0c;可以通过调整draw_tree函数中的参数来改变树的形状和大小 import turtle import random# 递归函数绘制分形树 def draw_tree(branch_len, t):if branch_len > 5:t.color(random.choice(colors))t.pensize(branch_len / 10)t…...

编程日记 2025/9/9 3:25:33

【leetcode】二分查找专题

文章目录 1.二分查找1.题目2.解题思路3. 解题代码 2.在排序数组中查找元素的第一个和最后一个位置1.题目2.算法原理3. 代码 3.x的平方根1.题目2.代码 4.搜索插入位置1.题目2.解题思路3.解题代码 5.山脉数组的索引1.题目2.解题思路3. 代码 6.寻找峰值1.题目2.解题思路3.代码 7. …...

编程日记 2025/9/10 6:46:01

深度学习笔记17-马铃薯病害识别（VGG-16复现）

目录 一、 前期准备 1. 设置GPU 2. 导入数据 二、手动搭建VGG-16模型 1. 搭建模型 三、 训练模型 1. 编写训练函数 3. 编写测试函数 4. 正式训练 四、 结果可视化 1. Loss与Accuracy图 2. 指定图片进行预测 3. 模型评估 前言 &#x1f368; 本文为&#x1f517;365天深度学习训…...

编程日记 2025/9/9 11:31:15

【LeetCode】131.分割回文串

目录 题目描述输入输出示例及数据范围思路C 实现 题目描述 这道题目来自 LeetCode 131. 分割回文串。 题目描述如下&#xff1a; 给你一个字符串 s&#xff0c;请你将 s 分割成一些子串&#xff0c;使每个子串都是 回文串 。返回 s 所有可能的分割方案。 输入输出示例及数据…...

编程日记 2025/9/11 1:00:17

【AIGC系列】5：视频生成模型数据处理和预训练流程介绍（Sora、MovieGen、HunyuanVideo）

AIGC系列博文&#xff1a; 【AIGC系列】1&#xff1a;自编码器&#xff08;AutoEncoder, AE&#xff09; 【AIGC系列】2&#xff1a;DALLE 2模型介绍&#xff08;内含扩散模型介绍&#xff09; 【AIGC系列】3&#xff1a;Stable Diffusion模型原理介绍 【AIGC系列】4&#xff1…...

编程日记 2025/9/7 18:26:44

基于C++“简单且有效”的“数据库连接池”

前言 数据库连接池在开发中应该是很常用的一个组件&#xff0c;他可以很好的节省连接数据库的时间开销&#xff1b;本文基使用C实现了一个简单的数据库连接池&#xff0c;代码量只有400行左右&#xff0c;但是压力测试效果很好&#xff1b;欢迎收藏 关注&#xff0c;本人将会…...

编程日记 2025/9/9 2:34:20

vulnhub靶场【kioptrix-4】靶机

前言 靶机&#xff1a;kioptrix-4&#xff0c;IP地址为192.168.1.75&#xff0c;后期IP地址为192.168.10.8 攻击&#xff1a;kali&#xff0c;IP地址为192.168.1.16&#xff0c;后期IP地址为192.168.10.6 都采用VMware虚拟机&#xff0c;网卡为桥接模式 这里的靶机&#xf…...

编程日记 2025/9/7 20:38:04

科普：ROC AUC与PR AUC

在评价二分类模型性能时&#xff0c;有许多评价指标&#xff0c;其中&#xff0c;有一对是用面积AUC&#xff08;Area Under the Curve&#xff09;做评价的&#xff1a;ROC AUC与PR AUC 本文我们对ROC AUC与PR AUC进行多维度对比分析&#xff1a; 一、定义与核心原理 维度RO…...

编程日记 2025/9/8 18:03:01

服务器IPMI用户名、密码批量检查

背景 大规模服务器部署的时候&#xff0c;少不了较多的网管和监测平台&#xff0c;这些平台会去监控服务器的性能、硬件等指标参数&#xff0c;为了便于管理和控制&#xff0c;则需要给服务器IPMI带外管理添加较多的用户&#xff0c;这就需要对较多的服务器检查所对应的IPMI用…...

编程日记 2025/9/11 0:31:53

51单片机中reg52.h与regx52.h在进行位操作时的不同

reg52.h中不能使用例如 P2_0;这样的定义 而只能使用 P2^0;这样的定义 但是都不可以对位进行直接赋值操作&#xff1b; 而 regx52.h中可以使用 P2_0和P2^0&#xff1b;但是只有使用下划线的才可以对位进行赋值操作 例如P2_0 1; 但不可以是P2^0 1; 在 C 语言中&#xff0c;…...

编程日记 2025/9/12 4:25:46

Apollo Cyber 学习笔记

目录 0 Introduction What Why Advantage 1 Example 2 Concept 3 Flow Chart 4 Module 4.1 Transport 4.1.1 Share Memory 4.1.1.1 Segment 4.1.1.1.1 State 4.1.1.1.2 Block 4.1.1.1.3 Common 4.1.1.2 Notifier 4.1.1.2.1 ConditionNotifier 4.1.1.2.2 Multi…...

编程日记 2025/9/8 9:38:10

【Electron入门】进程环境和隔离

目录 一、主进程和渲染进程 1、主进程&#xff08;main&#xff09; 2、渲染进程&#xff08;renderer&#xff09; 二、预加载脚本 三、沙盒化 为单个进程禁用沙盒 全局启用沙盒 四、环境访问权限控制&#xff1a;contextIsolation和nodeIntegration 1、contextIsola…...

编程日记 2025/8/26 11:54:01

拉链表介绍

拉链表 是处理 缓慢变化维&#xff08;SCD&#xff09; 的一种常用方法&#xff0c;特别适用于需要保留历史记录的场景。以下是拉链表的详细说明及实现方法&#xff1a; 1. 什么是拉链表&#xff1f; 拉链表是一种用于记录维度数据历史变化的表结构&#xff0c;通过 开始时间 …...

编程日记 2025/9/9 9:55:55

Spring Boot 日志配置与常见问题解析（详解）

目录 Spring Boot 日志配置与常见问题解析引言什么是日志&#xff1f;日志的重要性日志使用打印日志 日志框架介绍日志格式的说明⽇志级别日志级别的分类日志级别的使用 Spring Boot 日志配置1. 设置日志级别和格式2. 配置日志收集器3. 查看和分析日志4.日志的持久化5.设置日志…...

编程日记 2025/9/6 19:57:07

-bash: lsof: command not found

一、问题说明 执行如下命令时报错&#xff1a; # lsof |grep deleted > deleted_file -bash: lsof: command not found二、处理方法 # yum -y install lsof安装完成后可成功执行上面的命令。...

编程日记 2025/9/11 15:28:48

PC 端连接安卓手机恢复各类数据：安装、操作步骤与实用指南

软件介绍 这款用于恢复安卓手机数据的软件&#xff0c;虽运行在 PC 端&#xff0c;却专为安卓手机数据恢复打造&#xff0c;使用时得用数据线把手机和电脑连接起来。它的功能相当强大&#xff0c;能帮你找回安卓手机里已删除的短信、联系人、通话记录、文档&#xff0c;还有照…...

编程日记 2025/9/11 19:03:43

ES、OAS、ERP、电子政务、企业信息化（高软35）

系列文章目录 ES、OAS、ERP、电子政务、企业信息化 文章目录 系列文章目录前言一、专家系统&#xff08;ES&#xff09;二、办公自动化系统&#xff08;OAS&#xff09;三、企业资源规划&#xff08;ERP&#xff09;四、典型信息系统架构模型1.政府信息化和电子政务2.企业信息…...

编程日记 2025/9/3 8:52:15

android智能指针android::sp使用介绍

android::sp 是 Android 中的智能指针&#xff08;Smart Pointer&#xff09;的实现&#xff0c;用于管理对象的生命周期&#xff0c;避免手动管理内存泄漏等问题。它是 Android libutils 库中重要的一部分&#xff0c;常用于管理继承自 android::RefBase 的对象。 与标准库中…...

编程日记 2025/9/4 17:30:48

推荐一款最新开源，基于AI人工智能UI自动化测试工具！支持自然语言编写脚本！

随着互联网技术的飞速发展&#xff0c;Web应用越来越普及&#xff0c;前端页面也越来越复杂。为了确保产品质量&#xff0c;UI自动化测试成为了开发过程中不可或缺的一环。然而&#xff0c;传统的UI自动化测试工具往往存在学习成本高、维护困难等问题。特别是UI 自动化脚本里往…...

编程日记 2025/9/8 20:22:23

DeepSeek05-大模型WebUI

一、说明&#xff1a; 将DeepSeek部署到前台Web界面的方法主要有以下几种推荐方案&#xff0c;涵盖开源工具、第三方客户端及特定场景适配方案&#xff1a; Open WebUIChatbox AICherry StudioSillyTavern 二、Open WebUI 安装配置教程 特点&#xff1a;Open WebUI 是一个开…...

编程日记 2025/9/12 9:15:34

自然语言处理NLP入门 -- 第八节OpenAI GPT 在 NLP 任务中的应用

在前面的学习中&#xff0c;我们已经了解了如何使用一些经典的方法和模型来处理自然语言任务&#xff0c;如文本分类、命名实体识别等。但当我们需要更强的语言生成能力时&#xff0c;往往会求助于更先进的预训练语言模型。OpenAI 旗下的 GPT 系列模型&#xff08;如 GPT-3、GP…...

编程日记 2025/9/9 3:54:41

FFmpeg av_read_frame 和iOS系统提供的 AVAudioRecorder 实现音频录制的区别

1. 第一种方式：使用 FFmpeg 的 av_read_frame 特点 底层实现：基于 FFmpeg，这是一个强大的多媒体处理库，直接操作音频流。灵活性：非常灵活，可以处理多种音频格式、编解码器和输入设备。复杂性：需要手动管理音频流、数据包（AVPacket）、内存释放等，代码复杂度较高。跨平…...

编程日记 2025/9/11 6:58:40

【区块链】深入理解区块链中的 Gas 机制

&#x1f308;个人主页: 鑫宝Code &#x1f525;热门专栏: 闲话杂谈&#xff5c; 炫酷HTML | JavaScript基础 ​&#x1f4ab;个人格言: "如无必要&#xff0c;勿增实体" 文章目录 深入理解区块链中的 Gas 机制一、Gas 的基本概念1.1 为什么需要 Gas&#xff1f…...

编程日记 2025/9/10 21:07:48

2020 年英语（一）考研真题 笔记（更新中）

Section I Use of English&#xff08;完型填空&#xff09; 原题 Directions&#xff1a;Read the following text. Choose the best word (s) for each numbered blank and mark A, B, C or D on the ANSWER SHEET. (10 points) Even if families are less likely to si…...

编程日记 2025/9/10 9:51:12

mamba_ssm和causal-conv1d详细安装教程

1.前言 Mamba是近年来在深度学习领域出现的一种新型结构&#xff0c;特别是在处理长序列数据方面表现优异。在本文中&#xff0c;我将介绍如何在 Linux 系统上安装并配置 mamba_ssm 虚拟环境。由于官方指定mamba_ssm适用于 PyTorch 版本高于 1.12 且 CUDA 版本大于 11.6 的环境…...

编程日记 2025/9/11 1:25:41

leetcode-442.数组中重复的数据

leetcode-442.数组中重复的数据 文章目录 leetcode-442.数组中重复的数据1.题目描述&#xff1a;数组中重复的数据2.第一次代码提交&#xff1a;(不符合仅使用常量额外空间)3.最终代码提交&#xff1a;只使用常数额外空间、时间复杂度为 O(n) 的做法&#xff0c;即“标记法” 1…...

编程日记 2025/9/11 13:22:55

UniApp 按钮组件 open-type 属性详解：功能、场景与平台差异

文章目录 引言一、open-type 基础概念1.1 核心作用1.2 通用使用模板 二、主流 open-type 值详解2.1 contact - 客服会话功能说明平台支持代码示例 2.2 share - 内容转发功能说明平台支持注意事项 2.3 getUserInfo - 获取用户信息功能说明平台支持代码示例 2.4 getPhoneNumber -…...

编程日记 2025/9/10 1:41:21

Android13修改多媒体默认音量

干就完了! 设置音量为最大音量,修改如下: /framework/base/media/java/android/media/AudioSystem.java/** hide */public static int[] DEFAULT_STREAM_VOLUME new int[] {4, // STREAM_VOICE_CALL7, // STREAM_SYSTEM5, // STREAM_RING-5, // STREAM_MUSIC15, // STREAM…...

编程日记 2025/9/8 21:19:38

【银河麒麟高级服务器操作系统】服务器测试业务耗时问题分析及处理全流程分享

更多银河麒麟操作系统产品及技术讨论&#xff0c;欢迎加入银河麒麟操作系统官方论坛 https://forum.kylinos.cn 了解更多银河麒麟操作系统全新产品&#xff0c;请点击访问 麒麟软件产品专区&#xff1a;https://product.kylinos.cn 开发者专区&#xff1a;https://developer…...

编程日记 2025/8/26 11:52:01

HTTP 请求时传递多部分表单数据

HTTP 请求时传递多部分表单数据&#xff08;multipart/form-data&#xff09; --data-raw $------demo11111\r\nContent-Disposition: form-data; name"Filedata"; filename"截屏2025-02-27 15.45.46.png"\r\nContent-Type: image/png\r\n\r\n\r\n------d…...

编程日记 2025/9/8 12:44:13

【Python环境】配置极简描述

241220 241220 241220 Python环境配置 下载Python 稳定版本&#xff1a;Stable Releases【3.12.3】 下载地址&#xff1a;Python Releases for Windows | Python.org. 配环境 注意勾上Add Python 3.x to PATH&#xff0c;然后点“Install Now”即可完成安装。 配置完成&…...

编程日记 2025/9/4 17:57:34

1. HTTP 数据请求

相关资源&#xff1a; 图片素材&#x1f4ce;图片素材.zip 接口文档 1. HTTP 数据请求 什么是HTTP数据请求&#xff1a; (鸿蒙)应用软件可以通过(鸿蒙)系统内置的 http 模块 和 Axios&#xff0c;通过 HTTP 协议和服务器进行通讯 学习核心Http请求技术: Http模块 - 属于鸿…...

编程日记 2025/9/9 11:55:01

基于深度学习+NLP豆瓣电影数据爬虫可视化推荐系统

博主介绍&#xff1a;资深开发工程师&#xff0c;从事互联网行业多年&#xff0c;熟悉各种主流语言&#xff0c;精通java、python、php、爬虫、web开发&#xff0c;已经做了多年的设计程序开发&#xff0c;开发过上千套设计程序&#xff0c;没有什么华丽的语言&#xff0c;只有…...

编程日记 2025/9/9 19:07:35

Apache Spark中的依赖关系与任务调度机制解析

Apache Spark中的依赖关系与任务调度机制解析 在Spark的分布式计算框架中，RDD（弹性分布式数据集）的依赖关系是理解任务调度、性能优化及容错机制的关键。宽依赖（Wide Dependency）与窄依赖（Narrow Dependency）作为两种核心依赖类型，直接影响Stage划分、Shuffle操作及容…...

编程日记 2025/9/10 5:32:57

SEO炼金术（4）| Next.js SEO 全攻略

在上一篇文章 SEO炼金术&#xff08;3&#xff09;| 深入解析 SEO 关键要素 中&#xff0c;我们深入解析了 SEO 关键要素&#xff0c;包括 meta 标签、robots.txt、canonical、sitemap.xml 和 hreflang&#xff0c;并探讨了它们在搜索引擎优化&#xff08;SEO&#xff09;中的作…...

编程日记 2025/9/9 13:49:26

DeepSeek开源周，第五弹再次来袭，3FS

Fire-Flyer 文件系统&#xff08;3FS&#xff09;总结&#xff1a; 一、核心特点 3FS 是一个专为 AI 训练和推理工作负载设计的高性能分布式文件系统&#xff0c;利用现代 SSD 和 RDMA 网络&#xff0c;提供共享存储层&#xff0c;简化分布式应用开发。其主要特点包括&#xf…...

编程日记 2025/9/8 6:17:46

conda怎么迁移之前下载的环境包，把python从3.9升级到3.10

克隆旧环境&#xff08;保留旧环境作为备份&#xff09; conda create -n cloned_env --clone old_env 在克隆环境中直接升级 Python conda activate cloned_env conda install python3.10 升级 Python 后出现 所有包导入失败 的问题&#xff0c;通常是因为依赖包与新 Pyth…...

编程日记 2025/9/11 3:11:33

一周一个Unity小游戏2D反弹球游戏 - 移动的弹板（鼠标版）

前言 本文将实现控制弹板移动&#xff0c;通过Unity的New Input System&#xff0c;可以支持鼠标移动弹板跟随移动&#xff0c;触控点击跟随移动&#xff0c;并且当弹板移动到边界时&#xff0c;弹板不会移动超过边界之外。 创建移动相关的InputAction 项目模版创建的时候默认会…...

编程日记 2025/9/7 8:54:46