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

Webpack基本用法学习总结

news 来源：原创 2025/8/5 12:10:07

Webpack

基本使用
核心概念
处理样式资源
- 步骤：
处理图片资源
- 修改图片输出文件目录
自动清空上次打包的内容
Eslint
Babel
处理HTML资源
搭建开发服务器
生产模式
- 提取css文件为单独文件
- - 问题：
- Css压缩
- HTML压缩
小结1
高级
- SourceMap
- - 开发模式
  - 生产模式
- HMR
- OneOf
- Include/Exclude
- Cache
- Thead
- Tree Shaking
- Babel
- 压缩图片
- Code Split
- - 多入口
  - 按需加载
- Preload / Prefetch
- Core-js
- PWA
- 总结

基本使用

webpack是一个静态资源打包工具
他会以一个或者多个文件作为打包的入口，将我们整个项目所有文件编译组合成一个或者多个文件输出出去
输出的文件就是编译好的文件，就可以在浏览器中运行了
我们将webpack输出的文件叫做bundle

核心概念

entry（入口）：指示Webpack从哪个文件开始打包
output（输出）：指示Webpack打包完的文件输出到哪里去，如何命名等
loader（加载器）：webpack本身只能处理js、json等资源，其他资源需要借助loader、webpack才能解析
plugins（插件）：扩展webpack的功能
mode（模式）：
- 开发模式：development
- 生产模式：production
开发服务器：devServer

处理样式资源

webpack本身是不能识别样式资源的，所以我们需要借助Loader来帮助Webpack解析样式资源

步骤：

安装相应的loader
在webpack.config.js中进行配置
npx webpack进行打包即可

处理图片资源

将小于10kb的图片转为base64编码格式

 //处理图片资源{test: /\.(png|jpg|gif|jpeg|webp)$/,type: "asset",parser: {dataUrlCondition: {maxSize: 10 * 1024, //小于10kb的图片，会被base64处理},},},

修改图片输出文件目录

添加generator属性

 //处理图片资源{test: /\.(png|jpg|gif|jpeg|webp)$/,type: "asset",parser: {dataUrlCondition: {maxSize: 10 * 1024, //小于10kb的图片，会被base64处理},},generator: {//输出图片名称filename: "static/images/[hash][ext][query]",},},

自动清空上次打包的内容

在output中的clean属性设置为true

Eslint

可组装的Javascript和JSX检查工具
它是用来检测js和jsx语法的工具，可以配置各项功能

Babel

JavaScript编译器
主要用于将ES6编写的代码转换为向后兼容的JavaScript语法，以便能够运行在当前和旧版本的浏览器或者其他环境中

处理HTML资源

Defer的作用：在 HTML 中，

搭建开发服务器

自动化：devServer
在webpack.config.js中进行配置

  //开发服务器devServer:{host:"localhost", //启动服务器域名port:"3000", //启动服务器端口open:true // 是否自动打开浏览器},

生产模式

生产模式是开发完成代码后，我们需要得到代码将来部署上线
这个模式下我们主要对代码进行优化，让其运行性能更好，优化主要从两个角度出发：
- 优化代码运行性能
- 优化代码打包速度

提取css文件为单独文件

css文件目前被打包到js文件中，当js文件加载时，会创建一个style标签来生成样式
这样对于网站来说会出现闪屏现象，用户体验不好
我们应该是单独的css文件，通过link标签加载性能更好
使用下面的插件
mini-css-extract-plugin

问题：

为什么通过style标签加载css会出现闪屏现象，但是通过link标签则不会呢
当您通过

Css压缩

npm install css-minimizer-webpack-plugin --save-dev

HTML压缩

默认生产模式已经开启了：HTML压缩和js压缩

小结1

在这里插入图片描述

高级

所谓高级配置其实就是进行Webpack优化，让我们代码在编译/运行时性能更好

SourceMap

SourceMap（源代码映射）是一个用来生成源代码与构建后代码一一映射的文件的方案。
作用：它会生成一个xxx.map文件，里面包含源代码和构建后代码每一行、每一列的映射关系。当构建后代码出错了，会通过xxx.map文件，从构建后代码出错位置找到映射后源代码出错位置，从而让浏览器提示源代码文件出错位置，帮助我们更快的找到错误根源

开发模式

cheap-module-source-map
优点：打包编译速度快，只包含行映射
缺点：没有列映射

