R·ex / Zeng


音游狗、安全狗、攻城狮、业余设计师、段子手、苦学日语的少年。

分类“环境”下的文章

发版辅助工具:因为规范,所以有效

业务扩张导致的问题随着公司前几年的扩张,部门内的团队越来越多、业务越来越复杂。为了应对这种情况,前端团队使用了微前端,后端团队则使用了微服务。单个仓库的维护成本确实变低了,但这又带来了另外几个问题:业务模块归属的团队可能会变化,例如“订单追踪服务”之前属于团队 A,但有一天拆到了团队 B;很难整理出网状的模块调用关系,一个业务需求可能会改动到多个仓库的代码,例如我们对接一个新的物流渠道,从最底层的数据模型服务,到最上层对外封装的服务,可能都要有变化;前后端模块无法一一映射,因为前后端的拆分粒度不...

一次 PNA 问题的定位经验(Chrome NetLog Viewer 入门)

作为一个电商平台,用户下单时,我们提供了一个页面让其选择自提点。一天下午,同事突然发现这个页面会多请求一遍接口,具体现象是:先是一个 Pre-flight/OPTIONS 请求(因为接口跨域),但是这个接口失败了,从 F12 的 network 界面只能看到 net::ERR_FAILED,看不到具体的错误信息,从 console 界面也没有任何报错。然后是一个正常的 Pre-flight/OPTIONS 请求,这个请求成功了。然后是一个正常的 GET 请求,这个请求成功了。每个接口都会这样,因...

追根究底:不打开 DevTools 时,console.log 会不会内存泄漏?

TL;DR:会。并且虽然 Chromium 有试图做限制,但因为方法不合适所以并没能解决问题。JavaScript 的内存泄漏原因有很多,例如 DOM、计时器、闭包、意外的全局变量,以及本文的主题:console.log。关于 console.log 会不会造成内存泄漏,掘金上面有大佬发过两篇文章:千万别让 console.log 上生产!用 Performance 和 Memory 告诉你为什么console.log 一定会导致内存泄漏?不打开 devtools 就不会这两篇文章的结论是:在打...

多版本共存——巨型项目组件库升级的必经之路

