osspeace

在这个系列里面，我会谈到前端架构的进化；它们解决了什么样的问题以及又是如何面临新的无法解决的问题的；最后这些架构背后常见的组件和模式。 我知道你们都太熟悉 Flux，Red...

随着前端系统的越发复杂，前端的性能也受到越来越多的重视。Google也不断在推进新的性能相关指标，从原先的Performance API中的指标逐步演进成用户性能体验相关的...

你是否真的理解 devDependencies 和 dependencies 的区别？如果不能确切的回答、理解还停留在模糊的阶段，那就接着往下看。笔者结合案例讲解，保证一文...

没多少人能记住上面的定义，需要注意的是本文不是专业讨论系统架构的文章，笔者也还没到那个水平. 所以暂时没必要纠结于什么是架构模式、什么是架构风格。在这里尚且把它们都当成一个...

npm link到本地测试时，遇到了报错：Warning: Invalid hook call，经过多轮排查，最终发现到React多实例冲突与pnpm对peerDepend...

react在进行组件渲染时，从setState开始到渲染完成整个过程是同步的（“一气呵成”）。如果需要渲染的组件比较庞大，js执行会占据主线程时间较长，会导致页面响应度变差...

自己搭建一个基于rxjs的插件化前端监控平台，其中在统计页面导航数据时，用到了performace进行统计，逻辑上，没有问题,本地调试一下，控制台输出 好像时间信息也都没有...

有一个自己的博客写在简历上可以更好展现自己的技术力，今天我们就使用GitHub page和Hexo快速搭建自己的博客...

在Next.js中集成AI功能时，通过服务端组件优化包体积。针对Markdown渲染器和代码高亮库导致客户端包过大的问题，通过异步生成器函数配合流式SSE传输，实现服务端实...

如何使用msw+vitest测试Nextjs Server Action？思路： action中发请求 handlers拦截这个请求，返回数据 msw的使用...

让你完全掌握Flip动画的思想 Flip是一种动画思路，专门针对上述场景 它由四个单词组成，分别是： - First - Last - Invert - Play...

TCP三次握手和四次挥手的问题在面试中是最为常见的考点之一。很多读者都知道三次和四次，但是如果问深入一点，他们往往都无法作出准确回答。 本篇尝试使用动画来对这个知识点进行讲...

「万字解析」详解 Tapable 核心工作机制，Webpack Plugin 必备前置知识解读。从原理玩转 Webpack ，真正精通所谓工程化前端。...

为了从一个调包侠变成一个前端工程师，发一个npm包是必不可少的，但是手动npm publish并不方便，下面记录一种实现项目的全自动版本管理和发布的流程...

前端分层通过API层对接数据源，Model层防腐转换DTO为VO，View层Hook管理数据流。DTO承载接口原始结构，VO适配视图需求，防腐层隔离后端变动，提升代码维护性...

为了从一个切图仔变成一个前端工程师，性能优化是必不可少的，有时便会说，这个页面性能提高了xx%，速度变快了xx秒，那么问题来了，如何才能正确观测到性能的变化呢，这里记录一些...

今天介绍下 Chrome dev tools 家族的一个小兄弟，它在 Chrome 57 之前叫作「Timeline」，而现在换了个更长的马甲 —— 「Performanc...

HTTPS加密通信核心流程： 服务器生成一对非对称加密密钥（包括公钥和私钥） 客户端发送 client hello 信息（带上自己支持的 SSL/TLS 支持的版本，密码套...

2025年，你必须要知道的react状态管理！ 重新认识React状态管理分层架构。使用zustand客户端状态管理库和tanstack query服务端状态管理库让项目状...