module.exports = {mode:"development",devtool:"cheap-module-source-map"
}

生产模式

source-map
优点：包含行/列映射
缺点：打包编译速度更慢

module.exports = {mode:"production",devtool:"source-map"

HMR

全称：HotModuleReplacement（HMR/热模块替换）：在程序运行中，替换、添加或者删除模块，而无需重新加载整个页面

OneOf

为什么：打包时每个文件都会经过所有loader处理，虽然因为test正则原因实际没有处理上，但是都要过一遍，比较慢
是什么：顾名思义就是只能匹配上一个loader，剩下的就不匹配了

Include/Exclude

为什么：开发时我们需要使用第三方库和插件，所有文件都下载到node-modules中了，而这些文件是不需要编译可以直接使用的，所以我们在对js文件处理时，要排除node-modules下面的文件
是什么：
- include：包含，只处理xxx文件
- exclude：排除，除了xxx文件以外其他文件都处理

Cache

为什么：每次打包时js文件都要经过Eslint检查和Babel编译，速度比较慢。我们可以缓存之前的Eslint检查和Babel编译结果，这样第二次打包时速度就会更快了。
是什么：对Eslint检查和Babel编译结果进行缓存

Thead

为什么：当项目越来越大时，打包速度越来越慢。我们想要继续提升打包速度，其实就是要提升js的打包速度，因为其他文件都比较少。而对js文件处理主要就是eslint、babel、Terser三个工具，所以我们要提升他们的运行速度，我们可以开启多进程同时处理js文件，这样速度就比之前的单进程打包更快了
是什么：多进程打包：开启电脑的多个进程同时干一件事，速度更快。
需要注意：请仅在特别耗时的操作中使用，因为每个进程启动就有大约为600ms左右的开销。

Tree Shaking

用来减少代码体积
为什么：开发时我们定义了一些工具函数库，或者引用第三方工具函数库或者组件库。如果没有特殊处理的话我们打包时会引入整个库，但是实际上可能我们可能只用上极小部分的功能。这样将整个库都打包进来，体积就太大了。
是什么：Tree Shaking是一个术语，通常用于描述移除Javascript中的没有使用上的代码。
注意：它依赖ES Module
生产模式下自动开启了这个功能

Babel

Babel-runtime

压缩图片

开发如果项目中引用了较多图片，那么图片体积会比较大，将来请求速度比较慢。我们可以对图片进行压缩，减少图片体积。
注意：如果项目中图片都是在线链接，那么就不需要了，本地项目静态图片才需要进行压缩。
插件：image-minimizer-webpack-plugin

Code Split

作用：优化代码运行性能
为什么：打包代码时会将所有js文件打包到一个文件中，体积太大了。我们如果只要渲染首页，就应该只加载首页的js文件，其他文件不应该加载
- 所以我们需要将打包生成的文件进行代码分割，生成多个js文件，渲染哪个页面就只加载某个js文件，这样加载的资源越少，速度就更快。
是什么：代码分割，主要做了两件事
- 分割文件：将打包生成的文件进行分割，生成多个js文件。
- 按需加载：需要哪个文件就加载哪个文件

多入口

有多个入口文件就是多入口
打包后会生成多个文件

 entry: {//有多个入口文件：多入口main: "./src/main.js",app: "./src/app.js",},

按需加载

可以使用import的动态导入，会将动态导入的文件代码分割（拆分成单独模块），在需要使用的时候自动加载。
返回值是一个promise对象

//动态import
const btn = document.getElementsByClassName("btm");
btn[0].addEventListener("click", () => {import("./count.js").then((res) => {console.log(res.default(1, 6));}).catch((err) => {console.log(err);});
});

Preload / Prefetch

为什么：前面已经做了代码分割，同时会使用import动态导入语法来进行代码按需加载（也叫懒加载，比如路由懒加载就是这样实现的）。但是加载速度还不够好，比如：是用户点击按钮时才加载这个资源的，如果资源体积很大，那么用户会感觉到明显卡顿效果。我们想在浏览器空闲时间，加载后续需要使用的资源，我们就需要用上preload和prefetch技术。
是什么：
- Preload：告诉浏览器立即加载资源
- Prefetch：告诉浏览器在空闲时才开始加载资源
共同点：
- 都只会加载资源，并不执行。
- 都有缓存
区别：
- Preload加载优先级高，Prefetch加载优先级低
- Preload只能加载当前页面需要使用的资源，Prefetch可以加载当前页面资源，也可以加载下一个页面需要使用的资源
总结：
- 当前页面优先级高的资源用Preload加载。
- 下一个页面需要使用的资源用Prefetch加载。

Core-js

为什么：babel对js代码的兼容性处理不能做到面面俱到，一旦遇到低版本浏览器会直接报错，所以我们想要将js兼容性问题彻底解决
是什么：core-js是专门用来做ES6以及以上API的polyfill。polyfill翻译过来叫做垫片/补丁。就是用社区上提供的一段代码，让我们在不兼容某些新特性的浏览器上，使用该新特性。
完整引入：import 'core-js'
按需加载：import "core-js/es/promise"

PWA

为什么：开发Web App项目，项目一旦处于网络离线情况，就没法访问了。
是什么：渐进式网络应用程序（progressive web application），是一种可以提供类似于native app（原生应用程序）体验的Web App的技术。其中最重要的是，在离线时应用程序能够继续运行功能。内部通过Service Workers技术实现

总结

在这里插入图片描述

Webpack基本用法学习总结

Webpack 基本使用核心概念处理样式资源步骤： 处理图片资源修改图片输出文件目录自动清空上次打包的内容EslintBabel处理HTML资源搭建开发服务器生产模式提取css文件为单独文件问题： Css压缩HTML压缩小结1高级SourceMap开发模式生产模式 HMROneOfInclud…...

编程日记 2025/8/5 12:10:07

5月9日复盘-混合注意力机制

5月9日复盘四、混合注意力混合注意力机制（Hybrid Attention Mechanism）是一种结合空间和通道注意力的策略，旨在提高神经网络的特征提取能力。 1. CBAM Convolution Block Attention Module ，卷积块注意力模块论文地址&…...

编程日记 2025/8/5 12:09:41

YOLOv8 优化：基于 Damo-YOLO 与 DyHead 检测头融合的创新研究

文章目录 YOLOv8 的背景与发展Damo-YOLO 的优势与特点DyHead 检测头的创新之处融合 Damo-YOLO 与 DyHead 检测头的思路融合后的模型架构融合模型的代码实现导入必要的库定义 Damo-YOLO 的主干网络定义特征金字塔网络（FPN）定义 DyHead 检测头定义融合后的…...

编程日记 2025/7/31 17:23:51

【网安播报】Meta 推出 LlamaFirewall开源框架以阻止 AI 越狱、注入和不安全代码

1、Meta 推出 LlamaFirewall 框架以阻止 AI 越狱、注入和不安全代码 Meta 宣布推出 LlamaFirewall，这是一个开源框架，旨在保护人工智能 （AI） 系统免受新出现的网络风险，例如提示词注入、越狱和不安全代码等。除了 Llam…...

编程日记 2025/8/5 12:09:40

QT 解决msvc fatal error C1060: 编译器的堆空间不足

一.物理内存太小，代码又比较复杂，递归嵌套之类的。 1.修改虚拟内存的大小，一般设置为物理内存的1.5倍。二.msvc工程的编译默认开启的是多线程编译，所以电脑内存确实不够，采用如下设置。 QMAKE_CXXFLAGS -j1 三.ms…...

编程日记 2025/7/31 17:23:47

PX4开始之旅(一)自动调参

核心知识点：无人机震动与滤波参数 1. 通俗易懂的解释想象一下，你的无人机就像一个非常敏感的“听众”，它的“耳朵”就是陀螺仪和加速度计这些传感器，用来感知自己是如何移动和旋转的。理想情况下，它应该只“听”到你…...

编程日记 2025/8/5 12:07:14

C++ 中 lower_bound 与 upper_bound 函数详解

C 中 lower_bound 与 upper_bound 函数详解文章目录 C 中 lower_bound 与 upper_bound 函数详解**一、核心定义与区别****二、使用条件与时间复杂度****三、实际应用场景****四、注意事项与常见误区****五、代码示例****六、总结** 一、核心定义与区别 lower_bound 作用&#…...

编程日记 2025/8/2 19:42:34

minio数据迁移(两台服务器没法相互通信)

场景描述: A服务器无法访问 B服务器，B服务器也无法访问 A（即双方都不能通过公网或内网直连对方） MinIO 官方提供了 mc（MinIO Client）命令行工具，可以直接实现 Bucket 之间的数据迁移： 安装 …...

编程日记 2025/8/5 12:07:44

O2OA(翱途)开发平台系统安全-用户登录IP限制

O2OA(翱途)开发平台[下称O2OA开发平台或者O2OA]支持对指定的用户设置可以连接的客户端计算机的IP地址，以避免用户在不安全的环境下访问系统。本篇主要介绍如何开启O2OA用户登录IP限制。一、先决条件： 以拥有管理员权限的用户账号登录O2OA(翱途)开发平…...

编程日记 2025/8/5 12:02:33

CSS flex:1

在 CSS 中，flex: 1 是一个用于弹性布局（Flexbox）的简写属性，主要用于控制 flex 项目（子元素）如何分配父容器的剩余空间。以下是其核心作用和用法： 核心作用等分剩余空间：让 flex …...

编程日记 2025/8/4 18:28:28

OpenHarmony平台驱动开发（十一），PIN

OpenHarmony平台驱动开发（十一） PIN 概述功能简介 PIN即管脚控制器，用于统一管理各SoC的管脚资源，对外提供管脚复用功能。基本概念 PIN是一个软件层面的概念，目的是为了统一对各SoC的PIN管脚进行管理&#xff0…...

编程日记 2025/8/5 12:07:44

.NET高频技术点（持续更新中）

1. .NET 框架概述 .NET 框架的发展历程.NET Core 与 .NET Framework 的区别.NET 5 及后续版本的统一平台 2. C# 语言特性异步编程（async/await）LINQ（Language Integrated Query）泛型与集合委托与事件属性与索引器 3. ASP.NET…...

编程日记 2025/8/5 12:07:13

Spring Cloud - 2（ 12000 字详解 Spring Cloud）

一：服务注册和服务发现 - Eureka 1.1 背景在上一章节的例子中，我们可以看到远程调用时 URL 被硬编码，这导致在更换机器或新增机器时，相关的 URL 需要进行相应的变更。这就需要让所有相关服务去修改 URL，随之而来的就…...

编程日记 2025/8/5 12:00:54

解决Win11下MySQL服务无法开机自启动问题

问题描述在win11系统中，明明将MySQL服务设置成了自动启动，但在重启电脑后MySQL服务还是无法自动启动，每次都要重新到计算机管理的服务中找到服务再手动启动。解决方式首先确保mysql服务的启动类型为自动。设置方法：找到此电…...

编程日记 2025/8/5 12:01:14

RGB矩阵照明系统详解及WS2812配置指南

RGB矩阵照明系统详解及WS2812配置指南一、RGB矩阵照明简介 RGB矩阵照明是一种强大的功能，允许使用外部驱动器驱动的RGB LED矩阵为键盘增添绚丽的灯光效果。该系统与RGBLIGHT功能无缝集成，因此您可以使用与RGBLIGHT相同的键码来控制它，操作…...

编程日记 2025/8/5 12:08:13

全球首款无限时长电影生成模型SkyReels-V2本地部署教程：视频时长无限制！

一、简介 SkyReels-V2 模型集成了多模态大语言模型（MLLM）、多阶段预训练、强化学习以及创新的扩散强迫（Diffusion-forcing）框架，实现了在提示词遵循、视觉质量、运动动态以及视频时长等方面的全面突破。通过扩散强迫框…...

编程日记 2025/8/5 12:00:53

代理ARP与传统ARP在网络通信中的应用及区别研究

一些问题路由器隔离广播域，每个接口/网段都是独立的广播域ARP请求是二层广播包，广播包没法通过路由器ARP请求没法穿越互联网到达目标主服务器一些思考电脑访问互联网服务器的时候，ARP询问的内容，真的是访问服务器么&#xf…...

编程日记 2025/7/31 20:48:44

理解 Envoy 的架构

理解 Envoy 的架构对于深入理解 Istio 至关重要，因为 Envoy 是 Istio 数据平面的核心。Envoy 是一个高性能的 C 分布式代理，设计为云原生应用和大规模微服务架构的网络基础。以下是 Envoy 架构的关键组成部分和核心理念： 核心设计理念&…...

编程日记 2025/8/4 17:21:12

使用Kotlin Flow实现Android应用的响应式编程

在Android应用中使用Kotlin Flow实现响应式编程可以分为以下步骤，结合最佳实践和生命周期管理： 1. 添加依赖在build.gradle中确保包含协程和生命周期相关依赖： dependencies {implementation("org.jetbrains.kotlinx:kotlinx-corouti…...

编程日记 2025/7/31 20:48:41

【AI提示词】蝴蝶效应专家

提示说明一位专注于分析和优化蝴蝶效应现象的专业人士，擅长将微小变化转化为系统级影响的研究者。提示词 # Role: 蝴蝶效应专家## Profile - language: 中文 - description: 一位专注于分析和优化蝴蝶效应现象的专业人士，擅长将微小变化转化为系统级…...

编程日记 2025/7/31 20:48:39

StreamRL：弹性、可扩展、异构的RLHF架构

StreamRL：弹性、可扩展、异构的RLHF架构大语言模型（LLMs）的强化学习（RL）训练正处于快速发展阶段，但现有架构存在诸多问题。本文介绍的StreamRL框架为解决这些难题而来，它通过独特设计提升了训…...

编程日记 2025/7/31 20:48:37

架构进阶：大型制造业企业数据架构顶层设计总体规划方案【附全文阅读】

本文概述了一个大型企业数据架构设计的总体规划方案，针对当前数据架构与管理中存在的诸多问题，如缺乏统一数据模型、数据分析应用体系不健全、主数据管理体系不完善、数据治理体系缺失等，提出了明确的改进目标与实施路径。数据架构设计思路聚焦于明确数据分布和流向…...

编程日记 2025/7/31 20:48:35

前端指南——项目代码结构解析（React为例）

文件结构文件项目 ├── doc │ ├── technology.md ├── node_modules ├── public ├── shell ├── src │ ├── auto-generated │ │ ├── apis │ │ ├── models │ ├── components │ │ ├── 组件A │ │ ├── 组件B …...

编程日记 2025/7/31 20:48:34

Redis-数据一致性问题与解决方案

Redis-数据一致性问题与解决方案引言 Redis 是一个高性能的内存数据库，广泛应用于缓存、会话存储、实时分析等场景。作为一个 NoSQL 数据库，它的高性能和丰富的数据结构使其成为现代微服务架构中不可或缺的组件。然而，在高并发的环境下&am…...

编程日记 2025/7/31 20:48:32

【数据结构】算法的复杂度

前言：经过了C语言的学习，紧接着就步入到数据结构的学习了。在C语言阶段我们在写大多数的oj题的时候会遇到一些问题，就是算法的效率低使用的时间较多，占用的空间也多，数据结构就是来优化算法的。文章目录一&#xff…...

编程日记 2025/7/31 20:48:30

Leetcode刷题由浅入深之字符串——541. 反转字符串Ⅱ

目录 （一）反转字符串Ⅱ的C实现写法一（s.begin（）遍历字符） （二）复杂度分析时间复杂度空间复杂度 （三）总结【题目链接】541. 反转字符串Ⅱ - 力扣&am…...

编程日记 2025/7/31 20:48:28

制造单元智能化改造与集成技术平台成套实训设备

制造单元智能化改造与集成技术平台成套实训设备一、概述： 本设备以汽车行业的轮毂为产品对象，实现了仓库取料、制造加工、打磨抛光、检测识别、分拣入位等生产工艺环节，以未来智能制造工厂的定位和需求为参考，通过工业以太网完成…...

编程日记 2025/7/31 20:48:25

Vscode 顶部Menu(菜单)栏消失如何恢复

Vscode 顶部Menu(菜单)栏消失如何恢复 https://blog.csdn.net/m0_62964247/article/details/135759655 Vscode 顶部Menu(菜单)栏消失如何恢复？ 首先按一下 Alt按键，看一下是否恢复了菜单栏如果恢复了想了解更进一步的设置，或是没能恢复菜单…...

编程日记 2025/8/3 16:59:40

苍穹外卖--公共字段自动填充

1.问题分析业务表中的公共字段： 问题：代码冗余、不便于后期维护 2.实现思路自定义注解AutoFill，用于标识需要进行公共字段填充的方法自定义切面类AutoFillAspect，统一拦截加入了AutoFill注解的方法，通过反射为公…...

编程日记 2025/7/31 20:48:22

行业 |四大痛点待破：“拆解”DeepSeek一体机

繁荣DeepSeek一体机市场。 2025年开年，DeepSeek大模型掀起的一体机热潮席卷中国AI市场。这款一体机凭借其“开箱即用”的便利性和极低的门槛，吸引了大量企业关注，尤其是在中小企业和行业创新者中，更是成为了新晋“顶流”。无论…...

编程日记 2025/7/31 20:48:20

革新锅炉厂智能控制——Ethernet IP转CANopen协议网关的工业互联新方案

锅炉厂智能化转型的必经之路在工业4.0时代，锅炉厂作为能源供应的核心环节，正面临智能化升级的迫切需求。传统锅炉控制系统往往因协议不兼容、数据孤岛问题导致效率低下、维护成本高昂。如何实现设备间高效协同？如何让老旧设备融入智能网络&…...

编程日记 2025/7/31 22:59:46

基于卷积神经网络和Pyqt5的猫狗识别小程序

任务描述猫狗分类任务（Dogs vs Cats）是Kaggle平台在2013年举办的一个经典计算机视觉竞赛。官方给出的Kaggle Dogs vs Cats 数据集中包括由12500张猫咪图片和12500张狗狗图片组成的训练集，12500张未标记照片组成的测试集。选手需要在规定时间…...

编程日记 2025/7/31 20:48:18

Baklib知识中台引领服务智能跃迁

智能架构重构服务范式 Baklib 知识中台通过全量数据融合与多模态处理能力，重塑企业服务底层逻辑。基于分布式架构设计，平台将分散在业务系统、文档库及外部渠道的非结构化数据进行智能清洗与语义解析，形成标准化的知识元数据池。通过四库体系…...

编程日记 2025/7/31 20:48:17

【Python】超全常用 conda 命令整理

Conda命令整理文档，结合官方指南与高频使用场景分类说明，每个命令都有对应的解释一、环境管理 1. 创建环境基本创建conda create --name my_env # 创建名为my_env的空环境 conda create -n my_env python3.11 # 指定Python版本 conda creat…...

编程日记 2025/7/31 20:48:15

FreeRTOS菜鸟入门（十四）·事件

目录 1. 基本概念 2. 应用场景 3. 运作机制 4. 控制块 5. 事件函数接口 5.1 事件创建函数 xEventGroupCreate() 5.2 事件删除函数 vEventGroupDelete() 5.3 事件组置位函数 xEventGroupSetBits()（非中断） 5.4 事件组置位函数 xEventGr…...

编程日记 2025/7/31 20:48:12

setData执行后操作方法-微信小程序

在微信小程序中，setData 是异步执行的，如果你需要在 setData 执行完毕后执行某些操作，可以通过以下几种方式实现： 1. 使用 setData 的回调函数从基础库 2.2.3 开始，setData 支持传入回调函数，回调会在数据…...

编程日记 2025/7/31 20:48:11

SpringAI特性

一、SpringAI 顾问（Advisors） Spring AI 使用 Advisors机制来增强 AI 的能力，可以理解为一系列可插拔的拦截器，在调用 AI 前和调用 AI 后可以执行一些额外的操作，比如： 前置增强：调用 AI 前改…...

编程日记 2025/7/31 20:48:08

捌拾叁- 量子傅里叶变换

1. 前言最近公司地震，现在稍微有点时间继续学习。看了几个算法，都说是基于量子傅里叶变换 ，好，就是他了 Quantum Fourier。 2. 傅里叶变换大学是学通信的，对于傅里叶变换还是有所理解的。其实就是基于一个时域…...

编程日记 2025/7/31 20:48:06

SSTI模版注入

1、概念 SSTI是一种常见的Web安全漏洞，它允许攻击者通过注入恶意模板代码，使服务器在渲染模板时执行非预期的操作。 （1）渲染模版至于什么是渲染模版：服务器端渲染模板是一种Web开发技术，它允许在服务器端…...

编程日记 2025/7/31 20:48:05

33、前台搜索功能怎么实现？

输入搜索的东西，如果为空如果有前端是提交表单，方式是 post 后端接受调用 mybatisplus的categoryService.getById 用户在搜索框内输入关键字之后，执行 js 中的 load方法，前端提交表单， 后端 controller 中的loa…...

编程日记 2025/7/31 20:48:03

量化解析美英协议的非对称冲击：多因子模型与波动率曲面重构

摘要：基于机器学习算法对市场微观结构的实时监测，黄金价格在3300美元/盎司附近展开技术性反弹。本文通过多因子分析框架，解析美元指数上行、贸易政策突变及资产配置迁移对贵金属市场的复合影响，并构建基于LSTM神经网络的动态支撑位…...

编程日记 2025/7/31 22:59:44

对PyTorch模块进行性能分析

以下是针对PyTorch模块进行性能分析的完整方法与工具指南，结合了多种优化策略和实际应用场景： 一、PyTorch性能分析工具 PyTorch Profiler • 功能：内置的性能分析工具，支持捕获CPU/GPU操作、内存分配、数据形状及硬件利用率。 …...

编程日记 2025/8/4 16:17:49

lvm详细笔记

LVM简介逻辑卷管理器，是Linux 系统中用于管理磁盘储存的关键技术。 LVM 则打破了磁盘分区一旦确定，其大小调整往往较为复杂，且难以灵活应对业务变化这种限制，它允许用户将多个物理分区组合卷组。例如，系统中的多个物…...

编程日记 2025/7/31 19:37:18

OpenHarmony 以太网卡热插拔事件接口无效

目录 1.背景 2.解决方案 1.背景在OpenHarmony中调用以太网热插拔时间，发现热插拔没有任何回调，如下接口 import { ethernet } from kit.NetworkKit;ethernet.on(interfaceStateChange, (data: object) > {console.log(on interfaceSharingStateCha…...

编程日记 2025/7/31 19:37:16

SPDK NVMe of RDMA 部署

使用SPDK NVMe of RDMA 实现多NVMe设备共享一、编译、安装spdk 1.1、下载 1.1.1 下载spdk源码首先，我们需要从GitHub上克隆SPDK的源码仓库。打开终端，输入以下命令： git clone -b v22.01 https://github.com/spdk/spdk.git cd spdk1.1.2…...

编程日记 2025/7/31 19:37:14

Go语言的逃逸分析是怎么进行的

💝💝💝欢迎来到我的博客，很高兴能够在这里和您见面！希望您在这里可以感受到一份轻松愉快的氛围，不仅可以获得有趣的内容和知识，也可以畅所欲言、分享您的想法和见解。非常期待和您一起在这个小…...

编程日记 2025/7/31 19:37:13

纯净IP，跨境账号稳定的底层逻辑

在跨境业务快速扩张的背景下，越来越多的卖家、营销人、数据团队都开始使用代理IP来实现全球网络触达。然而，账号封禁问题始终如影随形，而背后的一个“隐性元凶”常常被忽视——纯净IP的缺失。本文将从实战角度出发，带你深入了解什…...

编程日记 2025/7/31 19:37:10

编译日志：关于编译opencv带有ffmpeg视频解码支持的若干办法

编译日志：关于编译opencv带有ffmpeg视频解码支持的若干办法前言笔者这里是封装了简单的OpenCV视频播放抽象，然后却发现移植到Ubuntu和开发板上都罢工的事情，原来是Windows平台下我们是默认下载了ffmpeg的库的，但是在泛Linu…...

编程日记 2025/7/31 19:37:08

djinn: 3靶场渗透

djinn: 3 来自 <https://www.vulnhub.com/entry/djinn-3,492/> 1，将两台虚拟机网络连接都改为NAT模式 2，攻击机上做namp局域网扫描发现靶机 nmap -sn 192.168.23.0/24 那么攻击机IP为192.168.23.182，靶场IP192.168.23.243 3&#xff0…...

编程日记 2025/7/31 19:37:06

WHAT - 简单服务发现

文章目录简单理解举个例子简单服务发现方式1. 静态配置（最简单，但不灵活）2. DNS 发现3. 使用服务注册中心（稍高级） 总结 “简单服务发现”（Simple Service Discovery）通常指的是一种让系统中的…...

编程日记 2025/7/31 19:37:04

Webpack

基本使用

核心概念

处理样式资源

步骤：

处理图片资源

修改图片输出文件目录

自动清空上次打包的内容

Eslint

Babel

处理HTML资源

搭建开发服务器

生产模式

提取css文件为单独文件

问题：

Css压缩

HTML压缩

小结1

高级

SourceMap

开发模式

生产模式

HMR

OneOf

Include/Exclude

Cache

Thead

Tree Shaking

Babel

压缩图片

Code Split

多入口

按需加载

Preload / Prefetch

Core-js

PWA

总结

相关文章：