- 博客(1145)
- 资源 (1)
- 收藏
- 关注

原创 前端应用场景题目(待总结优化)
本文介绍了Promise在前端开发中的四种典型应用场景及实现方案: 并行请求数据(使用Promise.all实现多个接口并行请求并合并结果) 带重试机制的请求(通过递归实现请求失败自动重试) 并发请求限制(使用任务队列控制最大并发数) 图片懒加载(结合IntersectionObserver实现按需加载) 每种场景都提供了完整的代码实现和关键点解析,展示了Promise如何优雅解决异步编程问题,包括错误处理、并发控制和性能优化等实际开发需求。
2025-08-06 22:18:47
1119

原创 Javascript/ES6+/Typescript重点内容篇——手撕(待总结)
本文梳理了前端核心知识点Promise、原型链、生成器(Generator)和闭包的核心概念及面试题解析。Promise部分详解了状态机制和常用方法,并提供了Promise.all和串行执行的实现代码;原型链部分解释了原型继承原理,包含instanceof实现和输出题解析;生成器部分展示了如何用Generator处理异步操作;闭包部分则通过防抖函数实现演示了闭包的实际应用。这些内容涵盖了前端开发中的重要概念,适合面试准备和知识巩固。
2025-08-06 22:05:38
1184

原创 【最终】浏览器原理&GPU图形总结
本文深入解析了现代浏览器的进程架构和渲染机制。浏览器采用多进程模型,主进程、渲染进程、GPU进程等各司其职,确保安全性和稳定性。渲染过程遵循关键路径:解析HTML/CSS构建DOM和CSSOM树,合成渲染树后经历布局(计算几何属性)、绘制(填充像素)和合成(GPU加速展示)三个阶段。其中JS单线程设计避免了DOM操作冲突,而分层合成技术优化了动画性能。理解这一流程对前端性能优化具有重要意义。
2025-08-05 09:15:56
1062

原创 Next实习项目总结&串联讲解(一)
Next.js 面试要点摘要 Next.js 是基于 React 的 SSR/SSG 框架,支持 SEO 优化和高效渲染(SSR 实时生成、SSG 预渲染、ISR 增量更新)。核心考察点包括: 渲染机制:区分 SSR/SSG/ISR 的应用场景与性能差异; 路由系统:文件自动映射(如动态路由 [id].js)和 App Router 的嵌套布局; 组件模型:Server Component(无 JS 传输)与 Client Component(交互逻辑)的对比; 性能优化:next/dynamic 懒加载、
2025-07-31 21:30:45
1170

原创 【总结】LLM 对话框组件项目
本文介绍了AIGC时代基于对话框的交互系统设计与实现方案。系统采用分层架构集成DeepSeek等大模型API,通过OAuth2协议实现安全认证,并使用SSE协议支持流式数据传输。前端基于React+TS开发了可复用对话框组件,移动端采用React Native Expo跨平台框架实现85%代码复用。系统还展示了Agent搭建、Coze API集成等关键技术,并计划通过LangChain框架进一步扩展功能。通过模块化设计和标准化协议的应用,该系统实现了高效、安全的人机交互体验。
2025-06-15 13:27:24
1279
1

原创 [最全总结]城市灾害应急管理系统
在智慧城市战略背景下,项目面向内涝、团雾和火灾等灾害,开发了集灾害`模型集成模拟、场景可视化与应急预案管理`于一体的系统,系统各子模块进行软件功能测试,测试结果稳定可靠。
2025-06-07 17:34:29
897
1

原创 [总结]前端性能指标分析、性能监控与分析、Lighthouse性能评分分析
前端性能指标分析旨在评估网页在加载速度、交互响应和视觉稳定性等方面的表现。常见核心指标包括 LCP(最大内容绘制)、FID(首次输入延迟)和 CLS(累计布局偏移),用于衡量用户体验。性能监控则通过埋点、Web Vitals API 或 Performance API 实时采集数据,识别性能瓶颈。Lighthouse 是 Google 提供的开源工具,可自动评估页面性能、可访问性、SEO 等,生成详细评分和优化建议,帮助开发者持续改进前端质量。
2025-06-01 15:49:37
1618

