- 博客(9)
- 收藏
- 关注
RSS订阅原创 前端应该拥有的设计模式思想
本文系统梳理了前端开发中的设计原则与设计模式应用。首先阐述了五大核心设计原则：单一职责、开闭原则、迪米特法则、依赖倒置和组合复用原则，并给出前端实现示例。其次详细解析了创建型（工厂/单例）、结构型（装饰器/代理/组合）和行为型（观察者/策略/迭代器）三大类设计模式在前端的具体应用场景。最后探讨了前端特有的模式思想延伸，包括组件化、Hook模式、容器/展示组件分离以及异步处理模式。全文强调设计模式在前端开发中的实际价值，重点在于理解思想本质而非代码模板，为构建可维护、可扩展的前端架构提供方法论指导。
2026-02-01 20:18:51
666
原创 前端性能优化6大核心方向
前端性能优化是一个系统性工程，主要从6个方向提升用户体验：1）资源加载优化：通过压缩、懒加载、预加载、缓存策略和CDN加速减少资源体积和请求次数；2）渲染优化：减少重排重绘、DOM优化、采用SSR/骨架屏；3）运行时优化：拆分长任务、使用WebWorker、避免内存泄漏；4）网络请求优化：合并接口、缓存数据、使用HTTP/2；5）框架优化：React/Vue组件渲染控制、Next.js渲染策略选择；6）性能监控：跟踪核心Web指标，使用DevTools等工具分析瓶颈。需结合技术手段和持续监控，实现最佳性能表
2026-01-21 16:58:01
750
原创 浏览器渲染页面过程从底层理解重绘重排
浏览器渲染页面是一个的过程，核心是将 HTML/CSS/JS 等资源转化为用户可见的像素画面，不同浏览器的底层细节略有差异，但整体流程高度统一，且现代浏览器会做等操作提升效率。整体核心流程可分为，且部分阶段会。
2026-01-18 17:52:47
730
原创 前端安全防御：AI时代的必杀技
前端开发中，安全问题不再是 “后端的事”—— 随着前端功能越来越复杂（如本地存储、富交互、第三方集成），前端成为攻击的重要入口。结合我目前正在做的 AI 聊天助手场景，我整理了。
2026-01-08 11:00:44
698
原创 TanStack Query生态全解析：高效前端开发指南
定位：异步数据管理库（替代传统的 Redux/Vuex 处理异步请求的部分）核心问题：解决前端请求数据时的 “重复请求、缓存、加载状态、重试、失效、分页” 等痛点核心优势自动缓存请求结果，避免重复请求自动管理加载 / 错误 / 成功状态，无需手动维护支持数据失效、后台刷新、乐观更新跨框架：React/Vue/Svelte 都能用基础使用示例（React 版）：先安装依赖：// 1. 创建 QueryClient 实例（全局唯一）// 2. 封装异步请求函数if (!
2026-01-02 22:11:32
940
原创 深度解析 Partial Hydration：前端渲染性能优化的核心利器
前端水合（Hydration）是将服务端预渲染的静态HTML与客户端JavaScript逻辑连接的关键过程，解决传统CSR的白屏问题。Partial Hydration（部分水合）通过仅激活交互组件（如评论区、表单）而非整个页面，显著优化性能：服务端渲染静态内容保证首屏速度，按需加载动态组件JS减少初始负载。主流实现包括Astro的"岛屿架构"、Next.js的"服务端/客户端组件分离"及React/Vue的手动代码分割。需结合SSR、骨架屏等技术，并避免过度水合、状
2025-12-30 21:40:36
1010
原创 OpenAPI
OpenAPI 是一种用于描述 RESTful API 的规范，允许开发者以标准化的方式定义 API 的结构、请求/响应格式和功能。OpenAPI 文档通常采用 YAML 或 JSON 格式编写，并可用于生成客户端代码、服务器存根以及交互式 API 文档。在paths部分，可以定义 API 的端点及其支持的 HTTP 方法（如getpostputdelete每个操作可以包含参数、请求体和响应定义。
2025-12-29 21:56:17
267
原创 如何使用Lighthouse
Lighthouse 是一个开源的自动化工具，用于改进网页质量。它可以对网页的性能、可访问性、最佳实践、SEO 和渐进式 Web 应用（PWA）进行审核，并给出评分和改进建议。通过以上方法，可以有效提升 Lighthouse 评分并改善用户体验。
2025-11-12 14:16:31
563
原创 虚拟滚动的实现
虚拟滚动（Virtual Scrolling）是一种优化长列表渲染性能的技术，通过只渲染可视区域内的元素来减少DOM节点数量，提升页面性能。这些实现方法可以根据具体项目需求进行调整和扩展，核心思想都是只渲染可视区域内的内容，大幅减少DOM操作。
2025-10-21 16:39:21
317
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人