- 博客(28)
- 收藏
- 关注
RSS订阅原创 SSE 入门
每当有新数据时，服务端按协议格式写入响应流，客户端通过监听事件实时接收。SSE 是单向的：服务器 → 客户端。客户端若需发送数据，需要另外发起一个普通的 HTTP 请求。客户端发起一个普通的 HTTP 请求，服务端收到后。服务端可以在任意时刻发送，客户端收到后立即生效。持续向客户端发送数据流，客户端使用浏览器内置的。的服务器主动推送技术。SSE 协议原生支持断点续传，核心是。每条消息由若干字段组成，字段之间用。，无需手动实现复杂的重试逻辑。字段单独占一行，前后不需要。SSE 最大的优势之一就是。
2026-06-06 22:43:47
278
原创 WebSocket入门
WebSocket是一种基于TCP的全双工通信协议，通过HTTP握手升级建立持久连接，实现服务器与客户端的双向实时通信。其核心特点包括低延迟、小数据包头和长连接支持，但存在高并发资源消耗和安全风险。重连机制需结合心跳检测和指数退避算法。相比HTTP的半双工和轮询机制，WebSocket性能更优；与SSE相比，它支持双向通信但实现更复杂。WebSocket适用于实时聊天、游戏等场景，而SSE更适合单向推送如消息通知。选择方案时需权衡兼容性、实时性和实现复杂度。
2026-06-06 22:41:23
381
原创 Webpack与Vite详解
本文介绍了Webpack和Vite两大前端构建工具的核心概念和工作原理。Webpack部分重点讲解了五个核心概念（入口、输出、Loader、插件、模式）、编译全流程、AST应用、核心优势以及Plugin与Loader的区别，并详细说明了如何配置Webpack支持ES Module。Vite部分则阐述了其基于原生ESM的开发环境原理、依赖预构建机制和生产环境Rollup打包策略，并提供了路径别名和代理配置的实用示例。全文系统性地对比了两种工具的架构特点和适用场景，为前端工程化提供了技术参考。
2026-05-19 22:28:36
556
原创 CSS面试题2
本文总结了CSS的核心概念，包括选择器优先级、伪元素与伪类的作用及区别、CSS属性的继承性、display属性详解、元素隐藏方法对比以及CSS3新特性。重点内容包括： 选择器优先级：按权重(a,b,c,d)计算，内联样式>ID>类>标签>通配符，!important优先级最高。 伪元素与伪类： 伪元素(::)创建虚拟节点用于内容插入和样式修饰 伪类(:)基于元素状态选择，如:hover、:nth-child display属性：block独占一行，inline同行无宽高，inline
2026-04-12 20:21:37
452
原创 React面试题2
React核心概念解析：生命周期、Fiber架构与Hooks优化 本文系统梳理了React的核心技术要点：1）组件生命周期分为挂载、更新和卸载三个阶段，类组件与函数组件实现方式不同；2）Fiber架构通过时间分片和双缓存技术实现异步可中断渲染，解决同步递归的性能瓶颈；3）Hooks优化方案包括useEffect闭包陷阱的三种解决策略（依赖更新、函数式更新和useRef）、性能优化Hooks（useMemo/useCallback）以及高阶组件的应用场景。文章还对比了触发重渲染的因素及优化方法，为React性
2026-04-12 00:45:05
470
原创 JavaScript面试题2
原因说明避免 DOM 冲突多线程同时操作同一个 DOM 节点，浏览器不知道该听谁的简化设计单线程不用考虑锁、死锁、线程同步等复杂问题历史沿革最初只是表单验证脚本，没必要用多线程死锁（Deadlock）是指两个或多个进程在执行过程中，因争夺资源而造成的一种互相等待的现象产生死锁需要四个条件：互斥、持有并等待、不可剥夺、循环等待闭包就是一个函数以及它所声明时所处的环境（词法环境）的组合函数嵌套：在一个函数内部定义另一个函数引用外部变量：内部函数引用了外部函数的变量// 外部函数的局部变量。
2026-04-10 21:18:25
484
原创 前端性能优化面试题
当元素的样式发生变化，但不影响其在文档流中的位置和几何尺寸时（例如改变背景颜色、文字颜色、阴影等），浏览器会将受影响的像素点重新绘制到屏幕上。CDN 正是利用这一点，将你的网站域名“重定向”到 CDN 服务商的调度系统。指的是将所需的资源（图片、脚本、字体等）提前请求加载到本地缓存，当真正需要用到时，直接从缓存获取。指的是在长网页中延迟加载非可视区域的资源，直到用户滚动到该位置时才触发请求。频繁的触发会导致页面卡顿（丢帧）。防抖的核心在于**“清空旧的，开启新的”**节流的核心在于**“锁状态”**
2026-03-15 22:49:26
459
原创 计算机网络面试题
客户端向 WebSocket 服务器通知（notify）一个带有所有接收者ID（recipients IDs）的事件（event），服务器接收后立即通知所有活跃的（active）客户端，只有ID在接收者ID序列中的客户端才会处理这个事件。的，这意味着客户端和服务器都能同时收发数据。三次握手是为了解决“网络延迟导致旧连接重连”和“同步初始化序列号（ISN）”的问题。：解决数据怎么发的问题（TCP 可靠传输、UDP 尽力而为），关注的是。：传输 0 和 1 的电信号，涉及网线、光纤、集线器等硬件。
2026-03-13 18:30:31
686
原创 React面试题
组件组合 (Component Composition)：将子组件作为children传入，或者将子组件直接在父组件实例化后作为 prop 传入：React 原生支持，适合主题、用户信息等轻量级全局数据状态管理库：如 Redux 或 MobX，适合频繁变动、多处共享的业务数据。
2026-03-12 23:20:29
291
原创 HTML面试题
HTML5 不仅仅是增加了几个标签，更是赋予了浏览器强大的应用能力。标签是网页的“名片”，定义了 SEO、编码、视口等关键属性。等标签，让网页结构清晰，利于 SEO 和无障碍阅读。控制搜索引擎是否检索页面及跟踪链接（如。不加属性，脚本会阻塞 HTML 解析。变为行内元素，行内元素也可以通过。用于定义关键词与页面描述。
2026-03-09 00:21:45
423
1
原创 Express框架入门
express 是一个基于 Node.js 平台的极简、灵活的 WEB 应用开发框架，简单来说，express 是一个封装好的工具包，封装了很多功能，便于我们开发 WEB 应用(HTTP 服务)express 中的 Router 是一个完整的中间件和路由系统，可以看做是一个小型的 app 对象。路由确定了应用程序如何响应客户端对特定端点的请求。路由参数指的是 URL 路径中的参数（数据）
2026-02-23 01:17:16
613
原创 深浅拷贝的原理及手写
在企业级项目中，推荐使用成熟的工具库，其内部处理了极其复杂的边界情况（如 Buffer、TypedArray 等），递归地将原对象的所有层级属性全部拷贝过来。两个对象相互独立，修改任何一级属性都不会影响对方。两者均不会改变原数组，但对内部的对象依然是浅拷贝引用。浅拷贝是指：创建一个新对象，该对象具有原始对象属性值的精确副本。：不拷贝继承属性和不可枚举属性，但支持 Symbol。：遍历源对象的可枚举属性，通过赋值方式处理。在构造字面量对象时进行属性拷贝，语法最简洁。：返回选定元素的新数组。
2026-02-11 15:32:07
356
原创 NestJS 对比 Express
Express与NestJS是Node.js生态中两种不同定位的框架：Express作为轻量级HTTP工具库，提供无约束的自由开发方式；而NestJS则是企业级全栈框架，内置依赖注入、分层架构等规范。二者在代码风格（回调链 vs 装饰器）、架构支持（手动搭建 vs 官方模块）等方面差异显著，但可以共存或渐进迁移。NestJS在微服务、GraphQL等企业级功能上提供官方支持，更适合复杂项目开发。
2025-12-17 17:52:12
618
原创 Nestjs 入门
NestJS是一个基于Express和socket.io封装的Node.js后端开发框架。本文简要介绍了其核心功能和使用方法：1) 安装与项目创建，包括全局安装CLI工具和生成CRUD模块；2) 核心文件说明，如控制器、模块和服务；3) 控制器功能，包括路由、参数处理和请求响应；4) 模块系统及其依赖管理；5) 中间件实现请求拦截；6) 守卫用于鉴权；7) 拦截器处理响应包装和日志。最后提供了一个快速创建cats模块的示例，展示了服务、控制器和模块的基本实现。NestJS通过装饰器和模块化设计简化了Node
2025-12-17 17:48:11
827
原创 Socket.IO入门
Socket.IO是基于WebSocket协议的实时双向通信库，具有自动重连、房间管理、二进制数据传输等特性。相比原生WebSocket，它提供了更好的兼容性和高级功能（如自动降级到轮询）。核心功能包括：1）事件处理机制实现消息收发；2）广播消息支持群发和定向发送；3）房间管理用于分组通信；4）命名空间隔离不同业务逻辑；5）完善的错误处理机制。示例展示了基础服务端和客户端的实现代码，包括连接建立、消息收发和断开处理。Socket.IO简化了实时通信开发，适用于需要高效双向交互的应用场景。
2025-12-08 00:26:02
939
原创 详解-如何使用pnpm workspace管理monorepo项目
本文介绍了使用pnpm管理monorepo项目的方法。主要内容包括：1）项目结构配置，需在根目录创建pnpm-workspace.yaml文件定义工作区范围；2）workspace协议的使用，如workspace:*可实现自动链接和实时同步依赖包；3）常用命令，支持按工作区安装、卸载和更新依赖。文章还对比了workspace:*与link:、file:等替代方案的差异，并说明了如何在package.json中配置私有化属性防止误发布。这些配置和命令可有效简化monorepo项目的依赖管理和协同开发。
2025-08-05 00:25:20
1446
原创 什么是SSR、SSG、CSR
本文对比了CSR（客户端渲染）、SSR（服务器端渲染）和SSG（静态站点生成）三种网页渲染技术。CSR在浏览器端渲染页面，响应速度快但首屏加载时间长；SSR在服务器端生成完整HTML，首屏加载快但服务器压力大；SSG则预渲染静态页面，性能卓越但动态性受限。三种方案各有优劣，适用于不同场景：CSR适合动态交互应用，SSR适合SEO优化需求，SSG则适合内容型静态网站。开发者需根据项目具体需求权衡选择。
2025-08-05 00:23:06
584
原创 5分钟为自己的QQ群添加一个可以获取JM本子的机器人
这是一个基于Python的QQ机器人插件，通过/jm <本子ID>指令可在30秒内将PDF文件发送到QQ。项目需要Python 3.7+环境，支持一键安装依赖，用户只需修改配置文件中的QQ号即可快速部署。该项目已在GitHub开源，欢迎开发者Star支持。项目地址：https://github.com/FunEnn/ncatbotPlugin
2025-08-04 16:48:33
6072
1
原创 Egg.js入门及使用
是一个核心概念，代表当前的请求上下文（Context）。它包含了处理当前 HTTP 请求所需的所有信息和方法。当一个 HTTP 请求到达 Egg.js 应用时，框架会为每个请求创建一个新的。实例在启动时由框架创建，并在全局范围内可用。它提供了一种访问配置、插件、服务等的全局访问点。是指应用实例，它在应用的生命周期内是唯一的，并且贯穿整个应用的流程。插件，线上环境建议部署到 CDN，无需该插件。在 Egg.js 框架中，中挂载的插件，可以通过。中抛出的属性，可以通过。上述的配置，指的是将。
2025-04-08 13:11:20
1223
原创 解决跨域的常用方法方法
前端的请求实际上发送到同源的代理服务器，代理服务器再将请求转发到目标服务器。标签不受同源策略限制的特点，将请求的数据作为 JavaScript 文件加载，并在服务器端将返回的数据包装成一个指定的回调函数。WebSocket 是一种支持双向通信的协议，它在建立连接时只受同源策略的限制，但连接建立后，通信不再受同源策略影响。请求，且存在安全隐患，因为返回的内容是执行的 JavaScript 代码，可能会导致 XSS 攻击。通过配置代理服务器，可以将跨域请求转发到同源服务器上，然后由代理服务器代为发送请求。
2025-03-18 10:41:11
1974
原创 浏览器存储都有哪些方法
Cookie 本质上就是浏览器里面存储的一个很小的文本文件，内部以键值对的方式来存储(在chrome开发者面板的Application这一栏可以看到)。向同一个域名下发送请求，都会携带相同的 Cookie，服务器拿到 Cookie 进行解析，便能拿到客户端的状态。以键值对(Key-Value)的方式存储，永久存储，永不失效，除非手动删除。，挂载在 window 对象下。从而它可以存储大量的数据，而不影响网站的性能。Cookie诞生之初的作用就是解决HTTP的无状态请求，用来记录一些用户相关的一些状态。
2025-03-15 14:26:44
824
原创 nginx 80端口被占用解决方案
（3）找到 HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\services\HTTP。在使用Windows的过程中，我们可能会要用到80端口。但是我们发现80端口被System进程占用。（1） 按键盘win+r 打开运行界面，输入cmd，确定，打开管理员界面。（5）重启系统，System进程就不会占用80端口了。（4）找到项Start，将其值改为0。（2）80端口被System占用。找到端口对应的服务名称。（4）在控制台关闭服务。（1）查找端口占用。
2025-02-25 16:15:41
2672
原创 Monorepo初识
Monorepo 是一种项目代码管理方式，指单个仓库中管理多个项目，有助于简化代码共享、版本控制、构建和部署等方面的复杂性，并提供更好的可重用性和协作性。
2025-02-25 15:58:21
1338
原创 前端首屏加载性能优化都有哪些？
将应用程序拆分为多个小模块，按需加载，可以有效减少首屏加载的资源量。例如，使用 Webpack 等模块打包工具进行代码分割。在 Webpack 中，可以通过。：只在需要时才加载模块，而不是在应用启动时一次性加载所有模块。例如，在 React 中可以使用。：尽量减少第三方脚本的使用，或者将它们异步加载，避免阻塞主资源的加载。提示浏览器在空闲时加载未来可能需要的资源。在 Vue 3 中，可以使用动态。提示浏览器立即加载关键资源。配置项来实现代码分割。
2025-02-20 11:47:49
1006
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人