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

【前端】【业务逻辑】 数据大屏自适应方案汇总

news 来源：原创 2025/7/18 3:47:34

前端数据大屏自适应设计方案全解析

在前端数据大屏的开发中，自适应设计是关键环节，它能确保大屏在不同设备和屏幕尺寸上都能呈现出良好的视觉效果和交互体验。除了常见的 transform: scale、rem/vw、Flex/Grid 等方案外，还有其他有效的方法可以实现自适应。下面为您详细介绍这些方案及其优缺点，以便您根据项目需求做出合适的选择。

一、多种自适应方案详解

（一）transform: scale 整体缩放方案

此方案的原理是先按照特定的设计稿尺寸（如 1920×1080）完成页面容器的开发，在运行时通过 transform: scale() 对整个页面进行缩放操作，从而使其适配不同的屏幕尺寸。

优点：

  1. 实现过程简单快捷，能够迅速适配各种分辨率的屏幕，大大缩短开发周期。
  2. 无需对原有的页面布局和样式进行大规模修改，减少了开发工作量。

缺点：

  1. 缩放后，页面元素可能会出现模糊的情况，影响整体的视觉质量和用户体验。
  2. 鼠标事件的坐标与实际视觉位置不一致，容易导致点击偏移问题，影响交互的准确性。
  3. 在某些浏览器中，频繁的缩放操作可能会引发性能问题，导致页面卡顿。

适用场景：适用于快速开发的展示型大屏项目，这类项目对交互的要求相对较低，更注重快速呈现内容。

（二）rem / vw / vh 动态单位方案

该方案运用相对单位（如 rem、vw、vh）进行页面布局，并借助 JavaScript 动态地设置根元素的字体大小，以此实现页面元素随着屏幕尺寸的变化而自适应调整。

优点：

  1. 元素的尺寸能够灵活地跟随屏幕尺寸的变化而变化，适配能力强，可适应不同设备的屏幕。
  2. 字体、间距等元素能够实现等比例缩放，保证了页面在不同尺寸下的视觉一致性。

缺点：

  1. 开发过程中需要统一使用相对单位，增加了开发的复杂性，对开发人员的要求较高。
  2. 对于图表等组件，需要手动监听窗口的变化，并调用 resize() 方法来进行适配，增加了开发和维护的工作量。

适用场景：适用于需要兼容多种屏幕尺寸和设备的项目，如响应式网站或管理后台，这类项目对页面的适配性和一致性要求较高。

（三）Flex / Grid 真正响应式布局方案

利用 CSS 的 Flexbox 或 Grid 布局特性，根据屏幕尺寸的变化自动调整页面元素的排列方式，实现真正意义上的响应式设计。

优点：

  1. 布局方式非常灵活，能够适应各种复杂的页面结构和屏幕尺寸，满足多样化的设计需求。
  2. 无需依赖 JavaScript，仅通过纯 CSS 即可实现响应式效果，减少了代码的复杂性和维护成本。

缺点：

  1. 对设计和开发人员的要求较高，需要充分考虑多种布局情况，以确保页面在不同尺寸下的显示效果。
  2. 在极端的屏幕尺寸下，可能需要结合媒体查询进行进一步的优化，以达到更好的显示效果。

适用场景：适用于对响应式设计要求较高的项目，如门户网站、内容管理系统等，这类项目需要在不同设备上都能提供良好的用户体验。

（四）媒体查询（Media Query）方案

通过 CSS 的媒体查询功能，根据不同的屏幕尺寸应用不同的样式，从而实现页面的自适应调整。

优点：

  1. 能够实现精细的控制，可以针对特定的分辨率进行优化，使页面在不同设备上都能呈现出最佳的效果。
  2. 可以与其他布局方案结合使用，进一步提升页面的适配能力，满足复杂的设计需求。

缺点：

  1. 需要为每种屏幕尺寸编写对应的样式，增加了样式表的维护成本，尤其是在屏幕尺寸多样化的情况下。
  2. 过多的媒体查询可能导致样式冗余，增加页面的加载时间和代码的复杂性。

