八股文 (一)
文章目录
- 项目地址
- 一、前端
- 1.1 大文件上传,预览
- 1.2 首页性能优化
- 1.2 流量染色,灰度发布
- 1.3 Websock心跳机制,大数据实时数据优化
- 1.4 Gpu 加速 fps优化
- 1.5 echarts包大小优化和组件封装
- 1.6 前端监控系统
- 1.7 超大虚拟列表卡顿
- 1. 实现
- 2. 相关问题
- (1) 什么是虚拟化列表,为什么要使用它?
- (2) 如何计算每一行的高度和可见行数的?
- (3) 如何保证滚动事件的性能的?当用户快速滚动时
- (4) 如何处理边界情况,比如滚动到顶部或底部?
- 1.8 图片懒加载,懒加载占位符,canvas对上传图片压缩
- 1.9 监控工具
- 1.10 代码体积
- 1.11 拖拽式报表,动态报表
- 1.12 团队基建
- 1.13 首屏性能优化
- 二、后端
- 2.1 大数据导出
- 2.2 分布式事务,事务
- 2.3 数据库主从 一致
- 2.4 间隙锁,分布式锁,乐观锁
项目地址
- 教程作者:
- 教程地址:
- 代码仓库地址:
- 所用到的框架和插件:
dbt
airflow
一、前端
1.1 大文件上传,预览
- 前端:①切文件;②判定切片是否完成上传完成;③断点、错误续传,记录已上传的切片位置,
- 后端:①收切片、存切片;②合并切片;③文件是否存在校验,服务端根据文件Hash值、文件名,校验该文件是否已经上传
前端:
- 常量设置切片大小
- 获取文件的hash值
- 进行切片,切片保存,含有:切片内容,切片索引,filehash,以及上传状态,并存储为一个数据
- 批量上传切片,并且限制并发数为6,并且使用递归上传,返回一个promise,并且更改切片的上传状态
- 当前成功上传的index/总长度 就可以获得文件上传进度
- 当所有文件上传完成,使用promise 调用后端开始合并,使用useState显示百分比
后端: - 创建文件同名的md5的临时文件夹,用来存放所有的切片
- 根据文件hash值和文件名,以及chunkindex进行合并,使用.net 的FileStream
1.2 首页性能优化
react性能优化的核心:减少rerender(重新渲染)
UI = render(state)
1.
1.2 流量染色,灰度发布
1.3 Websock心跳机制,大数据实时数据优化
1.4 Gpu 加速 fps优化
1.5 echarts包大小优化和组件封装
1.6 前端监控系统
- 异常:JS异常,接口异常,白屏异常,资源异常
- 性能数据:FC, FCP, DOM READY, DNS等&#x
相关文章:
八股文 (一)
文章目录 项目地址一、前端1.1 大文件上传,预览1.2 首页性能优化1.2 流量染色,灰度发布1.3 Websock心跳机制,大数据实时数据优化1.4 Gpu 加速 fps优化1.5 echarts包大小优化和组件封装1.6 前端监控系统1.7 超大虚拟列表卡顿1. 实现2. 相关问题(1) 什么是虚拟化列表,为什么要…...
c语言无符号的变量不能和有符号的直接比较,或者使用移项解决符号问题
使用移项解决问题,简单来说就是无符号运行不要有减号,使用移项后的加号代替 if(uEventDirLimitSize > uEventAndNormalDirSize) {if((uEventDirLimitSize - uEventAndNormalDirSize) > pStConfig->stParam.stUserParam.uEventRemain){return O…...
安卓日常问题杂谈(一)
背景 关于安卓开发中,有很多奇奇怪怪的问题,有时候这个控件闪一下,有时候这个页面移动一下,这些对于快速开发中,去查询,都是很耗费时间的,因此,本系列文章,旨在记录安卓…...
电力晶体管(GTR)全控性器件
电力晶体管(Giant Transistor,GTR)是一种全控性器件,以下是关于它的详细介绍:(模电普通晶体管三极管进行对比学习) 基本概念 GTR是一种耐高电压、大电流的双极结型晶体管(BJT&am…...
【美】Day 1 CPT申请步骤及信息获取指南(Day1 CPT)
参考文章:【美】境外申请Day 1 CPT完整流程(境外Day 1 CPT) 文章目录 **一、申请前准备:了解Day 1 CPT基本要求****二、选择Day 1 CPT学校****1. 搜索学校****2. 筛选标准** **三、申请流程****1. 提交学校申请****2. 转SEVIS记录…...
梯度下降优化算法-动量法
1. 动量法的数学原理 1.1 标准梯度下降回顾 在标准梯度下降中,参数的更新公式为: θ t 1 θ t − η ⋅ ∇ θ J ( θ t ) \theta_{t1} \theta_t - \eta \cdot \nabla_\theta J(\theta_t) θt1θt−η⋅∇θJ(θt) 其中: θ t …...
游戏引擎介绍:Game Engine
简介 定义:软件框架,一系列为开发游戏的工具的集合 可协作创意生产工具,复杂性艺术,注重realtime实时 目的 为艺术家,设计师,程序员设计工具链 游戏引擎开发参考书 推荐:Game Engine Archite…...
zookeeper-3.8.3-基于ACL的访问控制
ZooKeeper基于ACL的访问控制 ZooKeeper 用ACL控制对znode的访问,类似UNIX文件权限,但无znode所有者概念,ACL指定ID及对应权限,且仅作用于特定znode,不递归。 ZooKeeper支持可插拔认证方案,ID格式为scheme…...
ResNeSt: Split-Attention Networks 参考论文
参考文献 [1] Tensorflow Efficientnet. https://github.com/tensorflow/tpu/tree/master/models/official/efficientnet. Accessed: 2020-03-04. 中文翻译:[1] TensorFlow EfficientNet. https://github.com/tensorflow/tpu/tree/master/models/official/efficien…...
正反转电路梯形图
1、正转联锁控制。按下正转按钮SB1→梯形图程序中的正转触点X000闭合→线圈Y000得电→Y000自锁触点闭合,Y000联锁触点断开,Y0端子与COM端子间的内部硬触点闭合→Y000自锁触点闭合,使线圈Y000在X000触点断开后仍可得电。 Y000联锁触点断开&…...
【数据结构】空间复杂度
目录 一、引入空间复杂度的原因 二、空间复杂度的分析 ❥ 2.1 程序运行时内存大小 ~ 程序本身大小 ❥ 2.2 程序运行时内存大小 ~ 算法运行时内存大小 ❥ 2.3 算法运行时内存大小 ❥ 2.4 不考虑算法全部运行空间的原因 三、空间复杂度 ❥ 3.1空间复杂度的定义 ❥ 3.2 空…...
系统学英语 — 句法 — 复合句
目录 文章目录 目录复合句型主语从句宾语从句表语从句定语从句状语从句同位语从句 复合句型 复合句型,即:从句。在英语中,除了谓语之外的所有句子成分都可以使用从句来充当。 主语从句 充当主语的句子,通常位于谓语之前&#x…...
SQL server 数据库使用整理
标题:SQL server 数据库使用整理 1.字符串表名多次查询 2.读取SQL中Json字段中的值:JSON_VALUE(最新版本支持,属性名大小写敏感) 1.字符串表名多次查询 SELECT ROW_NUMBER() OVER (ORDER BY value ASC) rowid,value…...
*胡闹厨房*
前期准备 详细教程 一、创建项目 1、选择Universal 3D,创建项目 2、删除预制文件Readme:点击Remove Readme Assets,弹出框上点击Proceed 3、Edit-Project Setting-Quality,只保留High Fidelity 4、打开 Assets-Settings ,保留URP-HighFidelity-Renderer 和 URP-High…...
.NET 8 项目 Docker 方式部署到 Linux 系统详细操作步骤
本文将详细介绍如何将一个 .NET 8 项目通过 Docker 部署到 Linux 系统中。以下步骤包括从项目的创建、Dockerfile 的编写、镜像构建、到最后在 Linux 上的容器运行。 1. 环境准备 在开始之前,请确保你已经具备以下环境: Linux 系统(如 Ubu…...
状态码对照表
别瞎自定义状态码了 1xx:信息性状态码 状态码名称使用场景100Continue客户端应继续请求,等待后续响应。101Switching Protocols服务器根据客户端的请求切换协议。102Processing服务器正在处理请求,但尚未完成。103Early Hints提供给客户端的…...
【愚公系列】《循序渐进Vue.js 3.x前端开发实践》027-组件的高级配置和嵌套
标题详情作者简介愚公搬代码头衔华为云特约编辑,华为云云享专家,华为开发者专家,华为产品云测专家,CSDN博客专家,CSDN商业化专家,阿里云专家博主,阿里云签约作者,腾讯云优秀博主,腾讯云内容共创官,掘金优秀博主,亚马逊技领云博主,51CTO博客专家等。近期荣誉2022年度…...
Autosar-Os是怎么运行的?(多核系统运行)
写在前面: 入行一段时间了,基于个人理解整理一些东西,如有错误,欢迎各位大佬评论区指正!!! 目录 1.Autosar多核操作系统 1.1多核启动过程 1.2多核运行过程 1.2.1核间任务同步 1.2.2Counte…...
WPF3-在xaml中引用其他程序集的名称空间
1. 如何在XAML里引用类库中的名称空间和类2. 小结 1. 如何在XAML里引用类库中的名称空间和类 首先需要记住一点:把类库引用到项目中是引用其中名称空间的物理基础,无论是C#还是XAML都是这样。 一旦将一个类库引用进程序,就可以引用其中的名…...
无人机红外热成像:应急消防的“透视眼”
无人机红外热成像:应急消防的“透视眼” 亲爱的小伙伴们,每年一到夏天,应急消防的战士们就像上紧了发条的闹钟,时刻准备应对各种灾害。炎热天气让火灾隐患“蹭蹭”往上涨,南北各地还有防洪救灾、台风、泥石流等灾害轮…...
飞牛NAS安装过程中的docker源问题
采用CloudFlare进行飞牛NAS的远程访问 【安全免费】无需公网IP、端口号,NAS外网访问新方法_网络存储_什么值得买 sudo mkdir -p /etc/docker sudo tee /etc/docker/daemon.json <<EOF {"registry-mirrors": ["https://docker.1panel.dev&quo…...
python基础语法(4) ----- 学习笔记分享
目录 Python 使用库 以及 实战的一些案例 1. 标准库 1.1 认识标准库 1.2 使用import导入模块 1.3 代码示例:日期及结算 1.4 代码示例:字符串操作 1.5 代码示例 : 文件查找工具 2. 第三方库 2.1 认识第三方库 2.2 使用pip 2.3 代码示例:生成二维码 (1) 使用搜索引擎,…...
Linux 内核学习 3b - 和copilot 讨论pci设备的物理地址在内核空间和用户空间映射到虚拟地址的区别
前提知识: 可以把内核当作一个需要特殊权限运行的程序,那么不同的程序,相同的设备物理地址就会映射到不同的虚拟地址 (见Linux 内核学习 3 - 虚拟内存和物理内存)。 You said 同一个pcie 设备物理地址在linux 内核和用…...
算法【有依赖的背包】
有依赖的背包是指多个物品变成一个复合物品(互斥),每件复合物品不要和怎么要多种可能性展开。时间复杂度O(物品个数 * 背包容量),额外空间复杂度O(背包容量)。 下面通过题目加深理解。 题目一 测试链接:[NOIP2006 提…...
【Linux】 冯诺依曼体系与计算机系统架构全解
Linux相关知识点可以通过点击以下链接进行学习一起加油!初识指令指令进阶权限管理yum包管理与vim编辑器GCC/G编译器make与Makefile自动化构建GDB调试器与Git版本控制工具Linux下进度条 冯诺依曼体系是现代计算机设计的基石,其统一存储和顺序执行理念推动…...
【深度学习】 UNet详解
UNet 是一种经典的卷积神经网络(Convolutional Neural Network, CNN)架构,专为生物医学图像分割任务设计。该模型于 2015 年由 Olaf Ronneberger 等人在论文《U-Net: Convolutional Networks for Biomedical Image Segmentation》中首次提出&…...
“深入浅出”系列之算法篇:(2)openCV、openMV、openGL
OpenCV是一个的跨平台计算机视觉库,可以运行在Linux囚、Windows 和Mac OS操作系统上。它轻量级而且高效,由一系列 C函数和少量C类构成,同时也提供了Python 接口,实现了图像处理和计算机视觉方面的很多通用算法。 OpenMV是一个开源,低成本&am…...
低代码系统-产品架构案例介绍、得帆云(八)
产品名称 得帆云DeCode低代码平台-私有化 得帆云DeMDM主数据管理平台 得帆云DeCode低代码平台-公有云 得帆云DePortal企业门户 得帆云DeFusion融合集成平台 得帆云DeHoop数据中台 名词 概念 云原生 指自己搭建的运维平台,区别于阿里云、腾讯云 Dehoop 指…...
web3py+flask+ganache的智能合约教育平台
最近在学习web3的接口文档,使用web3pyflaskganache写了一个简易的智能合约教育平台,语言用的是python,ganche直接使用的本地区块链网络,用web3py进行交互。 代码逻辑不难,可以私信或者到我的闲鱼号夏沫mds获取我的代码…...
(长期更新)《零基础入门 ArcGIS(ArcMap) 》实验六----流域综合处理(超超超详细!!!)
流域综合处理 流域综合治理是根据流域自然和社会经济状况及区域国民经济发展的要求,以流域水流失治理为中心,以提高生态经济效益和社会经济持续发展为目标,以基本农田优化结构和高效利用及植被建设为重点,建立具有水土保持兼高效生态经济功能的半山区流域综合治理模式。数字高程…...
基于 WPF 平台使用纯 C# 实现动态处理 json 字符串
一、引言 在当今的软件开发领域,数据的交换与存储变得愈发频繁,JSON(JavaScript Object Notation)作为一种轻量级的数据交换格式,以其简洁、易读、便于解析和生成的特点,被广泛应用于各种应用程序中。在 W…...
DRF开发避坑指南01
在当今快速发展的Web开发领域,Django REST Framework(DRF)以其强大的功能和灵活性成为了众多开发者的首选。然而,错误的使用方法不仅会导致项目进度延误,还可能影响性能和安全性。本文将从我个人本身遇到的相关坑来给大…...
WordPress免费证书插件
为了在您的网站上启用HTTPS,您可以使用本插件快速获取Let’s Encrypt免费证书。 主要功能: 支持快速申请Let’s Encrypt免费证书支持通配符证书申请,每个证书最多可以绑定100个域名支持自动续期证书支持重颁发证书,证书过期或失…...
MongoDB平替数据库对比
背景 项目一直是与实时在线监测相关,特点数据量大,读写操作大,所以选用的是MongoDB。但按趋势来讲,需要有一款国产数据库可替代,实现信创要求。选型对比如下 1. IoTDB 这款是由清华大学主导的开源时序数据库&#x…...
ANSYS学习笔记(十)网格质量的诊断和提高
网格质量的好坏不能单纯只看meshing给出的网格质量结果,要根据实际的计算物理场景来判断,需要求解的地方物理量大梯度的位置网格越密越好。 网格质量:在有限网格数量限制下,离散误差小的网格是好网格,是高质量网格。网…...
能量提升法三:赞美
前情回顾: 《能量提升法二:感恩》 片段:“感恩,就像是在跟世界说:谢谢你,我收到了,我很喜欢,请多来点” 把它归还人海,就当作每一个人,都有可能是曾经帮助…...
C++中函数返回值当引用
文章目录 一、概述二、返回值当引用的基本语法三、返回局部变量的引用四、返回引用的常见用途五、返回右值引用六、总结 一、概述 在 C 中,函数返回值当引用(即返回引用)是一个常见的编程技巧。它可以让你返回一个函数内部的局部变量或对象的…...
27. C语言 强制类型转换详解
本章目录: 前言强制类型转换(Type Casting)强制类型转换的语法示例1:将整数转换为浮点数输出结果: 代码解析: 整数提升(Integer Promotion)示例2:整数提升输出结果: 代码…...
Linux 命令之技巧(Tips for Linux Commands)
Linux 命令之技巧 简介 Linux 是一种免费使用和自由传播的类Unix操作系统,其内核由林纳斯本纳第克特托瓦兹(Linus Benedict Torvalds)于1991年10月5日首次发布。Linux继承了Unix以网络为核心的设计思想,是一个性能稳定的多用户…...
freeswitch在centos上编译过程
操作系统:centos9-last usr/local/freeswitch/bin/freeswitch -version FreeSWITCH version: 1.10.13-devgit~20250125T131725Z~3f1e4bf90a~64bit (git 3f1e4bf 2025-01-25 13:17:25Z 64bit)vi /etc/ssh/sshd_config ip a nmtui reboot ip a curl -o /etc/pki/rpm-…...
快速入门Flink
Flink是新一代实时计算平台,采用原生的流处理系统,保证了低延迟性,在API和容错上也是做的相当完善,本文将从架构、组件栈、安装、入门程序等进行基础知识的分析,帮助大家快速对Flink有一个了解。 一.简介 1.是什么 Ap…...
c++ list
1.构造函数 构造函数 // list<T> lst; // list(beg, end); // 区间构造 // list(n, elem); // 元素构造 // list(const list &lst); // 拷贝构造#include <iostream> #include <fstream> #include <string> #include <list> using name…...
Vue 3 + TypeScript 实现父子组件协同工作案例解析
引言 在现代的前端开发中,Vue.js 作为一款流行的渐进式 JavaScript 框架,为我们构建交互式用户界面提供了强大的支持。Vue 3 的推出带来了许多新特性,尤其是组合式 API 的引入,让代码的组织和复用更加灵活。同时,TypeS…...
深度剖析C++17中的std::optional:处理可能缺失值的利器
文章目录 一、基本概念与设计理念二、构建与初始化(一)默认构造(二)值初始化(三)使用std::make_optional(四)使用std::nullopt 三、访问值(一)value()&#x…...
【ArcGIS微课1000例】0141:提取多波段影像中的单个波段
文章目录 一、波段提取函数二、加载单波段导出问题描述:如下图所示,img格式的时序NDVI数据有24个波段。现在需要提取某一个波段,该怎样操作? 一、波段提取函数 首先加载多波段数据。点击【窗口】→【影像分析】。 选择需要处理的多波段影像,点击下方的【添加函数】。 在多…...
一分钟搭建promehteus+grafana+alertmanager监控平台
为什么要自己搭建一个监控平台 平时进行后端开发,特别是微服务的后端可开发,一定少不了对接监控平台,但是平时进行一些小功能的测试又没有必要每次都手动安装那么多软件进行一个小功能的测试,这里我使用docker-compose搭建了一个…...
Transfoemr的解码器(Decoder)与分词技术
在自然语言处理(NLP)领域,解码器(Decoder)和分词技术是两个至关重要的概念。解码器是序列生成任务的核心组件,而分词则是将文本数据转换为可处理形式的基础步骤。 一、解码器(Decoder&…...
LeetCode100之在排序数组中查找元素的第一个和最后一个位置(34)--Java
1.问题描述 给你一个按照非递减顺序排列的整数数组 nums,和一个目标值 target。请你找出给定目标值在数组中的开始位置和结束位置。 如果数组中不存在目标值 target,返回 [-1, -1]。 你必须设计并实现时间复杂度为 O(log n) 的算法解决此问题 示例1 输入…...
数字人+展厅应用方案:开启全新沉浸式游览体验
随着人们生活质量的不断提升,对于美好体验的追求日益增长。在展厅展馆领域,传统的展示方式已难以满足大众日益多样化的需求。而通过将数字人与展厅进行深度结合,可以打造数字化、智能化新型展厅,不仅能提升展示效果,还…...
echo ‘export PATH=/usr/local/bin:$PATH‘ >> ~/.bashrc这个和直接添加到/etc/profile有什么区别
echo export PATH/usr/local/bin:$PATH >> ~/.bashrc 和直接添加到 /etc/profile 都是用于修改 PATH 环境变量,但它们适用的范围和效果有所不同: 1. 修改 ~/.bashrc 文件 作用范围:~/.bashrc 是针对当前用户的配置文件,它…...