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

Vue 和 React 状态管理的性能优化策略对比

news 来源：原创 2025/6/29 0:42:58

在这里插入图片描述

一、Vue 状态管理优化策略

  1. 合理使用 Vuex 模块化
    将全局状态拆分为模块，按需加载，避免单一 Store 文件过大。通过命名空间隔离状态，减少状态冗余和无效更新。

    const moduleA = { namespaced: true, state: { /* ... */ } };
const store = new Vuex.Store({ modules: { a: moduleA } });

  2. 优化计算属性和侦听器
    • 使用 mapState 和 mapGetters 映射状态到计算属性，避免直接访问 $store.state。

    • 减少不必要的 watch 和 computed，复杂计算优先通过缓存或方法处理。

    • 对静态数据使用 Object.freeze() 冻结，避免 Vue 响应式追踪。

  3. 懒加载与按需加载
    • 使用动态 import() 分割代码，结合 Vue Router 的懒加载减少初始资源体积。

    • 异步组件按需加载，例如结合 Suspense（Vue 3）或 webpack 的代码分割。

  4. 虚拟列表与渲染优化
    • 对长列表使用虚拟滚动（如 vue-virtual-scroller），仅渲染可见区域元素。

    • 合理选择 v-if 和 v-show：频繁切换用 v-show，条件稳定用 v-if。

  5. 减少响应式依赖
    • 避免大规模数据直接绑定到 Vue 实例，采用分页或懒加载策略。

    • 使用 vue-immutable 库管理不可变数据，减少深层嵌套对象的响应式开销。

二、React 状态管理优化策略

  1. 选择合适的状态管理方案
    • 小型应用优先使用 useState 或 useReducer，避免引入 Redux 的额外开销。

    • 复杂场景使用 Redux（通过 @reduxjs/toolkit 简化）或 Recoil，结合选择器（reselect）优化状态派生。

  2. 不可变数据与渲染控制
    • 使用不可变数据结构（如 immer 库），避免直接修改状态对象。

    • 通过 React.memo 缓存组件，或类组件的 shouldComponentUpdate 避免无效渲染。

    • 利用 useMemo 和 useCallback 缓存计算值和函数，减少子组件更新。

  3. 代码分割与懒加载
    • 使用 React.lazy 和 Suspense 动态加载组件，结合 Webpack 分割代码。

    • 路由级懒加载减少首屏资源体积。

  4. 虚拟化与并发模式
    • 长列表采用虚拟滚动（如 react-window）减少 DOM 节点数量。

    • 启用 React 18+ 的并发模式（Concurrent Mode），优化渲染优先级和中断逻辑。

  5. 性能分析与工具
    • 使用 React DevTools 的 Profiler 检测渲染耗时，定位瓶颈组件。

    • 结合 why-did-you-render 库追踪不必要的状态更新。

对比总结

优化方向VueReact
状态管理工具Vuex 模块化、响应式冻结Redux/Recoil、不可变数据
渲染控制v-if/v-show、虚拟滚动React.memo、并发模式
代码加载动态导入、路由懒加载React.lazy、Webpack 分割
性能分析工具Vue DevToolsReact Profiler、why-did-you-render

通用优化建议
• 减少不必要的状态传递：通过状态提升或全局管理避免深层次组件通信。

• 批量更新：Vue 的异步更新队列和 React 的 unstable_batchedUpdates 可合并多次状态变更。

• 服务端渲染（SSR）：Vue 的 Nuxt.js 和 React 的 Next.js 提升首屏加载速度。

通过以上策略，可显著提升两大框架的状态管理性能。具体实施时需结合项目规模选择工具，并通过性能工具持续监控优化效果。

Vue 和 React 在状态管理的性能优化上各有侧重，以下是对两者策略的对比分析：

Vue 状态管理的性能优化策略