适用场景：适用于需要针对特定设备或分辨率进行优化的项目，如专门为移动端或特定型号设备设计的页面。

（五）zoom 缩放方案

使用 CSS 的 zoom 属性对页面进行缩放操作，从而实现自适应效果。

优点：

  1. 实现方法简单，且兼容性较好，能够在大多数主流浏览器中正常工作。
  2. 缩放后元素依然保持清晰，不会出现模糊的问题，保证了页面的视觉质量。

缺点：

  1. zoom 是非标准属性，部分较老或特殊的浏览器可能不支持，存在一定的兼容性风险。
  2. 由于其非标准性，不建议在生产环境中大量使用，可能会引发一些难以预料的兼容性问题。

适用场景：适用于对兼容性要求不高的内部项目或快速原型开发，这类项目更注重快速实现功能，对兼容性的要求相对较低。

二、鼠标事件偏移问题及解决策略

在使用 transform: scale 进行页面缩放时，常常会遇到鼠标事件坐标与视觉位置不一致的问题，这会导致点击、拖拽等交互操作出现偏差，影响用户体验。

问题原因：transform: scale 仅仅改变了元素的视觉呈现，但其实际的坐标系并未随之改变，从而导致鼠标事件的坐标无法与视觉位置同步。

解决方案：

  1. 手动调整事件坐标：在事件处理函数中，手动计算缩放比例，并据此调整事件坐标。示例代码如下：
const scale = 0.8; // 假设缩放比例为0.8
element.addEventListener('click', (e) => {const adjustedX = e.clientX / scale;const adjustedY = e.clientY / scale;// 使用 adjustedX 和 adjustedY 进行后续处理
});
  1. 设置 transform-origin：将缩放的原点设置为 left top，可以有效减少偏移问题。CSS 代码如下：
.container {transform-origin: left top;
}
  1. 使用 zoom 替代 transform: scale：在浏览器兼容的情况下，使用 zoom 属性进行缩放，可以避免鼠标事件偏移问题。CSS 代码如下：
.container {zoom: 0.8;
}
  1. 独立处理交互组件：对于需要精确交互的组件，如地图、图表等，可以将其从缩放容器中移出，单独处理其缩放和事件坐标，以确保交互的准确性。

相关文章：

【前端】【业务逻辑】 数据大屏自适应方案汇总

前端数据大屏自适应设计方案全解析 在前端数据大屏的开发中，自适应设计是关键环节，它能确保大屏在不同设备和屏幕尺寸上都能呈现出良好的视觉效果和交互体验。除了常见的 transform: scale、rem/vw、Flex/Grid 等方案外，还有其他有效的方法可…...

编程日记 2025/7/18 3:47:34

Java基础复习（JavaSE进阶）第六章 IO流体系

6-1 File类 01 122、File、IO流概述 02 123、File类：对象的创建 03 124、File类：判断、判断信息相关的方法 04 125、File类：创建、删除文件的方法 05 126、File类：遍历文件夹的方法 6-2 前置知识 01 127、前置知识：方…...

编程日记 2025/7/18 3:24:10

kvm下的ceph主机启动io请求统计

背景 假如一个主机存储在ceph里面，我们想统计下一次启动过程中的io读取的情况，那么可以通过下面的方法来统计 启动时间也可以通过在宿主机里面去查看，通过日志这边要方便一点，无需登录到虚拟机内部 日志开启 [global] fsid 406…...

编程日记 2025/6/29 9:33:20

go-Casbin使用

本次测试代码是基于单租户的RBAC鉴权 依赖 github.com/casbin/casbin/v2 github.com/casbin/gorm-adapter/v2文件存储规则文件 model.pml [request_definition] r sub, obj, act[policy_definition] p sub, obj, act[role_definition] g _, _ # 用户,角色[polic…...

编程日记 2025/7/17 22:18:10

