微前端框架 qiankun
前言
qiankun是一个基于single-spa的微前端实现库,帮助你构建一个生产可用的微前端架构系统。qiankun支持多种技术栈的微应用接入,提供了简单、解耦、技术栈无关、独立开发、独立运行、增量升级、样式隔离、资源预加载等特性,以及umi插件一键切换。
微前端是一种多个团队通过独立发布功能的方式来共同构建现代化web应用的技术手段及方法策略。微前端架构具备以下几个核心价值:
- 技术栈无关:主框架不限制接入应用的技术栈,微应用具备完全自主权
- 独立开发、独立部署:微应用仓库独立,前后端可独立开发,部署完成后主框架自动完成同步更新
- 增量升级:在面对各种复杂场景时,我们通常很难对一个已经存在的系统做全量的技术栈升级或重构,而微前端是一种非常好的实施渐进式重构的手段和策略
- 独立运行时:每个微应用之间状态隔离,运行时状态不共享
qiankun的优点有:
- 基于single-spa封装,提供了更加开箱即用的API
- HTML Entry接入方式,让你接入微应用像使用iframe一样简单
- 样式隔离,确保微应用之间样式互相不干扰
- JS沙箱,确保微应用之间全局变量/事件不冲突
- 资源预加载,在浏览器空闲时间预加载未打开的微应用资源,加速微应用打开速度
- umi插件,提供了@umijs/plugin-qiankun供umi应用一键切换成微前端架构系统
qiankun的缺点有:
- 需要主应用提供一些生命周期钩子,以便qiankun能够正确地加载和卸载微应用
- 需要微应用遵循一些约定,如导出生命周期函数,不污染全局变量,使用正确的publicPath等
- 需要处理好微应用之间的通信和依赖,避免出现耦合和冲突的情况
- 需要考虑浏览器的兼容性和性能问题,尤其是在使用沙箱和预加载功能时
相关文章:
微前端框架 qiankun
前言 qiankun是一个基于single-spa的微前端实现库,帮助你构建一个生产可用的微前端架构系统。qiankun支持多种技术栈的微应用接入,提供了简单、解耦、技术栈无关、独立开发、独立运行、增量升级、样式隔离、资源预加载等特性,以及umi插件一键…...
降序子数组最大和算法分析
题目描述: Description 给你一个正整数组成的数组 nums ,返回 nums 中一个 降序 子数组的最大可能元素和。子数组是数组中的一个连续数字序列。 已知子数组[numsl,numsl1,...,numsr−1,numsr],若对所有 i(l < i <…...
Kafka常见面试题
如何防止消息丢失? 发送端:ack设置为-1或副本数,默认副本全部同步才会认为发送成功 接收端:对接收到的数据进行备份,定期进行检查对执行失败的数据重新执行;选择手动提交offset,对执行失败的数据…...
rman SBT_TAPE NFS disk 模拟NBU带库 FRA
-----------------rman 将本地磁盘变成磁带----------------------------------- ##RAC 本地 /nfs----两个备份策略 clustern run { allocate channel ch00 device type SBT_TAPE PARMS"SBT_LIBRARYoracle.disksbt, ENV(BACKUP_DIR/nfs)"; backup recove…...
物理世界中的等距3D对抗样本
论文题目:Isometric 3D Adversarial Examples in the Physical World 会议:NIPS 2022 点云: 点云——表达目标空间分布和目标表面特性的海量点集合,点包含xyz坐标信息 能够包含颜色等其他信息 使用顶点、边和面的数据表征的三维…...
解决vue3项目打包发布到服务器后访问页面显示空白问题
1.在 vite.config.ts 文件中 加入 base:./ 当你将 base 设置为 / 时,它表示你的应用程序将部署在服务器的根路径上,(将 base 设置为 / 表示你的应用程序部署在服务器的根路径上,并且 Vite 会相应地处理资源和路由的路径…...
什么是SMTP服务器?如何配置?
SMTP服务器是一种专门用于发送电子邮件的互联网服务器。SMTP(Simple Mail Transfer Protocol,简单邮件传输协议)是一种用于电子邮件传输的标准互联网协议。这些服务器充当电子邮件的“邮递员”,负责将发出的邮件从发送者传输到接收…...
el-tabel实现拖拽排序
1、使用npm安装sortableJs插件 npm install sortablejs --save2、在需要使用的页面进行引入 import Sortable from sortablejs3、表格拖拽排序完整代码 <template><div class"home"><el-table :data"tableData" style"width: 100%&…...
设计模式-结构型模式之适配器设计模式
文章目录 一、结构型设计模式二、适配器模式 一、结构型设计模式 这篇文章我们来讲解下结构型设计模式,结构型设计模式,主要处理类或对象的组合关系,为如何设计类以形成更大的结构提供指南。 结构型设计模式包括:适配器模式&…...
Android 中的权限
关于作者:CSDN内容合伙人、技术专家, 从零开始做日活千万级APP。 专注于分享各领域原创系列文章 ,擅长java后端、移动开发、商业变现、人工智能等,希望大家多多支持。 目录 一、导读二、概览三、权限分类3.1 安装时权限3.2 运行时…...
【java智慧工地源码】智慧工地物联网云平台,实现现场各类工况数据采集、存储、分析与应用
“智慧工地整体方案”以智慧工地物联网云平台为核心,基于智慧工地物联网云平台与现场多个子系统的互联,实现现场各类工况数据采集、存储、分析与应用。通过接入智慧工地物联网云平台的多个子系统板块,根据现场管理实际需求灵活组合࿰…...
oracle 19c rac 安装手册
oracle 19c rac 安装手册 官方文档:https://docs.oracle.com/en/database/oracle/oracle-database/19/index.html 一、集群规划 再部署集群之前,需要对网络和存储两个方面进行规划。下面简述了网络和存储两个方面需要注意的地方。 Oracle RAC 数据库私有网络通信必须使用单…...
sqlMap
url:https://sqlmap.org/ git:https://github.com/sqlmapproject/sqlmap.git git中文:https://github.com/sqlmapproject/sqlmap/blob/master/doc/translations/README-zh-CN.md use url:https://github.com/sqlmapproject/sqlmap…...
蓝桥杯每日一题2023.12.2
题目描述 蓝桥杯大赛历届真题 - C 语言 B 组 - 蓝桥云课 (lanqiao.cn) 题目分析 答案:3598180 由题目分析可以知道,给小明发的牌一共有13种类型,每种类型的牌一共有四张。对于每种牌,我们都有5种选择,不拿、拿一张、…...
【计算机网络学习之路】序列化,反序列化和初识协议
文章目录 前言一. 序列化和反序列化1.自己实现2. JSON 二. 初识协议结束语 前言 本系列文章是计算机网络学习的笔记,欢迎大佬们阅读,纠错,分享相关知识。希望可以与你共同进步。 本篇博文正式开始应用层的学习,首先讲解应用层的…...
亚马逊云科技推出新一代自研芯片
北京——2023 年12月1日 亚马逊云科技在2023 re:Invent全球大会上宣布其自研芯片家族的两个系列推出新一代,包括Amazon Graviton4和Amazon Trainium2,为机器学习(ML)训练和生成式人工智能(AI)应用等广泛的工…...
VIT总结
关于transformer、VIT和Swin T的总结 1.transformer 1.1.注意力机制 An attention function can be described as mapping a query and a set of key-value pairs to an output, where the query, keys, values, and output are all vectors. The output is computed as a wei…...
C++11——initializer_list
initializer_list的简介 initializer_list是C11新出的一个类型,正如类型的简介所说,initializer_list一般用于作为构造函数的参数,来让我们更方便赋值 但是光看这些,我们还是不知道initializer_list到底是个什么类型,…...
数学字体 Mathematical fonts
Mathematical fonts 数学字体: ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyzRQSZ \\ \mathcal{ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyzRQSZ} \\ \mathfrak{ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyzRQSZ} \\ \mathbb{ABC…...
Python简单模拟蓝牙车钥匙协议
本文设计一个简单的蓝牙车钥匙协议,协议包含DH密钥协商和基于RSA的身份认证功能,以及防重放与消息完整性验证。 1. 密钥协商过程: - 设定 DH 参数:素数 p 和生成元 g。 - 发送方(Alice)生成 DH 的私钥 a 并计算公钥 A…...
label-studio的使用教程(导入本地路径)
文章目录 1. 准备环境2. 脚本启动2.1 Windows2.2 Linux 3. 安装label-studio机器学习后端3.1 pip安装(推荐)3.2 GitHub仓库安装 4. 后端配置4.1 yolo环境4.2 引入后端模型4.3 修改脚本4.4 启动后端 5. 标注工程5.1 创建工程5.2 配置图片路径5.3 配置工程类型标签5.4 配置模型5.…...
day52 ResNet18 CBAM
在深度学习的旅程中,我们不断探索如何提升模型的性能。今天,我将分享我在 ResNet18 模型中插入 CBAM(Convolutional Block Attention Module)模块,并采用分阶段微调策略的实践过程。通过这个过程,我不仅提升…...
渗透实战PortSwigger靶场-XSS Lab 14:大多数标签和属性被阻止
<script>标签被拦截 我们需要把全部可用的 tag 和 event 进行暴力破解 XSS cheat sheet: https://portswigger.net/web-security/cross-site-scripting/cheat-sheet 通过爆破发现body可以用 再把全部 events 放进去爆破 这些 event 全部可用 <body onres…...
从零开始打造 OpenSTLinux 6.6 Yocto 系统(基于STM32CubeMX)(九)
设备树移植 和uboot设备树修改的内容同步到kernel将设备树stm32mp157d-stm32mp157daa1-mx.dts复制到内核源码目录下 源码修改及编译 修改arch/arm/boot/dts/st/Makefile,新增设备树编译 stm32mp157f-ev1-m4-examples.dtb \stm32mp157d-stm32mp157daa1-mx.dtb修改…...
sqlserver 根据指定字符 解析拼接字符串
DECLARE LotNo NVARCHAR(50)A,B,C DECLARE xml XML ( SELECT <x> REPLACE(LotNo, ,, </x><x>) </x> ) DECLARE ErrorCode NVARCHAR(50) -- 提取 XML 中的值 SELECT value x.value(., VARCHAR(MAX))…...
GitHub 趋势日报 (2025年06月08日)
📊 由 TrendForge 系统生成 | 🌐 https://trendforge.devlive.org/ 🌐 本日报中的项目描述已自动翻译为中文 📈 今日获星趋势图 今日获星趋势图 884 cognee 566 dify 414 HumanSystemOptimization 414 omni-tools 321 note-gen …...
PAN/FPN
import torch import torch.nn as nn import torch.nn.functional as F import mathclass LowResQueryHighResKVAttention(nn.Module):"""方案 1: 低分辨率特征 (Query) 查询高分辨率特征 (Key, Value).输出分辨率与低分辨率输入相同。"""def __…...
比较数据迁移后MySQL数据库和OceanBase数据仓库中的表
设计一个MySQL数据库和OceanBase数据仓库的表数据比较的详细程序流程,两张表是相同的结构,都有整型主键id字段,需要每次从数据库分批取得2000条数据,用于比较,比较操作的同时可以再取2000条数据,等上一次比较完成之后,开始比较,直到比较完所有的数据。比较操作需要比较…...
加密通信 + 行为分析:运营商行业安全防御体系重构
在数字经济蓬勃发展的时代,运营商作为信息通信网络的核心枢纽,承载着海量用户数据与关键业务传输,其安全防御体系的可靠性直接关乎国家安全、社会稳定与企业发展。随着网络攻击手段的不断升级,传统安全防护体系逐渐暴露出局限性&a…...
结构化文件管理实战:实现目录自动创建与归类
手动操作容易因疲劳或疏忽导致命名错误、路径混乱等问题,进而引发后续程序异常。使用工具进行标准化操作,能有效降低出错概率。 需要快速整理大量文件的技术用户而言,这款工具提供了一种轻便高效的解决方案。程序体积仅有 156KB,…...