1. 响应式系统优化

  • 浅层响应式处理：使用 shallowRef() 和 shallowReactive() 创建浅层响应式对象，减少深层属性的追踪开销，适用于大型嵌套数据结构。
  • 计算属性稳定性：Vue 3.4+ 中，计算属性仅在值变化时才触发副作用，避免不必要的更新。 (Vue.js 中文网)

2. 状态管理工具优化（Vuex / Pinia）

  • 模块化管理：将状态划分为模块，减少全局状态变更对组件的影响。
  • 避免频繁写入持久化存储：如使用 vuex-persistedstate 时，避免每次状态变更都写入 localStorage，可采用节流或合并写入策略。 (CSDN博客, 腾讯云)

3. 渲染性能优化

  • 虚拟列表渲染：使用 vue-virtual-scroller 等库，仅渲染可视区域的列表项，提升长列表的渲染性能。
  • 静态内容优化：使用 v-once 指令渲染静态内容，避免不必要的重新渲染。 (Vue.js 中文网, CSDN博客)

React 状态管理的性能优化策略

1. 状态更新优化

  • 避免不必要的渲染：使用 React.memo、useMemo 和 useCallback 缓存组件和函数，减少因状态变化导致的重新渲染。
  • 选择性状态更新：将状态提升到最近的公共祖先组件，避免全局状态变更影响所有子组件。

2. Redux 优化

  • 使用 reselect 创建记忆化选择器：避免因状态变化导致的重复计算，提高性能。
  • 异步操作管理：使用 redux-thunk 或 redux-saga 管理异步操作，避免阻塞 UI 渲染。 (开源中国)

3. 代码分割与懒加载

  • 组件懒加载：使用 React.lazy 和 Suspense 实现组件的按需加载，减少初始加载时间。
  • 路由懒加载：结合 React Router 实现路由级别的代码分割，提升应用性能。(CSDN博客)

对比总结

方面Vue 优化策略React 优化策略
响应式系统使用浅层响应式、计算属性稳定性优化使用 useMemo、useCallback 缓存计算和函数
状态管理工具模块化管理、避免频繁写入持久化存储使用 reselect 创建记忆化选择器、管理异步操作
渲染性能虚拟列表渲染、静态内容优化使用 React.memo、组件懒加载
代码分割与懒加载路由懒加载、组件懒加载使用 React.lazy、Suspense 实现组件和路由懒加载(CSDN博客, Vue.js 中文网, 腾讯云, 开源中国, CSDN博客)

Vue 和 React 在状态管理的性能优化上各有优势，开发者应根据项目需求选择合适的策略。

Vue 和 React 的状态管理库在演变过程中不断优化性能，以适应现代应用的需求。以下是 Vue 的 Vuex 与 Pinia，以及 React 的 Redux 与 Zustand 的演变历程和性能优化策略的详细对比：

Vue 状态管理：Vuex 与 Pinia

Vuex（2016 年发布）

  • 架构特点：采用集中式存储，使用 state、mutations、actions 和 getters 管理状态，强调不可变性和同步更新。

  • 性能优化：

    • 模块化管理：通过模块划分状态，减少全局状态变更对组件的影响。
    • 动态模块注册：根据路由或功能按需加载模块，降低初始加载压力。
    • Vue Devtools 支持：提供时间旅行调试和状态快照功能，便于性能分析。

Pinia（Vue 3 官方推荐）

  • 架构特点：基于 Vue 3 的 Composition API，使用 defineStore 创建模块，支持直接修改状态，无需 mutations。

  • 性能优化：

    • 轻量级：体积约为 1KB，初始化和状态更新速度快。
    • Tree Shaking 支持：未使用的代码在打包时被移除，减小包体积。
    • SSR 和 Hydration 支持：优化服务端渲染性能。
    • 更好的 TypeScript 支持：自动类型推导，减少类型错误。(Rish’s Repository, LogRocket Blog)

React 状态管理：Redux 与 Zustand

