Alien ZHOU
Alien ZHOU
Currently esm.sh seems not completely exact to resolve the module with the 'exports' filed. For example, importing `es/utils/rand.mjs` from [email protected] will return a wrong resolved (besides it has another bug...
It seems that only the 'dev' setting will be used. Queries of [ESBuild options](https://github.com/esm-dev/esm.sh/blob/master/README.md#esbuild-options) and 'bundle' setting would not be passed to the import path. https://github.com/esm-dev/esm.sh/blob/a9f13f1f6adddf38c95d6b9d022bb10e9f364150/server/build.go#L83-L103 Is there any way...
## 引言 在浏览器中，我们可以同时打开多个Tab页，每个Tab页可以粗略理解为一个“独立”的运行环境，即使是全局对象也不会在多个Tab间共享。然而有些时候，我们希望能在这些“独立”的Tab页面之间同步页面的数据、信息或状态。 正如下面这个例子：我在列表页点击“收藏”后，对应的详情页按钮会自动更新为“已收藏”状态；类似的，在详情页点击“收藏”后，列表页中按钮也会更新。  这就是我们所说的前端跨页面通信。 你知道哪些跨页面通信的方式呢？如果不清楚，下面我就带大家来看看七种跨页面通信的方式。 --- ## 一、同源页面间的跨页面通信 > 以下各种方式的 [在线 Demo 可以戳这里 >>](https://alienzhou.github.io/cross-tab-communication/) 浏览器的[同源策略](https://en.wikipedia.org/wiki/Same-origin_policy)在下述的一些跨页面通信方法中依然存在限制。因此，我们先来看看，在满足同源策略的情况下，都有哪些技术可以用来实现跨页面通信。 ### 1. BroadCast Channel [BroadCast Channel](https://developer.mozilla.org/en-US/docs/Web/API/BroadcastChannel) 可以帮我们创建一个用于广播的通信频道。当所有页面都监听同一频道的消息时，其中某一个页面通过它发送的消息就会被其他所有页面收到。它的API和用法都非常简单。 下面的方式就可以创建一个标识为`AlienZHOU`的频道： ```JavaScript const bc = new...
 最近，在维护 KProxy（一个代理服务，Web 版的 charles） 时，遇到一个故障问题：一个请求的响应早已结束，但是在一段时间后却触发了 request timeout。 ## 1. 问题描述 KProxy server 作为代理服务，收到用户请求时会向真实服务端（real server）发出的一个 HTTP 请求，实现代理。但是，在真实服务端响应结束之后（过了较长一段时间），这个 KProxy 中的该请求的 timeout 事件却被触发了。由于真实服务端的响应早已结束，预期是不会触发 KProxy 请求侧的超时的。结合 KProxy 这边的一些超时保障逻辑，就出现了误“封禁”的问题。 核心情况，简单来说就是：一个请求的响应早已结束，但是在一段时间后却触发了 request timeout。 ## 2....
> 本文源码基于 v14.17.3。其主要逻辑与概念在近四个双数版本（v10/12/14/16）上基本一致。 ## 1. 引言 在上篇中我们介绍了 Handles 和 Requests 的概念，了解了什么是 Active 状态。并且知道了一个信息 —— Nodejs 使用了 `HandleWrap` 这个基类来作为 libuv 中 Handle 的封装，所以我们有两种获取 Handle 的方式： - 遍历 HandleWrap Queue - 使用...
> 本文源码基于当前（2021.07.18）的 LTS 版（v14.17.3）。其主要逻辑与概念在近四个大版本（v10/12/14/16）上基本一致。 ## 1. 引言 近期 KNode 在做 Active Handles/Requests 信息的按需采集功能。在 Active Handles 中包含了 timer 的信息采集，这里的 timer 就是指的通过 `setTimeout`/`setInterval` 设置的定时器，以及 Nodejs 内置 JavaScript 模块中创建的定时器等。而 Nodejs 在 timer 实现上与其他异步资源的代码结构不太一致，做了特定的优化。...
## 1、OOM 报警：内存泄漏？ 某天下午，线上的服务监控发出报警：在同一个服务下，部署的众多容器中，某一个容器出现 OOM 问题。  上图是容器维度的资源使用率监控图。可以看到红色的内存使用率曲线，逐步升高将近到 100% 后又迅速降至 0%。这是因为触发 OOM 后容器自动重启。而在重启后，容器的的内存使用率仍在缓慢上升。 该容器分配的资源为 1 核 1G，其容器内只运行一个 Nodejs 进程。运行的 Nodejs 进程在某段时间的监控曲线如下：  可以看到，堆内存使用率也是逐步攀升，CPU 使用率则较为稳定。其与容器维度的监控表现一致。从容器与 Nodejs 进程的曲线上来看，非常像是 Nodejs 服务内存泄漏的问题。 ## 2、使用堆内存快照，排查堆内存问题...
 ## 1、问题背景 近期，在线上运行服务时遇到了一个诡异的 Linux 权限问题：root 用户在操作本该有权限的资源时，却报了权限错误。 报错如下： ```text Error: EACCES: permission denied, mkdir '/root/.pm2/logs' at Object.mkdirSync (fs.js:921:3) at mkdirpNativeSync (/home/web_server/project/node_modules/pm2/node_modules/mkdirp/lib/mkdirp-native.js:29:10) at Function.mkdirpSync [as sync] (/home/web_server/project/node_modules/pm2/node_modules/mkdirp/index.js:21:7) at module.exports.Client.initFileStructure (/home/web_server/project/node_modules/pm2/lib/Client.js:133:25) at...
 本文记录了使用 Node gRPC（static codegen 方式）时，遇到的一个“奇怪”的坑。虽然问题本身并不常见，但顺着问题排查发现其中涉及到了一些有意思的点。去沿着问题追根究底、增长经验是一种不错的学习方式。所以我把这次排查的过程以及涉及到的点记录了下来。 > 为了让大家在阅读时有更好的体验，我准备了一个 [demo](https://github.com/alienzhou/grpc-static-pollute-demo) 来还原该问题，感兴趣的朋友可以 clone 下来，配合文章一起“食用”。 ## 1、场景还原 如果在你了解过或在 NodeJS 中使用过 gRPC，那么一定会知道它有两种使用模式 ——「动态代码生成」（dynamic codegen）和「静态代码生成」（static codegen）。 > 这里简单解释下（对 gRPC 有了解的小伙伴可以直接跳过这段）。RPC 框架一般都会选择一种 IDL，而 gRPC 默认使用的就是 [protocol...
两周前（202.02.17），[vite2.0 发布了](https://dev.to/yyx990803/announcing-vite-2-0-2f0a)，作为使用了浏览器原生 ESM 为下一代前端工具，vite 2.0 相较于 1.0 更加成熟。在此之前笔者就开始[关注这类「新型」的前端工具](https://github.com/alienzhou/blog/issues/42)。这次趁着 vite 2.0 发布，也成功将一个基于 vue-cli(-service) + vue2 的已有项目进行了迁移。  迁移工作比较顺利，花了不到半天时间。但整个迁移过程中也遇到了一些小问题，这里汇总一下，也方便遇到类似问题的朋友一起交流和参考。 ## 项目背景 在介绍具体迁移工作前，先简单介绍下项目情况。目前该项目上线不到一年，不太有构建相关的历史遗留债务。项目包含 1897 个模块文件（包括 node_modules 中模块），使用了 vue2 + vuex + typescript 的技术栈，构建工具使用的是...