- 博客(37)
- 收藏
- 关注
原创 Electron 学习笔记
在使用 Electron 开发桌面应用的时候,Electron 为我们提供了默认的菜单,但是这个菜单仅仅是用于演示而已。我们可以自定义我们应用的菜单。在 Electron 中,想要自定义菜单,可以使用 Menu 这个模块。// 做我们的自定义菜单// 定义我们的自定义菜单label: "",},label: "菜单1",submenu: [label: "菜单1-1",},label: "菜单1-2",click() {// 该菜单项目被点击后要执行的逻辑。
2026-05-07 14:47:05
239
原创 React与Vue3渲染流程完整对比笔记
维度ReactVue3核心理念响应式数据驱动更新策略推式:开发者触发更新拉式:自动追踪依赖优化方向运行时调度优化编译时静态优化心智负担较高(需理解闭包、依赖)较低(响应式自动处理)
2026-04-04 15:11:02
385
原创 npm 包管理笔记整理
从软件工程的角度来看,包是一种组织代码结构的方式。通常情况下,一个包提供一个特定的功能来解决某一个问题,它会将相关的所有目录和文件放置在一个独立的文件夹中,并通过一个特殊的文件()来描述这个包。此外,若要向 npm 发布包,npm 要求必须要有文件。包:被包管理器(如 npm、yarn、pnpm)初始化之后的目录,会存在一个包描述文件,这样的目录被称之为包。仓库:被版本控制系统(如 svn、git)初始化之后的目录,例如使用 git 进行初始化之后,会存在一个.git的目录。
2026-03-30 17:30:49
498
原创 npm私服搭建学习笔记
NPM 私服搭建完整指南一、为什么需要搭建 NPM 私服在企业应用开发中,搭建私有 NPM 仓库是必要的基础设施选择:核心价值代码私密性保障:企业内部业务组件、工具库等敏感代码需要私有化管理,避免泄露访问速度优化:局域网内部访问,依赖下载速度显著提升,特别适合大型项目和 CI/CD 场景权限精细控制:可针对不同团队、项目设置发布、访问权限,便于维护和管理成本效益显著:npm 官方私有包需要付费订阅,自建私服无额外成本适用场景企业内部组件库、工具库共享多项目公共模块统一管理特定版本依赖的稳定存储C
2026-03-29 12:54:38
535
原创 Prettier 学习笔记
在项目根目录创建配置说明:使用单引号semi:不添加分号printWidth:单行最长 80 字符:ES5 风格的尾随逗号。
2026-03-26 11:10:20
493
原创 抽象语法书学习笔记
树实际上是一种数据结构。我们都知道计算机是用来处理数据的,处理数据的第一步就是先要将数据存储进去。那么存储数据的方式就有多种多样。现实生活中的例子:比如我们有一个书柜(计算机)放 10 本书(数据),那么我放置这 10 本书的方式是多种多样的,我可以横着放、竖着放、斜着放。所谓数据结构,实际上就是数据(书)在计算机(书柜)中组织和管理的一种方式。根据不同的场景,使用合适的数据结构能够帮助我们高效地对数据进行访问和操作。语法树:简单来讲,就是将我们所写的代码转为树的结构。抽象语法树。
2026-03-26 10:44:06
348
原创 sass学习笔记整理
CSS 预处理器是一种通过增强语法来扩展 CSS 功能的技术。开发者使用增强语法编写样式,然后通过编译器将其转换为标准 CSS。// 定义 Mixinfont: {size: 20px;// 调用 Mixinp {div {编译结果p {div {使用@function和@return变量系统:统一管理样式值嵌套语法:清晰的选择器层级Mixin 和函数:代码复用和计算控制指令:条件判断和循环模块化:通过@import@use@forward。
2026-03-24 11:15:10
494
原创 JavaScript库设计注意事项
函数的设计函数主要就是需要注意函数三要素:函数名、函数参数、返回值函数名要力求准确无误,最好能够通过函数名就知道该函数的作用参数的个数尽量控制在 1-3 个以内,如果是复杂类型的参数,最好不要修改原来的参数返回值尽量保持和传入的参数相同的类型提高健壮性需要对参数做一些防御性的措施,特别是在类型上面的判断异常捕获需要考虑到出错时的备选方案,特别是封装的函数中调用了其他函数时,尤其需要考虑出现异常的情况下应该怎么做安全防护不需要向外暴露的功能,就不要向外暴露。
2026-03-18 17:13:28
381
原创 vue模版编译原理
编译(Compile)源码(Source Code):语言 A,即输入的语言目标代码(Target Code):语言 B,即输出的语言编译器(Compiler):执行翻译工作的程序AST(Abstract Syntax Tree,抽象语法树)是一种树状的数据结构,用于表示代码的语法结构。树:一种层次化的数据结构,由节点和边组成语法:描述编程语言的语法规则抽象:忽略代码中的非关键细节(如空格、换行符等)抽象在计算机科学中指的是:将关键部分从细节中分离出来,忽略不必要的细节,专注问题的关键方面。
2026-02-27 11:28:13
288
原创 vite 为什么选择rollup 作为生产打包工具
Vite 选 Rollup 不是"误用",而是"借力打力"——用 esbuild 解决开发速度,用 Rollup 解决生产优化,通过插件桥接和增强填补生态缺口。这种组合让 Vite 在保持极速开发的同时,又能输出生产级的高质量代码,是目前前端构建工具的黄金组合之一。
2026-02-26 20:11:49
613
原创 移动端面试题总结
可以通过uni.startPullDownRefresh(),在onLoad中(即页面刚加载进来时)调用该API实现开始下拉功能;在下拉刷新函数中,调用后台接口获取每一页的数据,将每次获取的数据列表累加起来,直到请求到最后一页数据后,调用uni.stopPullDownRefresh(),关闭下拉刷新,这时,即便再次下拉,也不会请求到接口数据了。混合开发(HTML5开发)相当于一种框架开发。
2026-02-25 14:52:45
558
原创 vite学习笔记
build: {output: {// 方式 1:静态配置// 方式 2:函数式配置(更灵活)// 第三方库打包到 vendor// 路由组件单独打包。
2026-02-21 11:52:18
689
原创 你是否真正的懂得React的memoization
memoization 的本质:保持引用稳定,避免不必要的 re-render 和副作用比较机制:原始类型按值比较,引用类型按引用比较:useCallback 缓存函数引用,useMemo 缓存计算结果React.memo:缓存组件渲染结果,通过 props 比较决定是否重新渲染性能权衡:不要过度优化,先测量再优化。
2026-02-03 14:32:20
609
原创 前端性能优化简单梳理
从发起请求到收到响应首字节的时间,包含 DNS 查询、TCP 连接、TLS 握手和服务器处理时间。:TTI 已被弃用,建议使用 TBT(Total Blocking Time)作为替代指标。:避免 FOIT(Flash of Invisible Text),允许立即使用回退字体。浏览器首次绘制文本、图片(带尺寸)、SVG、非白色 canvas 等内容的时间点。页面完全可交互的时间点(主线程空闲超过 50ms 连续 5 秒)。:默认情况下,字体加载期间文本不可见(FOIT):只提取实际使用的汉字。
2026-01-19 14:54:05
568
原创 js 中的定时器精度到底准不准?
JS定时器不精准,只保证最小延迟根本原因:单线程、事件循环、浏览器节流精度损失:通常1-15ms,极端情况下可能数分钟解决方案:RAF、Web Workers、误差补偿、现代Web APIJavaScript定时器的精准度问题是一个多层次的系统性问题,从硬件到软件,从浏览器内核到JavaScript单线程模型,每个层面都可能影响定时器的准确性。理解这些底层机制不仅有助于面试,更能帮助我们在实际开发中做出更好的技术选择和性能优化。承认局限性:理解JS定时器的不精准性分析根因。
2026-01-19 10:59:17
584
原创 git actions 和 git cli 学习总结
2.2 关键概念详解Workflow(工作流)完整的自动化流程定义文件,一个仓库可以有多个工作流文件。工作流中的并行或串行执行单元,可以设置依赖关系。任务中的原子操作,可以运行命令或调用 Action。预封装的可复用脚本,可从 GitHub Marketplace 获取或自定义。执行 Job 的服务器,分为:启动工作流的触发条件:2.4 高级特性复合 Actions(Composite Actions)创建可复用的 Action 组合:使用复合 Action:环境变量管理条件执行矩阵策
2026-01-14 18:17:05
941
原创 简单手写Promise
本文详细讲解了如何从零实现一个完整的Promise类,包括核心概念、状态管理、then方法实现、链式调用原理以及静态方法。通过手写Promise,读者可以深入理解异步编程机制,掌握Promise/A+规范的核心要点。实现的关键点包括状态不可变性、回调队列处理异步场景、异常捕获机制以及链式调用的实现原理。文章还提供了Promise.resolve/reject/all等静态方法的实现代码,帮助开发者全面掌握Promise的内部工作机制。
2026-01-13 10:22:11
430
原创 浏览器渲染总结
reflow 的本质就是重新计算 layout 树。当进行了会影响布局树的操作后,需要重新计算布局树,会引发 layout。为了避免连续的多次操作导致布局树反复计算,浏览器会合并这些操作,当 JS 代码全部完成后再进行统一计算。所以,改动属性造成的 reflow 是异步完成的。也同样因为如此,当 JS 获取布局属性时,就可能造成无法获取到最新的布局信息。浏览器在反复权衡下,最终决定获取属性立即 reflow。repaint 的本质就是重新根据分层信息计算了绘制指令。
2026-01-08 10:54:16
698
原创 css 总结
一说到 CSS 盒模型,这是很多小伙伴耳熟能详的知识,甚至有的小伙伴还能说出 border-box 和 content-box 这两种盒模型的区别。但是一说到 CSS 包含块,有的小伙伴就懵圈了,什么是包含块?好像从来没有听说过这玩意儿。好吧,如果你对包含块的知识一无所知,那么系好安全带,咱们准备出发了。包含块英语全称为,实际上平时你在书写 CSS 时,大多数情况下你是感受不到它的存在,因此你不知道这个知识点也是一件很正常的事情。
2026-01-07 15:16:02
364
原创 http 总结
HTTP1.0:解决基础通信问题,但单连接模型导致性能瓶颈HTTP1.1:引入长连接和管道化,但队头阻塞问题依然存在HTTP2.0:通过二进制分帧和多路复用提升并发性能,但TCP层瓶颈未解决HTTP3.0:基于QUIC协议重构传输层,彻底解决队头阻塞,实现连接速度、安全性和网络适应性的全面升级随着5G、物联网和实时交互应用的快速发展,HTTP3将逐渐成为互联网传输的主流协议,为用户带来更快速、稳定和安全的网络体验。
2026-01-07 14:57:29
338
原创 前端弱网环境与离线包面试知识点汇总
离线可用:通过Service Worker缓存资源,无网络时仍能访问核心功能类原生体验:可安装到桌面,具备全屏模式、启动动画等原生应用特性后台同步:离线时的操作可在网络恢复后自动同步到服务器Service Worker是浏览器在后台独立运行的脚本,独立于网页主线程。可拦截网络请求,实现离线缓存策略支持消息推送(不依赖页面打开)实现后台同步功能,确保离线操作不丢失。
2026-01-04 14:45:08
305
原创 前端-虚拟dom 总结
虚拟DOM是一个轻量化的JS对象,用于描述真实DOM的结构和属性。它是真实DOM的抽象表示,通过Diff算法计算最小更新范围,再由渲染器(如ReactDOM)将变化应用到真实DOM。
2026-01-04 11:04:28
285
原创 前端原子化架构-学习中
前端原子化架构是一种高效的开发范式,它通过将UI拆分为最小的可复用组件,极大地提升了开发效率和可维护性。原子化设计不仅适用于UI组件,还可以扩展到状态管理、工具链等多个层面,形成完整的原子化开发体系。快速构建高质量的界面提高代码复用性和可维护性降低团队协作成本应对复杂前端项目的挑战原子化架构已经成为现代前端开发的主流趋势,学习和掌握它将为你的前端开发能力带来质的飞跃。
2026-01-02 18:28:41
1137
原创 vue 面试题总结
参考答案:bind: 只调用一次,指令第一次绑定到元素时调用,用这个钩子函数可以定义一个在绑定时执行一次的初始化动作。inserted: 被绑定元素插入父节点时调用(父节点存在即可调用,不必存在于 document 中)。update: 被绑定元素所在的模板更新时调用,而不论绑定值是否变化。通过比较更新前后的绑定值,可以忽略不必要的模板更新(详细的钩子函数参数见下)。componentUpdated: 被绑定元素所在模板完成一次更新周期时调用。
2026-01-02 18:28:14
1089
原创 设计模式学习与了解
解释:单例模式是一种常用的模式,有一些对象我们往往只需要一个,比如线程池、全局缓存、浏 览器中的 window 对象等。在 JavaScript 开发中,单例模式的用途同样非常广泛。试想一下,当我们单击登录按钮的时候,页面中会出现一个登录浮窗,而这个登录浮窗是唯一的,无论单击多少次登录按钮,这个浮窗都只会被创建一次,那么这个登录浮窗就适合用单例模式来创建。
2025-12-31 14:08:19
394
原创 webpack-优化
是使用commonjs规范编写的,并且打包的规范是umd,简单来说,无论怎么样,如果我们引入了lodash,那么就会引入lodash中的全部内容。虽然有免费的次数,看着有好几百次免费,不过在现实的线上环境就是瞬间的事情…依赖于 ES6 的模块特性,ES6 模块依赖关系是确定的,和运行时的状态无关,可以进行可靠的静态分析,这就是 tree-shaking 的基础。当然,也可以前端或者后端人员,将文件提前压缩好,就保存在服务端,需要用的时候直接返回,这就避免了每次请求响应的时候都要压缩的问题,这个其实就是。
2025-12-31 14:07:31
1112
原创 webpack-代码分割
对于动态导入和路由懒加载会自动拆包的问题,相信大家都知道,不过现在有个问题是,自动拆包出来的文件名可能并不是我们想要的,这其实也是由于默认配置的原因。执行了该过程,应用程序的整个大小依然保持不变。但是一些第三方模块本身是基于ES Module的,甚至自身也有一些动态导入,所以对于这部分的模块,简单的module.size()并不足以能判断,可以将这部分的内容再单独处理。默认情况下,它只会影响到按需加载的 chunks,因为修改 initial chunks 会影响到项目的 HTML 文件中的脚本标签。
2025-12-30 14:17:45
736
原创 leetcode-两数之和
本文介绍了一个解决"两数之和"问题的JavaScript算法。该算法通过遍历数组,使用辅助数组存储已遍历元素,检查当前元素与目标值的差值是否存在于辅助数组中,从而快速找到满足条件的两个数。这种方法的时间复杂度为O(n),空间复杂度为O(n),相比暴力解法效率更高。文章提供了完整的函数实现代码,包括参数说明和返回值解释。
2025-12-29 16:05:07
104
原创 vue 组件通信的执行顺序问题
子组件的数据加载顺序和父组件的加载顺序都是按照vue生命周期钩子函数的顺序执行的但是当父子组件两边都进行数据处理时就是爆发出类似异步的问题、找了好久也没有发现问题所在直接就当作异步问题进行了处理,此处使用的是async 。。。await 的方式直接对函数的执行顺序进行处理才发先并没有解决问题。。。。。经过个人不断地研究和查看执行顺序终于想到了父子组件的影响、直接讲数据在父组件里进行处理之后传递给子组件就不会存在类似异步调用的问题了~~~~~~~~~本人超菜,高见请指教、但是不要喷我..
2020-11-04 17:26:43
1082
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人
RSS订阅