基于YOLOv11的106种手语识别分析系统

基于YOLOv11的手语识别分析系统 【包含内容】 【一】项目提供完整源代码及详细注释 【二】系统设计思路与实现说明 【三】多平台适配优化，支持Windows、macOS和Linux系统，确保中文字体正常渲染 【四】识别的类别数量：106种，具体类…...

编程日记 2025/7/13 12:53:57

CentOS创建swap内存

服务器版本为CentOS7 一、检查现有 swap 空间 sudo swapon --show如果系统中没有 swap 空间或者现有的 swap 空间不足，可以继续后续步骤来创建 swap 空间。 二、创建 swap 文件（推荐 2GB 作为示例） sudo dd if/dev/zero of/swapfile bs1M …...

编程日记 2025/7/13 21:50:58

OpenHarmony OS 5.0与Android 13显示框架对比

1. 架构概述 1.1 OpenHarmony OS 5.0架构 OpenHarmony OS 5.0采用分层架构设计，图形显示系统从底层到顶层包括： 应用层：ArkUI应用和第三方应用框架层：ArkUI框架、窗口管理API系统服务层：图形合成服务、窗口管理服务…...

编程日记 2025/7/16 22:19:03

详解Node.js中的setImmediate()函数

setImmediate() 是 Node.js 提供的一个定时器函数，用于在 事件循环的 “Check” 阶段 执行回调函数。它与 setTimeout() 相似，但两者有着显著的区别，主要体现在回调函数的执行时机上。 什么是事件循环（Event Loop） 在…...

编程日记 2025/7/12 15:46:22

使用C#写的HTTPS简易服务器

由于监控网络之用，需要写一个https服务器。 由于用到https，因此还需一个域名证书，可以免费申请，也可以用一个现有的。 接下来还需在Windows上安装证书，注册证书。 安装证书 找到证书，点击，一路…...

编程日记 2025/7/18 1:29:38

C# 事件知识文档

C# 事件知识文档 概述 在 C# 中，事件（Event） 是一种特殊的机制，它基于委托实现，用于支持发布-订阅模式。事件允许对象在发生特定操作时通知其他对象，而无需直接引用这些对象。这种机制非常适合于实现诸如用户界面交互、状态变化通知等场景。 核心概念 发布者（Publishe…...

编程日记 2025/7/12 12:50:07

C++进阶--二叉搜索树

文章目录 C进阶--二叉搜索树概念算法复杂度模拟实现结构定义插入查找删除剩余的次要接口中序遍历： 构造，析构，拷贝构造，赋值重载 结语 很高兴和大家见面，给生活加点impetus！！开启今天的编程之路…...

编程日记 2025/7/12 7:06:03

互联网大厂Java面试：从基础到进阶的技术点探讨

场景：赵大宝的面试旅程 在互联网大厂的面试现场，严肃的面试官李老师正在准备对求职者赵大宝进行一场Java技术栈的深度考核。赵大宝是一位以幽默著称的程序员，面试官希望通过这次面试能全面了解他的技术能力。 第一轮提问 李老师&#xff1…...

编程日记 2025/7/17 14:07:55

【MCP Node.js SDK 全栈进阶指南】中级篇（1）：MCP动态服务器高级应用

前言 在初级篇中，我们已经掌握了MCP TypeScript-SDK的基础知识，包括开发环境搭建、基础服务器开发、资源开发、工具开发、提示模板开发以及传输层配置等核心内容。随着我们对MCP的理解不断深入，是时候进入更高级的应用场景了。 MCP的一个强大特性是其动态性，能够在运行时…...

编程日记 2025/7/17 8:51:20

LM35 温度传感器介绍

【本文基于Arduino项目】 1. LM35 温度传感器简介 LM35 是一款 精密模拟温度传感器，由德州仪器（TI）推出，具有线性输出、无需校准、低功耗等特点，广泛应用于环境监测、工业控制等领域。 主要特性 参数规格测量范围-…...