原创 BPMNJS自定义功能_Palette|Renderer|ContextPad|PropertyPanelPropertyPanel
若你不想使用已有的并在⚠️ 确保该 CSS 文件被引入到页面或项目中。在 bpmn-js 中,自定义 Renderer 是实现流程图元素个性化渲染的关键方式。通过继承或,你可以自定义节点的外观、尺寸、颜色、图标等属性。以下是实现自定义 Renderer 的基本步骤:(腾讯云创建自定义 Renderer 类新建一个类继承自,并实现drawShape// 仅渲染特定类型的元素,例如任务节点rx: 10,ry: 10,});
2025-05-26 09:26:49
1107
1

原创 [项目总结篇]低代码——流程引擎:BPMNJS&Flowable工作流编辑器与引擎实现
本文介绍了一个支持多灾害模型集成的流程编排系统。针对各课题组编码标准不统一的问题,采用BPMN2国际规范,基于bpmn.js开发可视化流程编辑器,支持拖拽设计动态表单和模型流程。后端选用Flowable流程引擎,通过JSON Schema规则实现模型调用,并利用Python中间层解释执行。系统包含三大核心模块:1)流程编辑器,支持自定义属性面板和BPMN/SVG转换;2)流程引擎,提供模型编排与执行监控;3)布局引擎,实现可视化页面设计和组件交互。此外还集成地图开发模块,封装了基于百度SDK的业务地图渲染功
2025-05-24 12:26:01
1984
1

原创 [全网最全!!!从设计视角查看]BPMN.js流程编辑器底层设计原理
触发import.parse.complete。触发import.parse.start。ElementRegistry注册元素。一、核心类图(继承体系与模块依赖)一、类图(继承关系与核心模块)生成definitions对象。二、架构图(模块依赖关系)二、架构图(功能模块交互)触发import.done。BaseViewer初始化。绑定EventBus事件。BPMN-JS核心架构。Canvas渲染SVG。新增Palette工具。三、XML导入流程图。三、XML导入流程图。
2025-05-20 17:21:07
953

原创 [Vue内容梳理]响应式、虚拟DOM和Diff算法、模板编译、生命周期、实例方法、过滤器、指令和内置组件
在计算属性中直接修改可以吗?不可以会发出警告⚠,通过setter修改会触发响应式。
2025-05-16 09:55:04
1463

原创 流程编辑器Bpmn与LogicFlow学习
基于LogicFlow的可扩展架构,实现自定义节点、插件化开发,并结合BPMN 2.0规范适配器,确保流程数据与Camunda引擎兼容”。• 主导LogicFlow框架深度定制,开发20+符合BPMN规范的节点与连线,支持子流程嵌套、事件触发等复杂场景;• 设计LogicFlow自定义节点(如审批节点、网关节点)的View与Model层逻辑,解决复杂交互问题;• 开发BPMN XML与LogicFlow JSON的数据转换适配器,实现与后端流程引擎的无缝对接。
2025-05-15 14:21:56
965

原创 [推荐!前端性能优化全解]从首屏加载、动画卡顿、状态管理、视图管理和技术选型上分析性能
本文从网络层、资源压缩、缓存、代码拆分、资源加载优化、预渲染与预加载、浏览器渲染原理等多个方面,详细探讨了前端性能优化的策略与技术。网络层部分介绍了HTTP协议的迭代与优化,资源压缩则涵盖了构建时与部署时的压缩技术,缓存策略包括文件名哈希与HTTP缓存机制。代码拆分通过动态导入与公共模块提取优化加载效率,资源加载优化则通过预加载、关键CSS内联与异步JS加载提升首屏速度。预渲染与预加载技术进一步优化了页面跳转体验,而浏览器渲染原理则从解析、样式计算、布局、分层、绘制、合成与光栅化等环节深入剖析了渲染流程。
2025-05-14 20:48:47
1198

