八股文 (一)
文章目录
- 项目地址
- 一、前端
- 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) 什么是虚拟化列表,为什么要…...
TVM调度原语完全指南:从入门到微架构级优化
调度原语 在TVM的抽象体系中,调度(Schedule)是对计算过程的时空重塑。每一个原语都是改变计算次序、数据流向或并行策略的手术刀。其核心作用可归纳为: 优化目标 max ( 计算密度 内存延迟 指令开销 ) \text{优化目标} \max…...
c语言进阶(简单的函数 数组 指针 预处理 文件 结构体)
c语言补充 格式 void函数头 {} 中的是函数体 sum函数名 () 参数表 #include <stdio.h>void sum(int begin, int end) {int i;int sum 0;for (i begin ; i < end ; i) {sum i;}printf("%d到%d的和是%d\n", begin, end, sum); …...
终极版已激活!绿话纯净,打开即用!!!
今天我想和大家聊聊一个非常实用的工具——视频转换大师最终版。 视频转换大师终极版,堪称一款全能型的视频制作神器,集视频转换与编辑功能于一体。它搭载的视频增强器技术,能够最大限度地保留原始视频质量,甚至还能实现质量的进…...
Vue.js 什么是 Composition API?
Vue.js 什么是 Composition API? 今天我们来聊聊 Vue 3 引入的一个重要特性:组合式 API(Composition API)。如果你曾在开发复杂的 Vue 组件时感到代码难以维护,那么组合式 API 可能正是你需要的工具。 什么是组合式 …...
MySQL高可用
一、mysql路由 1.利用路由器的连接路由特性,用户可以编写应用程序来连接到路由器,并令路由器使用响应的路由策略来处理连接来使其连接到正确的mysql数据库服务器 2.mysql route的部署方式 需要在所有数据库主机之外再打开一台主机mysql-router 配置mysql…...
30.Word:设计并制作新年贺卡以及标签【30】
目录 NO1.2 NO3邮件合并-信函 NO4邮件合并-标签 NO1.2 另存为/F12:考生文件夹:Word.docx布局→页面设置对话框→页边距:上下左右→纸张:宽度/高度(先调页边距🆗)设计→页面颜色→填充效果→…...
Flink2支持提交StreamGraph到Flink集群
最近研究Flink源码的时候,发现Flink已经支持提交StreamGraph到集群了,替换掉了原来的提交JobGraph。 新增ExecutionPlan接口,将JobGraph和StreamGraph作为实现。 Flink集群Dispatcher也进行了修改,从JobGraph改成了接口Executio…...
大模型本地化部署(Ollama + Open-WebUI)
文章目录 环境准备下载Ollama模型下载下载Open-WebUI 本地化部署的Web图形化界面本地模型联网查询安装 Docker安装 SearXNG本地模型联网查询 环境准备 下载Ollama 下载地址:Ollama网址 安装完成后,命令行里执行命令 ollama -v查看是否安装成功。安装成…...
C++哈希(链地址法)(二)详解
文章目录 1.开放地址法1.1key不能取模的问题1.1.1将字符串转为整型1.1.2将日期类转为整型 2.哈希函数2.1乘法散列法(了解)2.2全域散列法(了解) 3.处理哈希冲突3.1线性探测(挨着找)3.2二次探测(跳…...
IME关于输入法横屏全屏显示问题-Android14
IME关于输入法横屏全屏显示问题-Android14 1、输入法全屏模式updateFullscreenMode1.1 全屏模式判断1.2 全屏模式布局设置 2、应用侧关闭输入法全屏模式2.1 调用输入法的应用设置flag2.2 继承InputMethodService.java的输入法应用覆盖onEvaluateFullscreenMode方法 InputMethod…...
网络工程师 (11)软件生命周期与开发模型
一、软件生命周期 前言 软件生命周期,也称为软件开发周期或软件开发生命周期,是指从软件项目的启动到软件不再被使用为止的整个期间。这个过程可以细分为多个阶段,每个阶段都有其特定的目标、任务和产出物。 1. 问题定义与需求分析 问题定义…...
【人工智能】基于Python的机器翻译系统,从RNN到Transformer的演进与实现
《Python OpenCV从菜鸟到高手》带你进入图像处理与计算机视觉的大门! 解锁Python编程的无限可能:《奇妙的Python》带你漫游代码世界 机器翻译(Machine Translation, MT)作为自然语言处理领域的重要应用之一,近年来受到了广泛的关注。在本篇文章中,我们将详细探讨如何使…...
网络工程师 (12)软件开发与测试
一、软件设计 (一)定义与目的 软件设计是从软件需求出发,设计软件的整体结构、功能模块、实现算法及编写代码的过程,旨在确定系统如何完成预定任务。其目标是确保目标系统能够抽象、普遍地完成预定任务,并为后续的软件…...
3.Spring-事务
一、隔离级别: 脏读: 一个事务访问到另外一个事务未提交的数据。 不可重复读: 事务内多次查询相同条件返回的结果不同。 幻读: 一个事务在前后两次查询同一个范围的时候,后一次查询看到了前一次查询没有看到的行。 二…...
Python字典详解:从入门到实践
Python字典详解:从入门到实践 字典(Dictionary)是Python中最重要且最常用的数据结构之一。本文将深入讲解字典的特性、操作方法和实际应用案例。 1. 字典简介 字典是可变的、无序的键值对集合,使用{}创建。每个元素由key: valu…...
91,【7】 攻防世界 web fileclude
进入靶场 <?php // 包含 flag.php 文件 include("flag.php");// 以高亮语法显示当前文件(即包含这段代码的 PHP 文件)的内容 // 方便查看当前代码结构和逻辑,常用于调试或给解题者提示代码信息 highlight_file(__FILE__);// 检…...
41【文件名的编码规则】
我们在学习的过程中,写出数据或读取数据时需要考虑编码类型 火山采用:UTF-16 易语言采用:GBK php采用:UTF-8 那么我们写出的文件名应该是何种编码的?比如火山程序向本地写出一个“测试.txt”,理论上这个“测…...
蓝桥杯备赛经验帖
蓝桥杯备赛经验帖 作者:blue 时间:2025.2.1 文章目录 蓝桥杯备赛经验帖1.为什么有这篇文章2.赛制3.比赛流程4.如何准备5.其他建议6.一些感悟 1.为什么有这篇文章 笔者近期发现,观看我写的两道第十五届蓝桥杯题解的人数逐渐增多…...
一文大白话讲清楚webpack基本使用——17——Tree Shaking
文章目录 一文大白话讲清楚webpack基本使用——17——Tree Shaking1. 建议按文章顺序从头看,一看到底,豁然开朗2. 啥叫Tree Shaking3. 什么是死代码,怎么来的3. Tree Shaking的流程3.1 标记3.2 利用Terser摇起来 4. 具体使用方式4.1 适用前提…...
conda相比python好处
Conda 作为 Python 的环境和包管理工具,相比原生 Python 生态(如 pip 虚拟环境)有许多独特优势,尤其在多项目管理、依赖处理和跨平台兼容性等方面表现更优。以下是 Conda 的核心好处: 一、一站式环境管理:…...
【杂谈】-递归进化:人工智能的自我改进与监管挑战
递归进化:人工智能的自我改进与监管挑战 文章目录 递归进化:人工智能的自我改进与监管挑战1、自我改进型人工智能的崛起2、人工智能如何挑战人类监管?3、确保人工智能受控的策略4、人类在人工智能发展中的角色5、平衡自主性与控制力6、总结与…...
Spark 之 入门讲解详细版(1)
1、简介 1.1 Spark简介 Spark是加州大学伯克利分校AMP实验室(Algorithms, Machines, and People Lab)开发通用内存并行计算框架。Spark在2013年6月进入Apache成为孵化项目,8个月后成为Apache顶级项目,速度之快足见过人之处&…...
Golang 面试经典题:map 的 key 可以是什么类型?哪些不可以?
Golang 面试经典题:map 的 key 可以是什么类型?哪些不可以? 在 Golang 的面试中,map 类型的使用是一个常见的考点,其中对 key 类型的合法性 是一道常被提及的基础却很容易被忽视的问题。本文将带你深入理解 Golang 中…...
中南大学无人机智能体的全面评估!BEDI:用于评估无人机上具身智能体的综合性基准测试
作者:Mingning Guo, Mengwei Wu, Jiarun He, Shaoxian Li, Haifeng Li, Chao Tao单位:中南大学地球科学与信息物理学院论文标题:BEDI: A Comprehensive Benchmark for Evaluating Embodied Agents on UAVs论文链接:https://arxiv.…...
大数据零基础学习day1之环境准备和大数据初步理解
学习大数据会使用到多台Linux服务器。 一、环境准备 1、VMware 基于VMware构建Linux虚拟机 是大数据从业者或者IT从业者的必备技能之一也是成本低廉的方案 所以VMware虚拟机方案是必须要学习的。 (1)设置网关 打开VMware虚拟机,点击编辑…...
定时器任务——若依源码分析
分析util包下面的工具类schedule utils: ScheduleUtils 是若依中用于与 Quartz 框架交互的工具类,封装了定时任务的 创建、更新、暂停、删除等核心逻辑。 createScheduleJob createScheduleJob 用于将任务注册到 Quartz,先构建任务的 JobD…...
Python爬虫(二):爬虫完整流程
爬虫完整流程详解(7大核心步骤实战技巧) 一、爬虫完整工作流程 以下是爬虫开发的完整流程,我将结合具体技术点和实战经验展开说明: 1. 目标分析与前期准备 网站技术分析: 使用浏览器开发者工具(F12&…...
WEB3全栈开发——面试专业技能点P2智能合约开发(Solidity)
一、Solidity合约开发 下面是 Solidity 合约开发 的概念、代码示例及讲解,适合用作学习或写简历项目背景说明。 🧠 一、概念简介:Solidity 合约开发 Solidity 是一种专门为 以太坊(Ethereum)平台编写智能合约的高级编…...
3-11单元格区域边界定位(End属性)学习笔记
返回一个Range 对象,只读。该对象代表包含源区域的区域上端下端左端右端的最后一个单元格。等同于按键 End 向上键(End(xlUp))、End向下键(End(xlDown))、End向左键(End(xlToLeft)End向右键(End(xlToRight)) 注意:它移动的位置必须是相连的有内容的单元格…...