Redux（2015 年发布）

  • 架构特点：采用单一状态树，使用 reducers、actions 和 dispatch 管理状态，强调不可变性和可预测性。

  • 性能优化：

    • 中间件支持：如 redux-thunk 和 redux-saga，处理异步操作，优化性能。
    • 选择器（Selectors）：使用 reselect 创建记忆化选择器，避免不必要的计算。
    • Redux DevTools：提供强大的调试工具，支持时间旅行和状态快照。(Medium)

Zustand（轻量级状态管理库）

  • 架构特点：基于 hooks 的状态管理，使用 create 创建 store，支持直接修改状态。

  • 性能优化：

    • 选择性订阅：组件仅在使用的状态片段变化时重新渲染，减少不必要的更新。
    • 轻量级：体积小，初始化和状态更新速度快。
    • React Concurrent Mode 兼容：适应 React 的并发模式，提升性能。
    • 中间件支持：如日志记录和持久化，增强功能。(Medium, peerdh.com)

性能对比总结

特性VuexPiniaReduxZustand
体积较大轻量（约1KB）较大轻量
初始化速度较慢快较慢快
状态更新速度中等快中等快
模块化支持支持支持支持支持
TypeScript 支持一般优秀优秀优秀
DevTools 支持完善较完善完善支持（需配置）(LogRocket Blog, peerdh.com, Rish’s Repository)

根据项目需求选择合适的状态管理库：(DEV Community)

  • Vue 项目：

    • 小型项目：推荐使用 Pinia，轻量且易于上手。
    • 大型项目：如果已有 Vuex 代码基础，可继续使用 Vuex；新项目建议使用 Pinia，以获得更好的性能和开发体验。(DEV Community)

  • React 项目：

    • 小型项目：推荐使用 Zustand，简洁高效。
    • 大型项目：Redux 提供丰富的生态和工具，适合复杂的状态管理需求。

如需进一步的代码示例或迁移指南，请告知具体需求。

相关文章：

Vue 和 React 状态管理的性能优化策略对比

一、Vue 状态管理优化策略 合理使用 Vuex 模块化 将全局状态拆分为模块，按需加载，避免单一 Store 文件过大。通过命名空间隔离状态，减少状态冗余和无效更新。 const moduleA { namespaced: true, state: { /* ... */ } }; const store new …...

编程日记 2025/6/29 0:42:58

python打包exe报错：处理文件时错误：Excel xlsx file； not supported

背景：最近用python写一个excel解析工具，然后打包成exe可执行文件的时候，遇到这样的问题 1.在我自己编译器运行是可以正常将上传后的excel进行解析，但是在打包成exe后，就无法正常解析excel 问题排查： 1.切换…...

编程日记 2025/6/28 17:33:38

libmemcached库api接口讲解一

前言：好多接口的用法都不怎么会，得学习一下具体的用法 memcached_st ✅ 一个连接 memcached 服务集群的“客户端实例”对象，用于管理连接、执行读写操作、设置行为、维护哈希环等一切功能。 它在使用中通常通过下面的方式创建： …...

编程日记 2025/6/28 22:54:03

【RabbitMQ】发布确认机制的具体实现

文章目录 模式介绍建立连接单独确认代码实现逻辑运行结果 批量确认代码实现逻辑运行结果 异步确认实现逻辑介绍代码实现逻辑运行结果 三种策略对比以及完整代码 模式介绍 作为消息中间件，都会面临消息丢失的问题，消息丢失大概分为三种情况： …...

编程日记 2025/6/29 0:58:07

RabbitMQ是什么？应用场景有哪些？

RabbitMQ 是一款开源的消息代理中间件，基于 AMQP（高级消息队列协议）实现，用于在分布式系统中进行异步通信和消息传递。它通过将消息的发送者和接收者解耦，提高了系统的可扩展性、可靠性和灵活性。 核心特点 多协议支持：不仅支持 AMQP，还兼容 STOMP、MQTT 等多种消息协议…...