原创 0514得物、0509滴滴面试总结&复盘
目前最欠缺的还是,编码不是很熟,很多都遇到过但是就是写不出来,或者靠背先写一点,然后去加,加的过程没考虑逻辑是不是对的,用滴滴面试官的一句话,就是多刷多练多编码!而且编码总出错,目前编码顺利的就是滴滴一面,你熟悉,100%撕出来题目了!技术栈方面:得物面试要求技术栈为React+Typescript,这周先总结好各个数据结构和算法的Map思维导图,下周开始每日10题复盘刷+项目总结。今天是0514 ,距离秋招也就2个多月了,希望这两个多月,在编码和项目以及八股方面你有更加提升!Jinger,加油!
2025-05-14 18:59:21
889

原创 编译原理AST&以Babel为例进行解读、Webpack中自定义loader与plugin
编译原理:高级语言->机器(浏览器)能识别语言 | AST处理过程:1. 词法分析(Lexical Analysis)2.语法分析(Syntax Analysis)3.转换与优化4. 代码生成 | AST在前端应用:1. Vue的模板编译 2.ES6与Babel 3.其他工具链 4.Tree-shaking中的应用 |自定义Loader、Plugin:`Loader` 主要用于对模块的源代码进行转换处理(函数),而 `Plugin` 则用于扩展 Webpack 的打包能力与生命周期管理(类)
2025-05-12 21:19:28
1507

原创 个人网站versionI正式上线了!Personal Website for Jing Liu
本系统采用React+TypeScript为核心的前端工程化方案,集成TailwindCSS+Ant Design构建现代化UI体系,融合ECharts+Three.js+Canvas实现数据可视化与动态交互,并接入百度地图API拓展地理信息服务,形成技术栈完备、响应式的个人网站解决方案。
2025-05-07 16:02:58
1162

原创 前端亮点:大文件上传技术详解及问题解析
• 优化:通过Web Worker多线程计算,避免主线程阻塞(如5GB文件Hash计算可缩短至3.5秒)。• 原理:前端计算文件Hash后,请求服务端校验是否存在相同Hash文件,存在则直接返回URL。• 策略:限制并发数(通常6个并发,避免浏览器TCP连接限制),失败分片自动重试。• 服务端:记录分片Hash和位置(如Redis临时存储),合并时校验完整性。• 容错机制:指数退避重试策略(如首次1秒后重试,第二次2秒,第三次4秒)。• 逻辑:服务端按分片索引顺序合并文件,避免顺序错乱导致文件损坏。
2025-04-20 16:18:04
1330

原创 IntersectionObserver&滚动动画、懒加载、虚拟列表等应用场景&代码实现
IntersectionObserver到阈值时触发回调。• 交叉区域计算:浏览器内部自动计算目标元素与根元素的交集区域,无需开发者手动处理几何信息。• 浏览器级优化:由浏览器底层实现,自动优化计算逻辑,避免主线程阻塞。• 按需执行:元素进入视口时播放 CSS/JS 动画,离开时暂停。• 动态渲染:仅渲染可视区域内的列表项,减少 DOM 节点数量。• 精准监测:记录广告元素进入视口的时间与比例,用于计费分析。:当前是否与根元素交叉(最常用属性)。
2025-04-20 08:30:00
1288

原创 项目难点&亮点
若依项目的核心挑战在于如何高效整合前后端技术栈,实现灵活可扩展的权限管理,同时保障安全性和性能。开发者需深入理解 Spring Security、Vue 组件化、MyBatis 拦截器等核心技术点,并结合实际业务需求进行定制化开发。
2025-04-07 19:54:34
1347