Update 2023-07-19目前已经有更简单的方式:PNPM 已经支持带有 alias 的 peer dependencies 查找,不需要用 hooks 了;通过实现跟 Ant Design 类似的 prefixCls 和 modifyVars 功能,也可以控制组件库选择器的前缀以避免样式冲突。组件库升级是一个令开发者头痛的事情,即使像 Ant Design 这种经历了多年发展的组件库,升级也不是一件容易的事情——轻则 API 不兼容,重则影响自定义样式和用户体验。(为什么 API 不兼...

盲调试解决 Zebra 打印机吞纸问题的经历

本来我以为,前端的工作内容只需要跟浏览器打交道,最多再做一做客户端和后端;万万没想到,如标题所示,我居然需要解决打印机的问题。奇怪的需求我们有一个画面单的平台,关于这个平台,我之前已经写过几篇文章,这里就不多提了。一天,面单的产品突然把我拉到了一个群里,因为我们的业务 PM(BPM)接到了一个紧急需求:在我们开始跟某个卖家合作时,他们提出:我们在打印面单的时候,必须支持通过一个叫 Zebra 的打印机来打印,否则就不跟我们合作。由于那是一个大卖家,因此这似乎是一个无法拒绝的需求。虽然我们完全没听...

用 OpenResty+OpenCC 让网站支持正体中文

想要查看本站的正体中文版本,点击页脚处的“正體中文”链接即可。关于这篇文章的背景,真是说来话长……大概在八年前,我去 CTSC 打了个酱油(非集训队,只是去玩的),在那几天里,我接受了许多大佬们的培训,印象比较深刻的是 BYVoid 大佬,因为他在 PPT 中放了自己网站的链接,我点进去之后发现可以随意切换“简体”和“繁体”,而且似乎跟我以前见过的国际化不同,文章内容也会随着切换。当时我对 Web 开发一窍不通,所以没有能力好好研究这究竟是怎么实现的。后来有一次机缘巧合,我看到了一个叫 Open...

Go module 踩坑备忘

之前为了写 Go,我特地捣鼓了一下 VSCode 的 Go 配置,具体的经历可以看 这里。最近由于业务需求,需要新开一个 Go 的项目。听朋友说 Go 从 1.11 开始有了个叫 Modules 的新特性,于是打算看看能否用在我的新项目中。为什么我对 Modules 这么感兴趣呢?因为写项目总是逃不开各种包管理,而之前 Go 不管是官方还是非官方的包管理器,都是基于 GOPATH 或者 vendor 目录,也无法很好的解决不同版本的冲突。Modules 据说可以解决这些问题。我们之前的项目用的是...

Webpack 打包体积优化:没有银弹

关于 Webpack 打包体积优化的问题,网上的文章已经有很多了,大概的方法有:webpack-bundle-analyzer(source-map-explorer)、CommonsChunkPlugin(v4.x 之后变成了 splitChunks 选项)、按需引入用到的库、Tree Shaking、CDN 等。之前我用这些方法对自己负责的某个项目做了一次优化,使得总体积不到 600 KB(after gzip),由于包含了 antd 和 react,外加有几十个页面(有的页面相当复杂,即使...

Docker for Windows 无法共享磁盘的问题

TL;DR: 解决方案在 文章末尾。之前为了开发方便,我一直在用 Docker for Windows 作为我的开发环境。但突然有一天,Docker 突然无法在 Shared Drives 里面共享磁盘了,会报一句这样的提示:A firewall is blocking file Sharing between Windows and the containers. See documentation for more info.看起来是防火墙的问题。我知道 Docker for Windows...

搭建付费的 MXroute 并了解邮件相关的域名记录

本文并非为匿名人士所编写,第三方服务一般都会有审查机制,因此无法保证敏感数据的安全。背景之前我的域名邮箱 [email protected] 一直用的是国内的某个服务,最近觉得国内服务的限制比较多,于是打算将其迁移到国外服务。必要的要求有:不暴露自己服务器的真实 IP价格不要特别贵不会被常见邮箱识别为垃圾邮件界面尽量美观,需要支持 IMAP(或 POP3) 和 SMTP其它条件类似时,SaaS >= PaaS >= IaaS问了几个人,自己也搜了一圈,对比下来发现 MXroute 算是比...

在 VSCode 中配置 Go 调试环境

前期准备作为一个 Go 开发者,首先需要把系统中的 Go 的环境配好(包括环境变量和包管理器),具体怎么配这儿就不说了。不过 Go 的项目似乎都需要跑在 $GOPATH/src 下面,感觉有点反人类。Go 最推荐的调试器就是 Delve,安装和使用方法这儿也不说了,正确安装后应该可以在命令行中直接运行 dlv 命令。想看结果的同学,可以直接跳到文章末尾,那儿有可以运行的配置。VSCode 作为微软爸爸的东西,我一直是很推崇的;刚好最近也在搞 Go 的项目,于是在想如何不用 JB 系软件(太臃肿)...

Service Worker 踩坑指南(缓存与 WebP)

背景前天晚上在清理 Chrome 插件的时候,发现了好久之前因好奇而安装的 Lighthouse 插件,它是 Chrome 团队出的一个自动化页面审计工具,可以帮助开发者优化页面。继续怀着好奇的心理,我打开了我的网站主页,然后点了一下 Generate report 按钮,得分惨不忍睹……嗯由于特别惨不忍睹,所以我就不放结果了,放一张 Lighthouse 的界面代替好了……当然,优化的过程倒是不算太难,按照网上搜到的教程添加 Service Worker 和 Manifest,然后给一些标签加...

这是我们共同度过的

第 3040 天