编程日记 2025/6/28 22:54:11

数学实验（Matlab符号运算）

一、符号对象的建立 Matlab符号运算特点 计算以推理方式进行，因此不受计算误差积累所带来的困扰 符号计算指令的调用比较简单，与数学教科书上的公式相近 Matlab符号运算举例 符号对象与符号表达式 在进行符号运算时，必须先定义基本的符号…...

编程日记 2025/6/29 0:49:23

使用 hover-class 实现触摸态效果 - uni-app 教程

目录 一、什么是 hover-class 二、常用组件支持 hover-class 三、基本 效果说明： 四、配合 hover-start-time 和 hover-stay-time 五、注意事项 六、实践建议 在移动端开发中，良好的用户交互体验尤为重要，点击或长按某个按钮时&#x…...

编程日记 2025/6/28 23:27:28

# 深度剖析LLM的“大脑”：单层Transformer的思考模式探索

简单说一下哈 —— 咱们打算训练一个单层 Transformer 加上稀疏自编码器的小型百万参数大型语言模型（LLM），然后去调试它的思考过程，看看这个 LLM 的思考和人类思考到底有多像。 LLMs 是怎么思考的呢？ 开源 LLM 出现之后…...

编程日记 2025/6/28 22:53:35

Git仓库迁移

前言 前面我讲了GitLab搭建与使用(SSH和Docker)两种方式，那么就会延伸出来一个情况：Git仓库迁移虽然这种情况很少发生，但是我自己公司近期要把 阿里云迁移到华为云，那么放在上面的Git仓库也要全量迁移下面我就写了一个脚本演示&am…...

编程日记 2025/6/28 22:55:01

Windows避坑部署CosyVoice多语言大语言模型

#工作记录 前言 在实际部署与应用过程中，项目的运行环境适配性对其稳定性与功能性的发挥至关重要。CosyVoice 项目虽具备强大的语音处理能力，但受限于开发与测试环境的侧重方向，其对运行环境存在特定要求。 该项目在 Linux 和 Docker 生态…...

编程日记 2025/6/28 22:53:32

《实现模式》以Golang视角解读 价值观和原则 day 1

为什么阅读实现模式？ 为什么阅读《实现模式》？Kent Beck 的《实现模式》其核心思想——编写清晰、易于理解且易于维护的代码，对于软件工程的新手而言，直接深入复杂的设计模式或架构理念可能会感到困惑。《实现模式》则弥合了设计…...

编程日记 2025/6/29 0:20:49

解决 PicGo 上传 GitHub图床及Marp中Github图片编译常见难题指南

[目录] 0.行文概述 1.PicGo图片上传失败 2.*关于在Vscode中Marp图片的编译问题* 3.总结与启示行文概述 写作本文的动机是本人看到了Awesome Marp，发现使用 Markdown \texttt{Markdown} Markdown做PPT若加持一些 CSS , JavaScript \texttt{CSS},\texttt{JavaScript} …...

编程日记 2025/6/28 22:53:31

LeetCode 820 单词的压缩编码题解

LeetCode 820 单词的压缩编码题解 题目描述 题目链接 给定一个单词列表，将其编码为一个索引字符串S，格式为"单词1#单词2#…"。要求当某个单词是另一个单词的后缀时，该单词可以被省略。求最终编码字符串的最小长度。 解题思路 逆…...

编程日记 2025/6/28 22:53:39

Windows软件插件-写wav

下载本插件 本插件，将PCM音频流写入WAV音频文件。或将PCM音频流压缩为ALAW格式，写入WAV文件。可以创作大文件（超过4字节所能表示的大小）。插件类型为DLL，可以在win32和MFC程序中使用。使用本插件创建的ALAW格式WAV音频…...

编程日记 2025/6/28 22:53:40

基于 Spring Boot 瑞吉外卖系统开发（十五）