原创 React中Element&Fiber对象、WorkInProgress双缓存、Reconcile&Render&Commit、第一次挂载过程详解
React 的三阶段模型(更新、渲染、提交)清晰地分离了调度逻辑、UI 计算和 DOM 操作,结合 Fiber 架构和时间切片机制,使得 React 能够高效地响应用户交互,同时保持良好的性能表现和一致性。FiberRootNode 是全局调度的核心,而 HostRootFiber 是组件树的根节点。两者紧密配合,共同完成 React 的渲染和更新流程。Fiber 是 React 内部实现的一部分,开发者通常无需直接操作,而是通过 声明式 API(如 JSX 和 hooks)间接影响 Fiber构建与更新
2025-01-13 20:25:48
1440

原创 2024Jinger的前端学习内容总结——前端学习路线(超全)
数据结构与算法、HTML、CSS、Javascript基础、高级以及ES6、Vue2&Vue3、React、Node、前端可视化Cesium|Three
2024-12-31 22:13:44
1049

原创 城市灾害应急管理集成系统——系统介绍
本系统是一款集3D GIS、无人机技术、视频GIS、AI GIS 和深度学习算法等技术于一体的仿真模拟与应急预案平台。系统面向多主体(机构领导、领域专家、救援人员与普通公众等)、灾害发展不同时期(灾前、灾中和灾后),支持内涝、团雾、火灾、传染病和地面塌陷五种灾害场景仿真模拟和应急预案,一定程度上能支撑灾前预警预报、灾中资源协调以及灾后救援评估的决策制定。
2024-12-21 15:36:41
1097

原创 前端项目【本科期间】
技术栈:Vue.js|Vuex|ElemntUI|Axios|Cesium|Echarts|Three|Webpack。5.2首页标题列表组件:“栏目管理”》首页》首页栏目主模板》操作下的设置资料来源;2.内容上传:复制上传静态网页到博达网站群(HTML、CSS、JS和相关资料等等);4.绑定相关组件: 包括系统推荐组件、基本组件和栏目资料组件等组件;5.1导航条内容设置:在“栏目管理”中新建所需栏目;3.新建页面模板:新建首页、列表页和内容页的页面模板;**说明:最初版本为纯HTML页面,无框架**
2024-10-24 21:45:53
649

原创 工作流入门这篇就够了!
本文记录自己这大半年老师让学习的工作流,因此本文也是以作者自身学习工作流的过程进行介绍。BPMN->工作设计器->工作流引擎
2024-01-03 23:07:54
9102

原创 博达网站群的入门级指南
笔者初次主导接手一个网站建设项目,该项目是基于博达网站群的Web网站建设。小挣了几千元~~ 在建设过程中,笔者发现网上相关资源虽然还比较多,但是很散,所以决定写一篇入门级的文章供参考。 资源推荐:博达网站:http://www.vsbclub.com/和B站上博达网站建设的相关视频。 文章内容和资源如有侵权请联系笔者,笔者将删除相关内容或整篇文章.........
2022-06-19 14:08:25
8734
5

