Tiffany唐

前言 在前端开发和接口调试过程中，我们经常需要对 HTTP 请求和响应进行拦截、修改和分析。Whistle 是一个功能强大的 Web 调试代理工具，能够帮助我们轻松实现这些...

1. 整体结构 从上到下分别为 4 个区域： 工具面板：包含录制，刷新页面分析，清除结果等一系列操作 概览面板：高度概括随时间线的变动，包括 CPU，NET 线程面板：例如...

我在 GitHub 上基于 React 和 Webpack 搭建了一个 Demo 项目，模拟了现实中可能遇到的性能问题，详细记录了如何将 Lighthouse 评分从 2 ...

React 发布已经十年了，笔者接触前端差不多也有十年时间了。通过这篇文章，你就可以知道这快速发展的 10 年，前端渲染模式的演变和关系脉络，知其然，也知其所以然。...

在公司干了几年，带个小团队，零零总总也面试了上百个前端候选人了。说实话，有时候面完一天，感觉人都是麻的。 最让我头疼的是什么？就是“算法题”这个环节。 我经常遇到两种候选人...

在前端开发和排查线上问题的过程中，我们经常会遇到调试受限的场景：无法直接修改线上代码、hover 和 select 样式难以定位、JS 报错追踪困难等。为了提高调试效率，我...

本文将从一道小学语文题出发，由浅入深的讲述AST的设计原理以及各种衍生应用，在这过程中会手写各种好玩的插件，弄懂ESLint和代码压缩等这类基建原理，最后通过最佳实践直接助...

又是一年金九银十，虽然市场一般，如何才能抓住来之不易的机会呢？自然是砥砺自身能力，完善知识体系。 挖下深坑擒虎豹，挂上长线钓金鳌。 本文基于笔者的个人面试经历 + 线上他人...

本文以剖析webpack-dev-server源码，从零开始实现一个webpack热更新HMR，深入了解webpack-dev-server、webpack-dev-mid...

背景 项目是一个基于umi3的单页项目（也可以类比基于Webpack的单页项目），最终打包成静态文件后使用Nginx部署。想要优化的原因是部署到服务器后网页访问速度慢，首页...

任何软件项目一旦叠加“**规模**”与“**时间**”两个变量之后，依赖网络就很容易变得复杂混乱，如果不及时施加恰当的管理手段则迟早会引发诸多晦涩难懂的稳定性、性能、安全等...

今年国庆回家，最大的感受就是大家普遍都比较悲观，不管体制内还是体制外。体制外的说生意不好做，体制内的说公司开始实行末尾淘汰制...... 一位老友说的话让我印象深刻，说感觉...

在Vue项目中，尤其是在使用组件化开发时，我们某些时候需要对组件内部的某些样式优化，但Vue的样式封装特性（scoped）会阻止外部样式直接作用于组件内部。为了应对这一挑战...

tapable 是一个类似于 Node.js 中的 EventEmitter 的库，但更专注于自定义事件的触发和处理。webpack 通过 tapable 将实现与流程解耦...

所有人都知道 Webpack 很复杂，但 Webpack 的源码却很优雅，是一个典型的可插拔架构，不仅逻辑清晰，而且灵活好扩展。近几年出来的一些构建工具，大多也都参考了 W...

某日周五下午五点，鄙人正逛着沸点，盘算着今天基金大涨晚上必须得整点好的。 正浏览着下班后去哪家店撸串，结果隔壁组同事囧着脸过来问我：大哥，赶紧过去帮忙看个问题！客户反馈很多...

前言 其实整理下来，我发现webpack基础的plugin大部分都是围绕着文件的压缩，抽离等等进行处理。 loader则围绕着这些文件内容进行处理，比如把ts代码转化为js...