基于 Spring Boot 瑞吉外卖系统开发（十五） 前台用户登录 在登录页面输入验证码，单击“登录”按钮，页面会携带输入的手机号和验证码向“/user/login”发起请求。 定义UserMapper接口 Mapper public interface UserMapper exte…...

编程日记 2025/6/28 23:13:39

【Linux高级IO】多路转接之epoll

多路复用之epoll 一，认识epoll二，epoll的相关接口1. epoll_create2. epoll_ctl3. epoll_wait 三，epoll的原理四，epoll的两种工作模式（ET和LT）1. 两种工作模式2. 对比ET和LT 五，总结 在了解到sel…...

编程日记 2025/6/28 19:42:19

Java 性能调优全解析：从设计模式到 JVM 的 7 大核心方向实践

引言 在高并发、低延迟的技术场景中，Java 性能优化需要系统化的方法论支撑。本文基于7 大核心优化方向（复用优化、计算优化、结果集优化、资源冲突优化、算法优化、高效实现、JVM 优化），结合权威框架与真实案例，构建从…...

编程日记 2025/6/29 0:52:34

“海外滴滴”Uber的Arm迁移实录：重构大规模基础设施​

云工作负载在性价比上的自然演进路径： Intel ➜ AMD ➜ ARM 不信？来看看 Uber 的做法： 01/Arm架构：云计算新时代 2023 年 2 月，Uber 正式开启了一项战略性迁移：将从本地数据中心迁移至云端，…...

编程日记 2025/6/28 9:31:45

java加强 -File