原创 WebGIS入门
1.关于WebGISWebGIS(网络地理信息系统)是指工作在Web网上的GIS,是传统的GIS在网络上的延伸和发展,具有传统GIS的特点,可以实现空间数据的检索、查询、制图输出、编辑等GIS基本功能,同时也是Internet 上地理信息发布、共享和交流协作的基础。互联网深刻地改变了我们的工作和生活,也改变了地理信息系统,两者的融合产生了WebGIS。随着互联网和移动互联网的迅速普及,WebGIS也迅速发展,以其广泛的应用价值和独特的魅力,成为现代生活的日常工具和现代社会的技术支柱。近些年来, We
2022-01-02 14:55:06
18623
原创 Promise应用场景(实现串行请求完成)
Promise串行请求实现方案 本文提供了7种Promise串行请求的实现方式,适用于不同场景的异步请求顺序执行需求。核心方法包括:async/await(推荐)、Promise.then链式调用、Array.reduce实现、递归实现、自定义串行执行器、带超时控制和重试机制的版本。 关键特性: 确保请求按顺序执行,前一个完成后再执行下一个 完善的错误处理机制,单个失败不影响后续请求 支持超时控制、重试策略等实用功能 提供多种实现方式满足不同需求 适用场景: 请求间存在依赖关系 服务器限制并发数 业务逻辑要
2025-08-10 08:00:00
1481
原创 Axios高阶工厂
本文介绍了一个基于Axios的高阶工厂解决方案,采用工厂模式和策略模式实现企业级HTTP客户端封装。核心功能包括:1)通过唯一标识和Map结构实现重复请求拦截;2)策略模式处理状态码分类;3)指数退避算法实现智能重试。技术亮点涵盖内存优化(WeakMap)、TypeScript支持和性能监控。该方案已在生产环境验证,可减少50%无效请求、提升15%接口成功率,显著提高开发效率和代码复用率。文章还提供了面试演示策略,包括架构讲解顺序、常见问题应答话术及量化效果展示技巧,突显工程化思维和全链路设计能力。
2025-08-10 07:30:00
706
原创 React中实现完整的登录鉴权与权限控制系统
本文介绍了React前端权限控制系统的架构设计,主要包含四个核心模块: 全局路由拦截器:通过AuthGuard组件实现路由拦截,校验用户Token和页面权限,未登录跳转登录页,无权限跳转403页面。 Token管理与RBAC权限控制:使用useAuth钩子管理用户认证状态,实现基于角色的访问控制(RBAC),包含Token校验、权限检查、角色检查等功能。 动态路由配置:根据用户权限动态过滤路由配置,仅渲染用户有权限访问的路由。 动态菜单生成:基于权限过滤的路由配置自动生成导航菜单,确保用户只能看到有权限访问
2025-08-09 21:59:17
268
原创 BPMN编辑器技术实现总结&AI时代的工作流编辑器
本文介绍了一个基于diagram.js的BPMN流程设计器实现方案,采用依赖注入(DI)机制实现模块化扩展。系统通过自定义调色板(CustomPalette)和上下文菜单(CustomContextPad)扩展灾害模型节点,利用SVG技术实现自定义图形渲染。后端采用统一任务调度函数实现异构模型调用。关键技术包括:1) diagram.js核心架构(Canvas、ElementRegistry等模块协同); 2) 依赖注入实现模块化扩展; 3) 高优先级SVG渲染机制; 4) 事件驱动架构。该方案具有松耦合、
2025-08-09 12:40:19
1022
原创 虚拟DOM:有什么好处?抽象层(易升级、跨平台、框架更灵活)
虚拟DOM通过创建内存中的轻量级DOM树实现高效UI更新,其核心优势在于:1)批量处理变更,减少直接DOM操作次数;2)实现跨平台渲染;3)提供声明式编程体验。相较于直接操作DOM,虚拟DOM通过Diff算法计算最小变更集,将多次更新合并为单次重排,显著提升性能。React的Fiber架构进一步优化了虚拟DOM,支持可中断渲染和优先级调度。虽然虚拟DOM会增加内存开销,但对于复杂应用而言,其带来的性能优化和开发效率提升远超过额外计算成本,成为现代前端框架的主流选择。
2025-08-09 08:00:00
1005
原创 腾讯前端面试真题
面试复盘与求职动态 8月8日经历秋招起伏:小鹏汽车面试未通过(原计划作保底offer),但意外获腾讯提前批面试机会。技术准备采用结构化应答框架,涵盖前端基础(虚拟DOM/事件循环)、React原理(Fiber/Hooks)、网络协议(HTTPS/缓存)、性能优化(首屏加载/复杂计算)等核心领域,并结合STAR法则展示项目经验。尽管秋招开局波折,仍保持积极心态继续冲刺京东等企业。(注:配图为技术知识脑图) (字数:149)
2025-08-08 22:05:28
912
原创 图形学、WebGL、ThreeJS&Cesium总结与重难点
WebGL渲染流程分为三个阶段:1)CPU准备阶段,将模型数据、纹理和指令上传至GPU显存;2)GPU可编程阶段,通过顶点着色器处理坐标变换,片元着色器计算光照和材质;3)GPU固定管线阶段,执行深度测试、混合等操作,最终输出到帧缓冲区。核心在于CPU-GPU协同,顶点着色器实现MVP转换,片元着色器处理光照阴影,固定管线确保正确渲染。Three.js和Cesium分别采用直角坐标系和地理坐标系,前者需手动管理坐标变换,后者内置投影处理。性能优化需关注数据传递效率和着色器计算。
2025-08-08 08:00:00
1221
原创 浏览器渲染与GPU进程通信图解
浏览器进程间通信机制解析 本文通过图解方式详细阐述了浏览器渲染进程与GPU进程间的通信机制: 渲染进程生产阶段:合成线程将网页内容分层并转换为OpenGL/WebGL命令,写入共享内存的GPU命令缓冲区。 进程间通信:通过Mojo IPC通道发送通知,告知GPU进程缓冲区有新命令待处理。 GPU执行阶段:GPU进程读取、验证命令并转换为底层驱动调用,最终由GPU硬件完成渲染。 文章还对比了线程通信(共享内存+同步机制)和进程通信(IPC)的特点,指出浏览器采用共享内存+IPC的组合方式,在保证安全隔离的同时
2025-08-07 22:07:25
1025
原创 大疆前端笔试题目详解
大疆前端笔试要点解析 核心考点: 算法能力(快速排序、动态规划) 前端基础(事件委托、浮点数格式化) 计算机原理(进程通信、数据结构差异) 典型题型: 算法实现题(如快速排序) 字符串处理(数字格式化) 前端优化(事件委托优化) 技术深度: 要求理解底层原理(如数组/链表内存结构差异) 需掌握实际应用技巧(正则表达式、冒泡机制) 考察范围: 前端三件套(HTML/CSS/JS) 浏览器工作原理 基本数据结构与算法 建议重点关注算法实现、性能优化方案和计算机基础知识的综合应用能力。
2025-08-07 20:31:37
857
原创 小米前端笔试和面试
小米前端岗位笔试面试全解析 笔试主要考察CSS优先级、浏览器渲染原理、JavaScript异步编程及框架基础(React/Vue),涉及算法题和逻辑题。面试分为3-5轮,技术面重点考察框架原理(Vue双向绑定/React Hooks)、Webpack优化、浏览器机制(事件循环/缓存策略)及手撕代码(如Promise.all实现);HR面侧重软技能与企业文化匹配。备考需掌握高频考点(原型链/虚拟DOM/性能优化)并通过LeetCode强化算法能力,同时包装项目经验突出技术难点解决方案。整体考核注重技术深度与工
2025-08-07 20:28:50
1207
原创 Pytorch安装报错INTEL oneMKL ERROR: 找不到指定的模块。 mkl_intel_thread.2.dll.
PyTorch运行时出现mkl_intel_thread.2.dll缺失错误,表明Intel数学内核库未正确加载。该问题通常由Conda环境激活异常或路径配置错误导致。建议首先重新激活环境(conda activate Diff-DEM),然后尝试重新安装MKL库(conda install mkl --force-reinstall)。若仍无效,可手动定位DLL文件路径并添加到系统环境变量。此错误多与环境变量配置相关,极少情况需重装Conda。确保使用匹配的系统架构版本(64/32位)也很关键。
2025-08-07 09:59:40
395
【WebGIS系统古村古镇数字化平台源码】古村古镇数字化平台,作者热门文章[WebGIS入门、WebGIS期末作业等]的源码
2024-07-17
Lisflood-FP 5软件包
2024-03-01
水文模型SWMM和Lisflood
2024-01-26
基于博达网站建设群的网站搭建
2022-06-19
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人