编程日记 2025/6/29 9:34:41

【网络应用程序设计】实验一：本地机上的聊天室

个人博客：https://alive0103.github.io/ 代码在GitHub：https://github.com/Alive0103/XDU-CS-lab 能点个Star就更好了，欢迎来逛逛哇~❣ 主播写的刚够满足基本功能，多有不足，仅供参考，还请提PR指正&#xff…...

编程日记 2025/7/16 19:28:35

Cursor 设置规则

文章目录 1、一个可以参考的网站-各种语言都有2、正向设置规则通过 符号还可以引用子规则 3、逆向设置规则 1、一个可以参考的网站-各种语言都有 https://cursor.directory/rules 2、正向设置规则 注意，最开始规则设置已经作废（下图下面的红框&#…...

编程日记 2025/7/14 13:28:04

人工智能-模型评价与优化(过拟合与欠拟合，数据分离与混淆矩阵，模型优化，实战)

欠拟合与过拟合 模型不合适，导致其无法与数据实现有效预测 欠拟合可以通过观察训练数据及时发现，通过优化模型结果解决 过拟合的原因： 1、模型结构过于复杂（维度太高） 2、使用了过多属性，模型训练时包含了…...

编程日记 2025/6/29 9:33:37

Python爬虫从入门到实战详细版教程

