摸鱼精选第 18 期

Vue 3 推荐状态管理使用Pinia (opens in a new window)，它是多 store 管理的，而 Vuex 是单 store 模式。

Pinia 提供了一个模块化的架构，通过设计实现类型安全，并消除了模板代码。

如果你要用 Vue 3 开始一个新的项目，Pinia 是值得推荐的选择。

攻击路径:

1. 判断是否可以进行 resource discovry 操作获取 CoAP server 的资源；
2. 判断安全机制是哪种；
3. 判断是否实现了认证机制；
4. 对请求解析函数进行逆向分析。

Wokwi 是一个在线的电子电路仿真器。你可以使用它来仿真 Arduino、ESP32 和许多其他流行的电路板、元器件以及传感器。

Microchip University 做的一批免费视频教程，主要是嵌入式开发方向，缺点是注册账号才能观看。

从一个用户反馈的不寻常的 I/O 卡顿入手，发现苹果 APFS 的一个严重 bug。结合问题场景分析问题，结合数据分析结果，发现苹果的文件操作存在的坑，并给出了相应建议。在日常缓存设计中，也需要留意相应的这些点。

分析问题

• 寻找关键堆栈
• 构造必现代码
• dtrace 分析
• Hopper 分析
• 对比 HFS+

结合已有数据分析，发现苹果的文件操作里存在的坑：

• tmp 在极端情况下可能会存在 >90G 的占用；
• WebKit 随机 + 群众的方式删除网络缓存极端情况下的问题；
• NSURLCache 在 diskCapacity 设置过大时存在的问题；
• 密集删除文件导致 I/O 性能下降过快的问题；

为了避免上述这些极端情况下会导致的 I/O 性能骤降，移动端 APP 也需要合理的设计存储结构。如需要分层管理文件，尽量不将单个文件夹或单个文件搞得过大，同时也需要定时清理临时缓存目录，来进一步优化存储空间占用和优化 I/O 效率。

本文作者从响应式编程的概念入手，分析了响应式编程的复杂度来自数据流的几个方面。探讨了使用 Rx 或 Combine 等异步框架来简化基于回调的模式，但异步模式还是免不了在订阅事件的时候带来复杂度。AsyncSequence 天生能将异步转化为同步的方式，正是适合解决 Rx 遇到的问题，将响应式编程通过 AsyncStream 和 AsyncThrowingStream 来实现。

本文作者说 AsyncSequence 不支持 merge 操作，其实是可以的，苹果在Swift Async Algorithms (opens in a new window)开源项目里面带来了各种操作符，包括merge (opens in a new window)，zip 等。

测算函数 / 方法执行耗时，对于每一位开发同学来说，似乎都是一道绕不过的坎。

本文通过引入货拉拉移动端研发过程中的痛点，产生方法耗时分析的需求，在调研业内各种分析工具和方案后，结合需求整合出他们的方案，感兴趣的同学可以点击前往阅读。

一篇关于如何避免竞争的文章，文章内容比较简单，但是观点很深入，探讨了在软件的设计中去避免资源的竞争，靠的不是一味的使用各种锁、栅栏，而是精良的设计。文中举的例子生动易懂且随文的图片制作精良。

本文主要介绍了 3D transforms 的各种变化是怎么得来的，配有手绘介绍图，但需要一点点数学知识才可以读懂。

完全靠大脑去记忆所有的命令或者参数是不现实的，能记住 20 个常用的就非常厉害了。 虽然我们有了 man 命令，但是罗里吧嗦的说明有时候帮不了太多，重点是没有例子。 我们要提高的是快速查找准确命令的速度，依靠搜索引擎是一个方法，但是结果通常不尽如人意。 所以有一个地方汇总了这些常用命令，需要的时候能根据分类查找，然后提供示例就非常好了。

另外，有一个 node 库tldr (opens in a new window)，相比于 man 来说更实用，会提供常用的例子：

对 React 开发者，你需要了解 TypeScript 的最少知识就是：React.FC，PropsWithChildren，HTMLAttributes。

import React, { HTMLAttributes, PropsWithChildren } from 'react';

interface HelloProps extends HTMLAttributes<HTMLDivElement> {
  name: string;
}

const Hello: React.FC<PropsWithChildren<HelloProps>> = ({ name, children, ...rest }) => {
  return (
    <div>
      <div {...rest}>{`Hello, ${name}!`}</div>
      {children}
    </div>
  );
};