9.19 早上还在写代码，然后收到 HR 的消息去会议室，15 分钟就结束了，不需要交接，当场取消所有权限，归还设备之后就回家了，神奇的体验。

在 上一轮优化 里， 我们通过优化一些构建工具和流程， 把构建耗时优化到了 4min 左右，整体发布耗时从 15min 优化到了 8 min 左右, 有较大提升， 但是依旧存在提升空间。

目前我们都是统一使用的原图，原图可能有 1024 * 1024，但实际展示可能很小，这样不可避免造成了一些流量的浪费，这么大的流量，也导致我们的页面加载不够快，尤其一些长列表的时候，因为图片尺寸的压缩，让我们的页面有一些卡顿。

于是这两天抽空对项目做了一次构建优化，线上(多国家)构建时间, 从 10分钟 优化到 4分钟, 本地单次构建时间， 从 300秒 优化到 90秒， 效果还不错。

背景上一篇文章我们分析了：为什么 esbuild 这么快。还有数据对比：可以看到： esbuild 一骑绝尘, 以绝对优势领先。但是看看最下面, 赫然是我们最熟悉的 webpack。那么, webpack 的构建为什么慢呢？ 到底慢在哪呢 ？下面是我的一些思考，分享给大家，希望对大家有所...

前言esbuild 是新一代的 JavaScript 打包工具。他的作者是 Figma 的 CTO - Evan Wallace。esbuild以速度快而著称，耗时只有 webpack 的 2% ～3%。esbuild 项目主要目标是: 开辟一个构建工具性能的新时代，创建一个易用的现代打包器。它的主要功能：Extreme speed wit...

背景今天又被 QA 找: 这个页面昨天还好好的, 今天就白屏了, 是不是你代码有问题啊, 赶紧看看。上去一看， 找到了原因：原本 pickup, dropoff 两个字段没有数据的话， 应该返回{}, 结果现在pickup字段返回了null, 而我们取值的时候，也没对这个地方做防御。 {代码...}...

前言这几天心里颇不宁静。想的事情比较多， 没有一个是关于技术的。今天和大家聊聊一个我们都很关心的话题：晋升。下午拉了个会， 和我几个下属聊了一下这个话题， 自己也有一些新的感受。在这里记录一下， 顺便分享给大家， 希望对大家有所启发。今天的主要内容：我...

背景之前部门想要统一代码编辑器， 最后决定统一用 VS Code。我之前也有写这篇文章的想法，于是就主动报了名。所以就有了今天这篇，一篇详细介绍 VS Code 的文章。中间参考了不少资料，如有错误，欢迎留言指出 :)文章主要内容：VS Code 概览VS Code 介绍VS Code 技术...

背景并发冲突问题， 是日常开发中一个比较常见的问题。不同用户在较短时间间隔内变更数据，或者某一个用户进行的重复提交操作都可能导致并发冲突。并发场景在开发和测试阶段难以排查全面，出现线上 bug 以后定位困难，因此做好并发控制是前后端开发过程中都需要重视...

背景前几天晚上下班的时候， 路过隔壁项目组， 听他们在聊项目构建的事：现在线上打包时间太长了， 修个 bug 1 分钟， 发布一下半小时, 贼难受。他们项目比较庞大， 线上构建时间特别长， 基本都在15分钟以上。和他们简单聊了会， 回去瞅了一下自己项目的构建时间：...

背景前段时间， 部门在热火朝天的搞各类组件库。 做组件库，不可避免的就需要做组件的展示和说明， 要用到一些文档工具。我们项目里面也尝试了几种不同的文档工具，今天和大家分享一些经验， 希望对大家有所帮助。正文目前， 我们的组件库， 一共使用三种文档工具， ...

前言Vue Router 是 Vue.js 官方的路由管理器。它和 Vue.js 的核心深度集成，让构建单页面应用变得易如反掌。包含的功能有：嵌套的路由/视图表模块化的、基于组件的路由配置路由参数、查询、通配符基于 Vue.js 过渡系统的视图过渡效果细粒度的导航控制带有自动激活的 ...

背景在之前的一篇文章中， 我们遇到了一个项目在构建时内存溢出的问题。当时的解决方案是: 直接调大 node 的内存限制，避免达到内存上限。今天听同事分享了一个新方法，觉得不错， 特此记录， 顺便分享给大家, 希望对大家有所帮助。正文直接上报错示意图：提示已经很...

背景今天PM过来问我: 蛋总，有些用户反馈他们屏幕太小了，需要滑动， 操作不方便。 我们的系统能不能改成自适应布局啊?我顿时虎躯一震：woc, 要把一个迭代了一年多的固定设计的产品，改成自适应布局? 真让人害怕。然后我就去查了一些自适应布局的资料，尝试找出一种...

vite，号称是下一代前端开发和构建工具。vite的出现得益于浏览器对module的支持，利用浏览器的新特性去实现了极速的开发体验；能够极快的实现热重载(hmr).

背景在平时的开发中，快速定位需求所在的代码文件，是十分常见的需求。一般来说，常见的定位源码的方式有：搜索页面关键字页面路由Devtool 中的组件名好的记忆力 🤪这些方式往往效率都不是很高，而且可能需要很长的操作路径才能达到目的， 比较麻烦。如果通过点击页面...

这两天做 Code Review 的时候， 发现很多 if-else / switch 语句，并不是特别优雅。 在一些逻辑复杂的地方，看起来比较臃肿， 不是那么好读。

今天看到一个不错的动画网站：[链接]可以自己编辑生成动画，并且能十分方便的引入到你的项目中。比如上图的猫咪动画： {代码...} 借用这个能力， 我们可以让loading效果更有趣味：网站中还有大量的素材可以免费使用：感兴趣的可以去看一下。

背景我最近将一些 Vue2 项目从 vue-cli(webpack)迁移到了 vite。在第三次这样做之后，我对迁移过程做了一些详细的记录，并将在这篇文章中进行总结。文章目录：package.jsonindex.htmlvite.config.js测试用例Lint发布可视化 Bundle一些指标结论正文package.jsondevDep...