- 博客(234)
- 收藏
- 关注
RSS订阅原创 [特殊字符]React性能优化三剑客：memo、useMemo、useCallback大揭秘
到这里，我们已经深入了解了 React 性能优化中的三大法宝：memo、useMemo和useCallback。它们各自有着独特的技能，在不同的场景下发挥着重要作用。React.memo就像一个 “智能守卫”，站在组件的入口，仔细检查 props 是否有变化。只有当 props 发生改变时，才允许组件重新渲染，大大减少了不必要的渲染开销，让组件的渲染更加高效。useMemo则是计算结果的 “缓存大师”，当遇到复杂的计算任务时，它会将计算结果缓存起来。
2025-08-04 12:37:21
368
原创 开源！阿里架构师整理的2025前端面试场景题手册太香了
总之，面对前端面试中越来越多的场景题，我们需要及时调整自己的学习方式和面试策略。通过关注行业趋势、积累项目经验、参考面试题集以及提升沟通能力等方法，我们可以更好地应对场景题，展现出自己的实力和潜力。只有这样，我们才能在激烈的竞争中脱颖而出，找到理想的工作岗位。面试官们越来越注重候选人的实际项目经验和解决问题的能力，而非单纯对知识点的记忆。因此，面对这种变化，我们需要及时调整自己的学习方式和面试策略，以更好地适应市场需求。此外，我们还需要锻炼自己的沟通能力，学会如何将复杂的技术问题以简单明了的方式表达出来。
2025-08-04 12:19:50
326
原创 ES6到HTTPS全链路连环拷问，99%人第3题就翻车？
A3: 502 Bad Gateway（网关错误），503 Service Unavailable（服务挂了），504 Gateway Timeout（超时）即使 resolve 在 then 之前，Promise 会“记住”结果，后续 then 依然执行（微任务队列机制） 继续看？A5: 因为 Promise 是微任务，比 setTimeout（宏任务）更快执行，保证 DOM 更新后立即回调 ⏱️。A2: 非对称加密（如 RSA）传“预主密钥”，后续用对称加密（如 AES）通信，兼顾安全与性能。
2025-08-04 11:52:07
295
原创 CSS 命名太乱？BEM 规范帮你一键搞定，代码清爽到飞起！
在前端开发中，随着项目规模的扩大，CSS代码的组织和维护变得越来越具有挑战性。开发者常常面临类名冲突、样式覆盖、代码难以维护等问题。为了解决这些问题，各种CSS命名规范和方法论应运而生，而BEM（Block-Element-Modifier）作为其中最流行和实用的方法一，被越来越多的开发团队所采用。接下来我就将带大家学习BEM命名规范，编写出更加模块化、可维护的前端代码。BEM是Block（块）、Element（元素）、Modifier（修饰符）的缩写，是一种基于组件的Web开发方法论。
2025-08-04 11:27:07
218
原创 手把手教程：用腾讯云新平台搞定专属开发环境，永久免费薅羊毛！
本文默认你已经对 Docker 及 Dockerfile 有一定的了解，因为整个定制和部署流程都是基于 Docker 技术实现的。接下来就进入正题，开始定制属于自己的开发容器。下图展示了一个自定义开发环境，我这里以使用 UV 启动的 Python 环境为例：因为使用了 VSCode 的端口转发能力， 还能够直接使用 localhost 直接进行访问，如下图所示。如果你觉得这还不够，cnb 还提供了 http 服务的代理域名供你直接通过公网来访问。将给出的。
2025-08-04 11:22:24
432
原创 彻底搞懂前端路由：从 Hash 到 History 的演进与实践
在 Web 开发中，路由（Route）是 URL 与资源 之间的映射关系。服务端路由：传统多页应用（MPA）里，浏览器每跳转一次 URL，都会向服务器发起一次新的请求，服务器根据 URL 返回不同的 HTML 页面。前端路由：单页应用（SPA）里，浏览器只加载一次index.html，后续 URL 变化完全户端完成，不触发整页刷新，通过 JS 动态渲染局部视图仅局部更新 DOM不刷新页面。HTML5 新增的提供了无刷新操作浏览器历史记录的能力。方法作用是否触发 popstate新增历史记录❌。
2025-08-04 11:16:02
218
原创 GitHub下载量破百万！2025最全web前端面试八股文宝典
目前就业形势严峻，机遇相比过去更为稀缺，因此除了增强自己的技术能力外，准备面试也变得尤为关键。在这样一个竞争激烈的就业环境中，只有做好充分准备，才能抓住机遇，实现职业上的飞跃。不知不觉中已经过去半年多了，也是收到了很多小伙伴的反馈，注定是有人欢喜有人愁，有人拿下自己心仪的offer，有人面试遭遇滑铁卢！
2025-08-01 18:02:02
227
原创 [特殊字符][特殊字符][特殊字符]结合 vue 或 react，去写three.js
Three.js核心概念：场景、相机、渲染器三位一体构成基础框架动画原理：使用实现平滑动画响应式设计：监听窗口大小变化并调整相机和渲染器框架整合Vue中使用组合式API和生命周期钩子React中使用hooks或类组件生命周期资源管理：组件卸载时remove和cancel掉动画frame。
2025-08-01 17:37:59
608
原创 极简实战：React + Vue 微前端（Qiankun + Vite）
微前端架构将大型应用拆解为独立开发、部署的子应用，极大提升了复杂系统的可维护性。本文将手把手教你使用 Qiankun 框架，在 Vite 构建的 React 18 主应用中集成 Vue 3 子应用。
2025-08-01 17:32:09
874
原创 从 0 到 1 实现低代码编辑器的基本功能
低代码编辑器的核心在于：用 JSON 结构描述页面，拖拽和属性编辑本质上是对 JSON 的增删改查，递归渲染则将 JSON 转化为真实页面。通过合理的数据结构设计、组件配置、状态管理和交互优化，可以实现一个功能完善、易于扩展的低代码平台。两个状态仓库的分离设计，使得页面结构与物料配置解耦，极大提升了系统的灵活性和可维护性。
2025-07-31 16:43:00
669
原创 [特殊字符]来听听尤雨溪是怎么亲述无虚拟dom的吧
模式则是反其道而行，如果我们从头开始一个不同的编译，如果要我手写出性能最好的输出，我应该会怎么写？这样的话我们获取子节点的这个操作的开销就只有在创建的时候执行一次，从此之后，我们就拿到了所有动态节点的引用。如果我们这个模板很大的话，其实这个里面大部分静态的内容，都会被包含在这里，这边就直接拿到了一块静态的。的行为是一致的,唯一的区别是，它的底层编译输出完全不一样，这个编译输出能大幅度的提升性能。模式而把整个应用重写，你可以在一个现有的应用中的一部分里面，选择性的启用。的模板去生成符合我们需求的编译输出。
2025-07-31 16:36:46
662
原创 7月面了十多场前端面试，发现很少问传统八股文了！
带着精心整理的“八股文宝典”奔赴战场，却发现面试官的问题早已跳脱出“事件循环原理”“Vue 和 React Diff 算法差异”这类经典考题，取而代之的是一个个鲜活的业务场景：“如果让你设计一个，如何实现组件跨 iframe 的实时通信？“现有项目的，你的技术方案和落地优先级是什么？，除了 Shadow DOM 还有什么创新解法？这场变革背后，是前端技术深度融入业务价值的必然趋势。随着低代码、智能化工具吞噬基础开发需求，企业对工程师的期待已从“熟练工”转向“
2025-07-31 16:19:25
1288
原创 少写重复代码的精髓：JS方法借用
在JavaScript的世界里，方法借用是一种强大而灵活的技术，它允许我们在不同对象之间共享和复用方法。这种机制充分利用了JavaScript动态语言的特性，使代码更加简洁高效。本文将深入探讨方法借用的原理、应用场景以及实现技巧。方法借用，顾名思义，就是一个对象"借用"另一个对象的方法来使用。在JavaScript中，函数本质上是可复用的代码块，而方法则是附加到对象上的函数。通过方法借用，我们可以在不同的上下文中执行同一个方法，而无需为每个对象都定义相同的方法。
2025-07-30 17:47:54
848
原创 Vue+JSX真香现场：告别模板语法，解锁新姿势！
JSX不是React的专利在复杂逻辑场景下真香⚠️ 需要团队达成共识学习成本其实不高（真心的！如果你也受够了模板里写一堆v-if，不妨试试JSX，说不定就回不去了呢？
2025-07-30 14:15:43
514
原创 前端基建的幸存者偏差
前端基建的幸存者偏差，本质是技术演进的认知透镜失真：我们只见Mendix的光鲜，未见无数停服厂商的落寞（如黑帕云）；我们惊叹Vue 3的Proxy响应式，却忽略尤雨溪团队三年TypeScript重构的艰辛。分层不是妥协：从JSON表单到分布式工作流引擎的渐进之路，是用时间换能力空间的战略全量并非荣耀：Vue源码维护者的宿命是孤独的技术深潜，只适合那些愿为框架奉献血液的团队。
2025-07-28 19:44:15
661
原创 localStorage 你很好，我选 IndexedDB
之于前端，就像 Nokia 之于手机历史 —— 功不可没，但终究被替代。对性能有要求要求安全可靠的数据存储需要存储海量结构化数据localStorage，你很好，但我选 IndexedDB。如果你想了解如何一步步在项目中引入 IndexedDB 或封装 localForage，欢迎留言交流，我可以写一篇实战教程来补上这块拼图写在最后：最好的本地存储方案，从不是最流行的，而是最适合你项目需求的那一个。希望你不再被 5MB 局限，也别再手动了。
2025-07-28 19:39:49
742
原创 尤雨溪力荐 Vue-Plugins-Collection！Vue 生态 最强插件 导航！
生态最强插件导航站**「Vue.js Plugins Collection」**来了今天，正式上线。作者，Vue 伦敦峰会讲师、Vite 核心贡献者，带着12位社区maintainer，闷头半年干成这件事——，按场景、版本、体积、维护状况排好队，搜一下就能装。
2025-07-28 19:35:17
790
原创 package.json 中 dependencies 的版本号：它真的是版本号吗？
场景 / 工具相对路径是否可以省略 file:.tgz 是否可以省略 file:推荐做法npm✅ 是（对文件夹）❌ 否（对文件）显式写 file: 更稳妥✅ 是❌ 否显式写 file: 更清晰Yarn Berry✅ 是❌ 否更推荐 workspace: 或 file:pnpm✅ 是（支持路径 auto 推断）❌ 否类型示例说明精确版本只安装指定版本版本范围安装范围内最新版本任意版本安装任意版本（不推荐）dist-tag安装发布标签对应版本本地文件夹。
2025-07-28 19:30:54
836
原创 七月底来面试的前端都不背背再来吗？
空」包含了:空数组、空对象、空字符串、0、undefined、nul、空 map、空 set,都属于为空的数据【热度:640】28、如何在划词选择的文本上添加右键菜单(划词:标滑动选择一组字符，对组字符进行操作)【热度:100】24、请求失败会弹出一个 toast,如何保证批量请求失败，只弹出一个 toast【热度: 420)?33、浏览器有同源策略，但是为何 cdn 请求资源的时候不会有跨域限制【热度:579]。37、dom 里面，如何判定a元素是否是b元素的子元素【热度: 400】
2025-07-25 15:36:10
767
原创 Vue项目移动端适配：postcss-px-to-viewport解决小程序WebView显示异常
H5页面在小程序webview中显示时，部分机型（特别是iOS设备）出现缩放问题，字体变小等显示异常。插件自动将px转换为vw单位，实现移动端适配。
2025-07-25 15:17:53
262
原创 这些 Spring Boot 默认配置不改，迟早踩坑
Spring Boot 的“约定优于配置”确实省心，但省的是开发者的心，不是系统的责任。每一项默认配置背后，其实都藏着设计者的假设和权衡，而这些假设，在我们的业务场景中也许未必成立。这些坑我几乎都踩过，有些甚至反复踩了好几次。愿你读到这里，能少走几步弯路，可不能拿生产事故去交学费。提前优化配置，是对系统负责，也是对自己负责。最后想说句题外话——最近又忙起来了，又是“降本增效”搞的，好像这个词永远不会消失。有时候总忍不住想，什么时候才能“增本增效”？也许在经济下行的当下是没有可能了。
2025-07-25 15:11:57
806
原创 Vue商城小技巧：返回列表页时，如何记住滚动位置？
这功能听起来简单，但如果不注意细节，用户体验就会很糟糕。今天我就来分享一下我的实现方案，保证简单易懂，直接上代码！这时候，用户滚动到第50个商品，点击进入详情页，再返回时，列表页又回到了顶部，体验很糟糕！，保留之前的状态（包括滚动位置）。我们可以利用Vue Router的。），点击某个商品进入详情页（假设我们有一个商品列表页（
2025-07-25 14:55:55
237
原创 凭1500页前端面试攻略，成功斩获京东offer
本人普通本科2025届毕业生，去年秋招先拿了一些中小厂练了练手，今年投了很多大厂，只有靠学长内推的京东收到了面试通知，非常珍惜来之不易的面试机会，刷了很多面试题，功夫不负有人，最终拿下了offer。
2025-07-23 17:05:10
745
原创 【吃瓜】这可能是2025年最荒谬的前端灾难：一支触控笔“干掉“了全球CSS预处理器
这次事件提醒我们，我们的工作比想象中更脆弱。但也让我看到了社区的力量：当官方渠道失效时，我们依然能够相互帮助，共度难关。PS：这就是为什么我爱这个行业的原因。
2025-07-23 16:31:26
737
原创 Vue指令封装大揭秘！这些高频指令我都在用，你封装了几个？
刚入行时，我总觉得Vue指令很神秘，直到后来发现，合理封装指令能让代码更简洁、复用性更强，甚至能解决一些“棘手”的需求。下面就来盘点一下，我在项目中。今天想和大家聊聊Vue指令封装那些事儿——不是讲v-if、v-for这些基础指令，而是分享我在实际项目中。：表单页面，输入框自动聚焦，提升用户体验。：搜索框输入时减少请求频率，优化性能。：一键复制文本到剪贴板，提升用户体验。：实现长按触发特定功能，比如删除确认。：优化页面加载性能，图片进入视口再加载。的几个指令，以及它们的使用场景。
2025-07-22 17:28:05
361
原创 用 == 被大佬喷了，我到底错哪了？
比较方式名称是否类型转换推荐使用场景==相等运算符是特定逻辑判断（如 null/undefined）===全等运算符否推荐在大多数情况下使用。
2025-07-22 17:23:41
745
原创 前端工程化 | package.json 中的 sideEffects 属性
（摇树优化）是我们的得力助手，它能自动移除 JavaScript 中未使用的代码。，告诉构建工具哪些模块可以安全优化，哪些必须保留。现代前端构建过程中，
2025-07-22 17:12:58
1256
原创 我为什么放弃了“大厂梦”，去了一家“小公司”？
他们确实有很高的薪水和很好的福利，但他们也常常在半夜的朋友圈里，吐槽着无休止的会议、复杂的流程、以及自己只是庞大系统里一颗“螺丝钉”的无力感。你的价值，体现在你写的代码里，体现在你解决的问题里，也有可能体现在你创造的产品里。这个过程很“野”，也很累，但我的成长是全方位的。我的视野被强制性地拉高了。但今天，我想聊的是，我是如何从一开始的“执念”，到后来的“审视”，再到现在的“坦然”，并最终心甘情愿地在一家小公司里，找到了属于我自己的价值。当我把这些想清楚之后，我发现，大厂的光环，对我来说，好像没那么耀眼了。
2025-07-21 12:03:50
345
原创 聊聊前端请求拦截那些事
在我们日常开发中，经常需要做一些请求拦截的事情。例如拦截 js 文件、css、图片以及接口请求数据，用来做一些 mock 以及异常监控的事情。这在前端也并不新鲜。主要原理都是通过 mock api 实现一些劫持的动作。但是实际在实现的时候还是存在一些细节的点。本文系统的整理了前端请求拦截的所有方法，以备各位不时之需。
2025-07-21 11:59:35
810
原创 React 表单界的宫斗大戏：受控组件 VS 非受控组件，谁才是正宫娘娘？
对比点受控组件非受控组件值存储在哪？React 的 stateDOM 的 input 元素里如何获取值？通过 state通过 ref.current.value是否可校验？✅ 非常适合❌ 需要手动做是否响应式？✅ 一输值就刷新❌ React 不知道值变了性能开销会频繁触发 re-render性能好，React 几乎不介入推荐场景注册/编辑等复杂表单文件上传、搜索框、简单提交代码风格正统 React 哲学偏向 DOM 操作受控由我控，状态同步通；
2025-07-21 11:50:15
593
原创 从JS到TS：我们放弃了自由，却赢得了整个世界
TypeScript 和 JavaScript 到底差在哪儿？为啥越来越多项目从 JS 迁移到了 TS？用了大半年 TS 后，慢慢摸透了这两门语言的核心差异，不只是多了几个类型注解那么简单。
2025-07-21 11:44:32
731
原创 Vue计算属性vs侦听器：什么时候用computed？什么时候用watch？老司机一次讲透！
这俩兄弟长得像但脾气完全不同，新手经常用错。看完这篇，保证你从此选得明明白白！
2025-07-21 11:37:40
261
原创 React大厂面试问答系列之Hooks
在React中，Hooks是非常重要的内容，很多人在学习或者备考的时候遇到各种各样的Hooks函数难免会头晕，太多了容易记混，这篇文章通过问答的格式来帮你巩固一下Hooks相关的考点，看看你能不能接住这些大厂中的常考问题吧！本文为Hooks相关的React面试问答系列，以后作者有空，还会陆续更新React中路由、模块化、组件通信等知识点的面试系列！尽情期待吧！
2025-07-16 17:46:10
591
原创 React 中的 Fragment 是个“隐形人”？你不知道的 ＜＞...＜/＞ 的神秘力量！
return (<div></div>你已经见识过 React 的“只能返回一个根节点”规则。为了让它合法，我们经常套个没用的<div>，像是个“打包盒”。会污染 DOM 结构会影响 CSS 布局可能让你的结构语义变差还浪费性能Fragment对比项div渲染到 DOM✅ 会渲染❌ 不会渲染是否增加嵌套层✅ 会❌ 不会可否添加属性✅ 可以❌ 简写不行，标准才行是否语义清晰❌ 容易多余✅ 更干净语义好性能表现多一个节点更轻量更快<>...</>
2025-07-16 17:37:08
419
原创 React Router 路由机制不难：一篇搞懂 URL 跳转背后的原理
刚开始用 React Router 时，我总觉得它的组件设计很抽象 —— 为什么要包个<Router>？<Routes>和<Route>到底起啥作用？直到自己用原生 JS 实现了一遍简易路由才明白，那些组件本质上是把监听 URL 变化、匹配组件、渲染更新这些重复工作封装起来了。知道了它用 hash 或 History API 做底层，知道了<Link>其实是拦截点击事件，做到了不仅会用，还知道为什么要这么用。
2025-07-15 12:09:50
1069
原创 UniApp 加载 Web 页面解决方案
思路：通过evalJS向 WebView 注入自定义的通信桥接对象。// 尝试注入自定义 Bridge`);问题在 Android 平台上注入不稳定时机难以控制，容易失败兼容性差稳定的通信：基于官方 SDK，兼容性好丰富的功能：支持文件上传、页面跳转、数据回调等简单的维护：无需维护原生插件代码良好的体验：接近原生应用的使用体验这套解决方案已在实际项目中验证，能够满足大部分 H5 页面集成需求。
2025-07-15 12:07:57
999
原创 web实现文件的断点续传
实现文件的断点续传需要前端和后端的紧密配合。前端负责文件的分片、上传状态的管理和用户交互，后端负责处理分片的接收、存储和合并。通过合理设计和实现，可以大大提高文件上传和下载的灵活性和可靠性。
2025-07-15 11:59:19
336
原创 昨天面了5个Web前端工程师，发现他们都有一个通病....
有经验的觉得自己能力够用，但一被问到细节就支支吾吾，答不上来;说真的，前端面试没那么难，态度端正是最基本的。4.使用同一个链接， 如何实现 PC 打开是 web 应用、手机打 开是一个 H5 应用?68.Webpack 项目中通过 script 标签引入资源，在项目中如何 处理?71.HTTP是一个无状态的协议，那么Web应用要怎么保持用戶 的登录态呢?没经验的更别提了，以为不会问专业知识，结果一问一个不吱声。65.你在开发过程中， 使用过哪些 TS 的特性或者能力?
2025-07-15 11:57:35
1376
原创 浏览器是如何 “多开” 的？从进程到线程，拆解浏览器的并发逻辑
进程与线程的区别进程是资源分配的最小单位，线程是 CPU 调度的最小单位。进程间资源隔离，通信复杂；同一进程内的线程共享资源，通信高效。Chrome 多进程架构的优势隔离性：一个页面崩溃不影响其他页面。安全性：渲染进程可以运行在沙箱中。性能优化：不同类型的任务由不同进程处理。JS 单线程与异步处理JS 主线程是单线程的，但浏览器通过多线程（如定时器线程、网络线程）支持异步操作。事件循环机制负责将异步任务的回调放入任务队列，并在主线程空闲时执行。微任务与宏任务的执行顺序。
2025-07-15 11:53:09
420
原创 CSS动画实战：从零打造一个超萌的小球亲亲动画
最近在整理CSS动画相关的代码时，发现了一个特别有趣的小项目——两个小球的亲亲动画。animation、定位布局等。今天就来详细解析一下这个萌萌的动画是如何实现的。先来看看最终效果：两个可爱的小球，左边的球会先蹭蹭右边的球，然后右边的球会主动亲一下左边的球，最后还会冒出一个小爱心。整个动画循环播放，非常治愈。div默认是block（块级），独占一行spania等是inline（行内），不能设置宽高（行内块级）：既能设置宽高，又能在一行显示。
2025-07-10 12:22:26
786
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人