File类的对象可以代表文件/文件夹，并可以调用其提供的方法对象文件进行操作。 File对象既可以代表文件，也可以代表文件夹。 创建File对象，获取某个文件的信息 语法： File 对象名 new File("需要访问文件的绝对路径&…...

编程日记 2025/6/28 23:38:58

SQL注入 ---04

1 简单的sql注入 要求： 要有sql注入： 1，变量 2，变量要带入数据库进行查询 3，没有对变量进行过滤或者过滤不严谨 mysql> select * from users where id2 limit 0,1; 当我的语句这样写时查寻到的结果 当我修改为&…...

编程日记 2025/6/28 22:53:43

MySQL知识点总结（持续更新）

聚合函数通常用于对数据进行统计和聚合操作。以下是一些常见数据库系统（如 MySQL、PostgreSQL、Oracle、SQL Server 等）中常用的聚合函数： 常见的数据库聚合函数： COUNT()：计算指定列中非空值的数量 SELECT COUNT(*) …...

编程日记 2025/6/29 0:01:41

数字信号处理-大实验1.1

MATLAB仿真实验目录 验证实验：常见离散信号产生和实现验证实验：离散系统的时域分析应用实验：语音信号的基音周期（频率）测定 目录 一、常见离散信号产生和实现 1.1 实验目的 1.2 实验要求与内容 1.3 实验…...

编程日记 2025/6/28 22:53:33

Qt操作SQLite数据库教程

Qt 中操作 SQLite 数据库的步骤如下&#xff1a; 1. 添加 SQLite 驱动并打开数据库 #include <QSqlDatabase> #include <QSqlError> #include <QSqlQuery>// 创建数据库连接 QSqlDatabase db QSqlDatabase::addDatabase("QSQLITE"); db.setData…...

编程日记 2025/6/29 0:22:04

【PSINS工具箱】基于工具箱的单独GNSS导航、单独INS导航、两者结合组合导航，三种导航的对比程序。附完整的代码

本文给出基于PSINS工具箱的单独GNSS导航、单独INS导航、两者结合组合导航（153EKF）的程序。并提供三者的轨迹对比、误差对比。 文章目录 运行结果MATLAB代码代码的简单介绍简介2. 平均绝对误差 (MAE)主要模块运行结果 三轴轨迹图： 各轴误差曲线： 命令行窗口的结果输出： …...

编程日记 2025/6/28 22:55:00

开发者的测试复盘：架构分层测试策略与工具链闭环设计实战

摘要‌ 针对测试复盘流于形式、覆盖率虚高等行业痛点&#xff0c;本文提出一套结合架构分层与工具链闭环的解决方案&#xff1a; ‌分层测试策略精准化‌&#xff1a;通过单元测试精准狙击核心逻辑、契约测试驱动接口稳定性、黄金链路固化端到端场景&#xff0c;实现缺陷拦截率…...

编程日记 2025/6/29 0:02:32

手写CString类

学习和理解字符串处理机制&#xff1a;手写 CString 类是深入学习字符串处理和内存管理的有效方式。通过实现构造函数、析构函数、赋值运算符等&#xff0c;能够理解字符串在内存中的存储方式、动态内存分配和释放的原理&#xff0c;以及如何处理字符串的复制、拼接、查找等操作…...

编程日记 2025/6/29 8:49:46

electron结合vue，直接访问静态文件如何跳转访问路径

在最外的app.vue或者index.vue的js模块编写 let refdade ref(1);//刷新&#xff0c;获得请求// 获取完整的查询字符串&#xff08;例如: "?dade/myms"&#xff09;const searchParams new URLSearchParams(window.location.search);// 获取 dade 参数的值&#xf…...

编程日记 2025/6/28 22:53:34

解读RTOS 第七篇 · 驱动框架与中间件集成

1. 引言 在面向生产环境的 RTOS 系统中，硬件驱动框架与中间件层是连接底层外设与上层应用的桥梁。一个模块化、可扩展的驱动框架能够简化外设管理，提升代码可维护性；而丰富的中间件生态则为网络通信、文件系统、图形界面、安全加密等功能提供开箱即用的支持。本章将从驱动模…...

编程日记 2025/6/29 0:04:39

Java GUI开发全攻略：Swing、JavaFX与AWT

Swing 界面开发 Swing 是 Java 中用于创建图形用户界面&#xff08;GUI&#xff09;的库。它提供了丰富的组件&#xff0c;如按钮、文本框、标签等。 import javax.swing.*; import java.awt.event.ActionEvent; import java.awt.event.ActionListener;public class SwingExa…...

编程日记 2025/6/29 0:52:31

Cursor 0.5版本发布，新功能介绍

Cursor，这款流行的AI编程平台，刚刚在其v0.50更新中推出了一系列新功能。 首先，请将您的Cursor IDE更新到最新版本。当您打开Cursor时，您应该会在屏幕左下方收到关于最新版本发布的通知。 更多上下文控制： 对上下文的精细可见性，以及最新模型的MAX模式。 聊天升级： 导出…...

编程日记 2025/6/28 23:49:36

Android学习总结之Glide自定义三级缓存（实战篇）

一、为什么需要三级缓存 内存缓存&#xff08;Memory Cache&#xff09; 内存缓存旨在快速显示刚浏览过的图片&#xff0c;例如在滑动列表时来回切换的图片。在 Glide 中&#xff0c;内存缓存使用 LruCache 算法&#xff08;最近最少使用&#xff09;&#xff0c;能自动清理长…...

编程日记 2025/6/29 1:00:56

Maven 下载安装与配置教程

## 1. Maven 简介 Maven 是一个项目管理和构建自动化工具&#xff0c;主要用于 Java 项目。Maven 可以帮助开发者管理项目的构建、报告和文档&#xff0c;简化项目依赖管理。 ## 2. 下载 Maven 1. 访问 Maven 官方网站 [https://maven.apache.org/download.cgi](https://maven.…...

编程日记 2025/6/28 23:37:07

一篇解决Redis：持久化机制

目录 认识持久化 持久化方案 RDB&#xff08;Redis DataBase&#xff09; 手动触发 自动触发 小结 AOF(Append-Only File) AOF缓冲区刷新机制 AOF重写机制 AOF重写流程 ​编辑 混合持久化 认识持久化 我们都知道Mysql有四大特征&#xff0c;原子性&#xff0c;持久…...

编程日记 2025/6/29 0:28:04

使用IDEA创建Maven版本的web项目以及lombok的使用

1.新建项目 2.修改pom.xml 3.修改项目结构 4.在main/java下面写一个Servlet测试一下 然后当前页面往下滑 -Dfile.encodingUTF-8编写一句输出语句&#xff0c;测试是否成功部署配置&#xff0c;并选择到正确的位置&#xff1a; 回车以后 再回到idea里面&#xff0c;发现控…...

编程日记 2025/6/29 0:12:11

2025年AI开发者在开发者占比？

AI开发者在全球开发者中的占比目前没有一个统一且精确的数值&#xff0c;但根据行业报告和调研数据&#xff0c;可以给出以下大致的范围和趋势分析&#xff1a; 1. 综合估算范围 全球范围&#xff1a;AI/ML&#xff08;机器学习&#xff09;开发者约占开发者总数的 5%-15%&…...

编程日记 2025/6/29 0:11:31

SpringBoot整合MQTT实战：基于EMQX构建高可靠物联网通信，从零到一实现设备云端双向对话

一、引言 随着物联网(IoT)技术的快速发展&#xff0c;MQTT(Message Queuing Telemetry Transport)协议因其轻量级、低功耗和高效的特点&#xff0c;已成为物联网设备通信的事实标准。本文将详细介绍如何使用SpringBoot框架整合MQTT协议&#xff0c;基于开源MQTT代理EMQX实现设…...

编程日记 2025/6/28 3:04:06

Windows更新暂停七天关键注册表

环境&#xff1a;windows10 工具&#xff1a;procmon 下载地址&#xff1a;https://learn.microsoft.com/zh-cn/sysinternals/downloads/procmon 监控截图&#xff1a; 界面截图&#xff1a; 注&#xff1a; 1.北京时间差8小时 2.至少是从第二天恢复&#xff0c;即至少暂停…...

编程日记 2025/6/29 1:30:21

小白学习java第18天（上）：spring

Spring &#xff1a;是一个轻量级&#xff08;一个小依赖就可以实现还不是轻量级&#xff09;的控制反转&#xff08;IOC&#xff09;和面向切面编程&#xff08;AOP&#xff09;的框架&#xff01; 优点&#xff1a; 1.Spring 是一个开源免费的框架&#xff08;容器&#xf…...

编程日记 2025/6/28 23:14:40

用Array.from实现创建一个1-100的数组

一、代码实现 let arr Array.from({length: 100}, (_, i) > i 1); 二、代码分析 1、Array.from(arrayLike, mapFn) &#xff08;1&#xff09;arrayLike 类数组对象&#xff08;如 { length: 100 }&#xff09;本身没有索引属性&#xff08;如 0: undefined, 1: undefi…...

编程日记 2025/6/28 13:15:46

什么是物联网 IoT 平台？

目录 物联网IoT平台的定义 物联网 IoT 平台发展历程 物联网IoT平台数据的特征 物联网IoT平台的处理流程 专为物联网 IoT 平台处理而生的时序数据库 物联网 IoT 平台时序数据处理面临的挑战及解决方案 收益与价值 物联网 IoT 平台企业案例 至数摇光 x TDengine 华自科技…...

编程日记 2025/6/29 0:50:41

PostgREST：无需后端 快速构建RESTful API服务

在现代 Web 开发中&#xff0c;API 已成为连接前后端的核心桥梁&#xff0c;传统的做法是通过后端框架来构建API接口&#xff0c;然后由前后端人员进行联调。 PostgREST是基于无服务器的一种实现方案&#xff0c;允许开发者将PostgreSQL数据库直接暴露为RESTful API&#xff0…...

编程日记 2025/6/29 1:14:18

3天北京旅游规划

北京 第一天应该集中在故宫和市中心区域&#xff0c;比如天安门、人民广场。这样可以体验到北京的历史和政治文化。午餐推荐烤鸭&#xff0c;因为这可是北京的特色。下午可以安排南锣鼓巷&#xff0c;既有古色古香的胡同&#xff0c;又有丰富的美食选择。 第二天的话&#xff0…...

编程日记 2025/6/29 1:23:24

MySQL--day1--数据库概述

&#xff08;以下内容全部来自上述课程&#xff09; 概述 1. 为什么要用数据库 持久化&#xff1a;内存中的数据断电之后就不存在了&#xff0c;所以需要持久化–>需要相关介质。 其中的一个介质就是数据库&#xff1a;存储数据量大、存储数据类型多 2. 数据库与数据库…...

编程日记 2025/6/28 22:54:01

[思维模式-38]：看透事物的关系：什么是事物的关系？事物之间的关系的种类？什么是因果关系？如何通过数学的方式表达因果关系？

一、什么是事物的关系&#xff1f; 事物的关系是指不同事物之间存在的各种联系和相互作用&#xff0c;它反映了事物之间的相互依存、相互影响、相互制约等特性。以下从不同维度为你详细阐述&#xff1a; 1、关系的类型 因果关系 定义&#xff1a;一个事件&#xff08;原因&a…...

编程日记 2025/6/28 22:54:00

图像识别与 OCR 应用实践

图像识别是一种让计算机具备“看”与“理解”图像能力的人工智能技术&#xff0c;其目标是从图像或视频中提取有意义的信息&#xff0c;如物体、人物、场景或文字。在现实生活中&#xff0c;这项技术被广泛应用于面部识别、自动驾驶、安防监控、医疗诊断、图像搜索等多个领域。…...

编程日记 2025/6/28 22:54:02

深入理解卷积神经网络：从基础原理到实战应用

在人工智能领域&#xff0c;卷积神经网络&#xff08;Convolutional Neural Network&#xff0c;简称 CNN&#xff09;凭借其强大的图像识别、处理能力&#xff0c;成为深度学习中不可或缺的技术。无论是自动驾驶汽车识别道路标志&#xff0c;还是医学影像分析辅助疾病诊断&…...

编程日记 2025/6/28 9:45:14

51单片机——交通指示灯控制器设计

设计目标 1、设计一交通灯控制&#xff0c;控制东西方向的红、黄、绿灯和南北方向的红、黄、绿灯。 2、可手动控制和自动控制&#xff0c;设置两个输入控制开关。 手动/自动开关&#xff0c;通过P11的按键输入控制 3、手动&#xff1a;设置开关P11&#xff0c;两种情况&#x…...

编程日记 2025/6/29 0:18:34

vue2 头像上传+裁剪组件封装

背景&#xff1a;最近在进行公司业务开发时&#xff0c;遇到了头像上传限制尺寸的需求&#xff0c;即限制为一寸证件照&#xff08;宽295像素&#xff0c;高413像素&#xff09;。 用到的第三方库&#xff1a; "vue-cropper": "^0.5.5" 完整组件代码&…...

编程日记 2025/6/28 23:39:13

面向对象设计模式之代理模式详解

文章目录 面向对象设计模式之代理模式详解面向对象思想&#xff1a;现代软件开发的基石代理模式&#xff1a;巧妙的中间层设计JavaScript 语法点与代理模式的结合JavaScript 实现代理模式示例代理模式的应用场景 面向对象设计模式之代理模式详解 在现代软件开发的浩瀚领域中&a…...

编程日记 2025/6/28 23:55:52

Leetcode209做题笔记

力扣209 题目分析&#xff1a;想象一个窗口遍历着这个数组&#xff0c;不断扩大右边界&#xff0c;让r。往窗口中添加数字&#xff1a; 此时我们找到了这个窗口&#xff0c;它的和满足了大于等于target的条件&#xff0c;题目让我求最短的&#xff0c;那么我们就尝试来缩短它&…...

编程日记 2025/6/28 7:14:23