Python爬虫从入门到实战详细版教程 文章目录 Python爬虫从入门到实战详细版教程书籍大纲与内容概览第一部分：爬虫基础与核心技术1. 第1章：[爬虫概述](https://blog.csdn.net/qq_37360300/article/details/147431708?spm=1001.2014.3001.5501)2. 第2章：HTTP协议与Requests库…...

编程日记 2025/7/14 14:35:03

Java多线程编程初阶指南

目录 一.线程基础概念 线程是什么？ 线程与进程对比 为啥要有线程 二.线程实现方式 继承Thread类 实现Runnable接口 常规实现方式 匿名内部类写法 Lambda表达式写法（Java8） 对比总结 三.Thread 类及常见方法 核心功能 核心构造方…...

编程日记 2025/7/10 12:05:16

Qt信号槽连接的三种方法对比

信号槽连接方法对比 1. 直接连接2. 集中管理3.函数指针初始化列表后期需要disconnect 对比 1. 直接连接 connect(codeWindow, &CodeEditorWindow::SetBaseLineSignal, monitoringWindow, &MonitoringWindow::SetBaseLineSlot),connect(&ButtonTree::Instance(), &a…...

编程日记 2025/6/29 12:25:18

健康生活新指南

在 “朋克养生” 与 “躺平焦虑” 并存的时代，真正的健康生活无需刻意 “内卷”。这几个简单又实用的养生妙招，能让你在忙碌日常中悄悄升级健康状态，轻松拥抱活力人生。​ 一、饮食：吃对食物，给身体 “加 Buff”​ 别…...

编程日记 2025/7/14 23:50:52

IF=24.5 靶向MMP9治疗协同提高抗PD1疗效

Targeted MMP9 therapy synergistically improves anti-PD1 efficacy CTNNB1GOF（The gain of function (GOF) CTNNB1 mutations，功能获得型CTNNB1突变）在肝细胞癌（HCC）中，已被证明与免疫排斥相关&#xff0…...

编程日记 2025/6/29 9:34:33

基于SpringBoot的中华诗词文化分享平台-项目分享

基于SpringBoot的中华诗词文化分享平台-项目分享 项目介绍项目摘要管理员功能图会员功能图系统功能图项目预览会员主页面诗词页面发布问题回复评论 最后 项目介绍 使用者：管理员、会员 开发技术：MySQLJavaSpringBootVue 项目摘要 本文旨在设计与实现一…...

编程日记 2025/6/29 9:33:26

SQLiteDatabase 增删改查(CRUD)详细操作

文章目录 1. 初始化数据库2. 插入数据 (Create)方法一：使用 ContentValues insert()方法二：直接执行SQL 3. 查询数据 (Read)方法一：使用 query() 方法方法二：使用 rawQuery() 执行原始SQL 4. 更新数据 (Update)方法一&#xff1a…...

编程日记 2025/7/17 19:59:41

从 0 到 1 打通 AI 工作流：Dify+Zapier 实现工具自动化调用实战

一、引言：当 AI 遇到工具孤岛 在企业数字化转型的浪潮中，AI 工具的应用早已从单一的对话交互进阶到复杂的业务流程自动化。但开发者常常面临这样的困境：本地开发的 MCP 工具（如 ERP 数据清洗脚本、CRM 工单系统 API）如…...

编程日记 2025/7/14 16:13:44

第四届商师校赛 web 1

RceMe ezGame 伪装 Ping Are you from SQNU? Look for the homepage Through 根据题目慢慢试 File_download Post上传得到下载文件 反编译一下 /* * Decompiled with CFR 0.152. * * Could not load the following classes: * javax.servlet.http.HttpServlet */ …...

编程日记 2025/7/15 18:13:33

SSH 互信被破坏能导致 RAC 异常关闭吗

一、 SSH 互信和 RAC 的关系 1、SSH 互信对 RAC 的作用 Oracle 11g R2 在安装 Grid Infrastructure 的时候，能够通过安装程序配置节 点间的 SSH 用户等效性，之所以要在安装之前配置 SSH 用户等效性，是为了能 够在安装前使用 C…...

编程日记 2025/7/14 14:52:31

工程投标k值分析系统（需求和功能说明）

1 需求总括 2 企业管理模块： 新增、删除、修改企业/部门 <...

编程日记 2025/7/14 9:57:26

Qt-托盘的实现

文章目录 托盘的功能QSystemTrayIcon 类QSystemTrayIcon类的常用函数代码实现 托盘的功能 GUI 程序&#xff0c;如果想要实现当最小化时&#xff0c;程序从任务栏消失&#xff0c;在系统托盘显示一个图标&#xff0c;表示此程序&#xff0c;并能在托盘内通过双击或者菜单使程序…...

编程日记 2025/6/29 9:34:26

【人脸识别】百度人脸识别H5方案对接

经调研&#xff0c;百度的人脸识别使用场景比较广泛且准确率较高&#xff0c;项目上有用到&#xff0c;这里做一下记录&#xff0c;整体对接没有难度&#xff0c;按照文档操作就行。 一、准备工作 1、需要注册百度云开放平台&#xff08;企业资质&#xff09;注册指南 2、创…...

编程日记 2025/6/29 12:26:45

用Qt和deepseek创建自己的问答系统

如果你不想花钱调用deepseek&#xff0c;试试下面的方法。 1: 访问 OpenRouter&#xff1a; https://openrouter.ai 2: 搜索 DeepSeek-R1 (free) 要使用这个免费模型&#xff0c;你需要&#xff1a; &#xff08;1&#xff09;注册 OpenRouter 账户并获取 API 密钥 访问 …...

编程日记 2025/7/17 6:59:05

飞搭系列 | 组件增加标记，提升用户体验

前言 Preface 飞搭低代码平台&#xff08;FeiDa&#xff0c;以下简称“飞搭”&#xff09;&#xff0c;为企业提供在线化、灵活的业务应用构建工具&#xff0c;支持高低代码融合&#xff0c;助力企业低门槛、高效率和低成本地快速应对市场变化&#xff0c;加速复杂业务场景落地…...

编程日记 2025/7/15 11:19:51

布隆过滤器的应用

布隆过滤器虽然看起来是一个“算法结构”&#xff0c;但在实际 Web 应用场景中用途非常广泛&#xff0c;尤其在 提升性能、节省资源、防御攻击 等方面非常有用。 缓存穿透保护&#xff08;常见于 Redis&#xff09; &#x1f4cc; 问题&#xff1a; 用户频繁请求一些数据库中…...

编程日记 2025/7/15 12:30:38

云原生--基础篇-4--CNCF-1-云原生计算基金会（云原生生态发展和目标）

1、CNCF定义与背景 云原生计算基金会&#xff08;Cloud Native Computing Foundation&#xff0c;CNCF&#xff09;是由Linux基金会于2015年12月发起成立的非营利组织&#xff0c;旨在推动云原生技术的标准化、开源生态建设和行业协作。其核心目标是通过开源项目和社区协作&am…...

编程日记 2025/6/29 10:32:11

（16）VTK C++开发示例 --- 转换文件格式

文章目录 1. 概述2. CMake链接VTK3. main.cpp文件4. 演示效果 更多精彩内容&#x1f449;内容导航 &#x1f448;&#x1f449;VTK开发 &#x1f448; 1. 概述 此示例演示如何读取文件&#xff0c;然后将其写入不同类型的文件。 在此示例中&#xff0c;我们读取一个 vtp 文件并…...

编程日记 2025/7/15 1:38:00

离线-DataX

基本介绍 DataX 是阿里云 DataWorks数据集成的开源版本&#xff0c;在阿里巴巴集团内被广泛使用的离线数据同步工具/平台&#xff0c;它是一个异构数据源离线同步工具&#xff0c;致力于实现包括关系型数据库(MySQL、Oracle等)、HDFS、Hive、ODPS、HBase、FTP等各种异构数据源…...

编程日记 2025/7/17 4:01:01

深度学习-全连接神经网络-3

七、过拟合与欠拟合 在训练深层神经网络时&#xff0c;由于模型参数较多&#xff0c;在数据量不足时很容易过拟合。而正则化技术主要就是用于防止过拟合&#xff0c;提升模型的泛化能力(对新数据表现良好)和鲁棒性&#xff08;对异常数据表现良好&#xff09;。 1. 概念认知 …...

编程日记 2025/7/15 23:03:29

基于javaweb的SSM+Maven教材管理系统设计与实现(源码+文档+部署讲解）

技术范围&#xff1a;SpringBoot、Vue、SSM、HLMT、Jsp、PHP、Nodejs、Python、爬虫、数据可视化、小程序、安卓app、大数据、物联网、机器学习等设计与开发。 主要内容&#xff1a;免费功能设计、开题报告、任务书、中期检查PPT、系统功能实现、代码编写、论文编写和辅导、论文…...

编程日记 2025/7/16 8:07:02

DCL介绍

一.dcl-介绍 一.案例 1.查询用户 USE mysql&#xff1b; select * from user&#xff1b; 2.权限控制...

编程日记 2025/7/14 1:54:36

mysql日常巡检

1.查看mysql服务是否异常 systemctl status mysql_3306 查看MySQL进程是否存在 ps -ef | grep mysql 2.连接异常检查 (1)查看是否异常连接 show processlist; #或 show full processlist; (2)查看当前失败连接数 show global status like aborted_connects; (3)查看试…...

编程日记 2025/7/17 23:14:44

Cursor这类编程Agent软件的模型架构与工作流程

开发&#xff5c;界面&#xff5c;引擎&#xff5c;交付&#xff5c;副驾——重写全栈法则&#xff1a;AI 原生的倍速造应用流 来自全栈程序员 nine 的探索与实践&#xff0c;持续迭代中。 欢迎评论私信交流。 最近在关注和输出一系列 AIGC 架构。 模型架构与工作流程 大语…...

编程日记 2025/7/13 15:07:58

记录：扩展欧几里得算法

本文遵循 CC BY-NC-ND 4.0 协议&#xff0c;作者&#xff1a; U•ェ•*U \texttt{U•ェ•*U} U•ェ•*U&#xff0c;转载请获得作者授权。 前置知识 裴蜀定理/贝祖定理&#xff1a;若 a , b a,b a,b 是整数&#xff0c;且 gcd ⁡ ( a , b ) d \gcd(a,b)d gcd(a,b)d&#xf…...

编程日记 2025/7/16 9:58:22

学习笔记——《Java面向对象程序设计》-抽象和接口

参考教材&#xff1a; Java面向对象程序设计&#xff08;第3版&#xff09;微课视频版 清华大学出版社 抽象方法 抽象方法是使用abstract关键字修饰的成员方法&#xff0c;抽象方法在定义时不需要实现方法体。 抽象方法的定义格式如下&#xff1a; abstract void 方法名称…...

编程日记 2025/7/16 5:04:19

MySQL中根据binlog日志进行恢复

MySQL中根据binlog日志进行恢复 排查 MySQL 的 binlog 日志问题及根据 binlog 日志进行恢复的方法一、引言二、排查 MySQL 的 binlog 日志问题&#xff08;一&#xff09;确认 binlog 是否开启&#xff08;二&#xff09;查找 binlog 文件位置和文件名模式&#xff08;三&#…...

编程日记 2025/7/13 19:12:57

数据库sql语句 中 GROUP BY 关键字详解及字段要求

GROUP BY 关键字详解及字段要求 GROUP BY 的核心作用 将查询结果按指定字段分组&#xff0c;常与聚合函数&#xff08;如 COUNT, SUM, AVG 等&#xff09;结合使用&#xff0c;对分组后的数据进行统计计算。 GROUP BY 后字段的要求 非聚合字段必须出现在 GROUP BY 子句中&…...

编程日记 2025/7/15 21:58:11

数据集 | 柑橘果目标检测数据集

文章目录 一、数据集概述1.1 数据标注实例1.2 数据集技术规格 二、样本类别详解2.1 树上柑橘样本2.2 树下柑橘样本 三、标注工具四、数据下载地址 一、数据集概述 在农业智能化领域&#xff0c;柑橘果园的自动化监测与管理一直面临着几个关键挑战&#xff1a; 果实定位准确性…...

编程日记 2025/7/14 5:11:09

Arduino示例代码讲解：Project 11 - Crystal Ball 水晶球

Arduino示例代码讲解：Project 11 - Crystal Ball 水晶球 Project 11 - Crystal Ball 水晶球程序功能概述功能：硬件要求：输出：代码结构全局变量`setup()` 函数`loop()` 函数读取倾斜开关状态：检测状态变化：保存状态：运行过程注意事项Project 11 - Crystal Ball 水晶球 /…...

编程日记 2025/7/13 18:05:37

Redis—为何持久化使用子进程

AOF重写以及bgsave的时候为什么采用fork子进程而不是子线程&#xff1f; 进程间内存隔离 独立的内存空间&#xff1a;子进程拥有与主进程独立的内存空间&#xff0c;确保即使在重写过程中发生崩溃或错误&#xff0c;也不会影响主进程的运行和内存状态。 数据安全性&#xff…...

编程日记 2025/7/13 21:25:46

Vue3 + Vite + TS,使用 ExcelJS导出excel文档，生成水印，添加背景水印，dom转图片，插入图片，全部代码

Vue3 Vite TS,使用 ExcelJS导出excel文档&#xff0c;生成水印&#xff0c;添加背景水印&#xff0c;dom转图片&#xff0c;插入图片&#xff0c;全部代码 ExcelJS生成文档并导出导出表头其他函数 生成水印设置文档的背景水印dom 转图片插入图片全部代码 ExcelJS 读取&#…...

编程日记 2025/7/14 12:51:05

VulnHub-DarkHole_1靶机渗透教程

VulnHub-DarkHole_1靶机渗透教程 1.靶机部署 [Onepanda] Mik1ysomething 靶机下载&#xff1a;https://download.vulnhub.com/darkhole/DarkHole.zip 直接使用VMware打开就行 导入成功&#xff0c;打开虚拟机&#xff0c;到此虚拟机部署完成&#xff01; 注意&#xff1a…...

编程日记 2025/7/14 1:54:52