小帅の技术博客

发布订阅模式vs观察者模式

sunss 2021-07-18 JavaScript 设计模式

# 背景

最近在研究react的状态管理器zustand时，研究源码时发现其组件注册绑定是通过观察者模式结合react hooks实现更新的。而联想之前写vue的时候，经常会用到vue内置的自定义事件进行组件通信（$emit/on），这个好像是发布订阅模式，搞得我有点头大，感觉这两种模式又十分相似，自己也是有点迷糊，感觉没用理解透，因此，这次就顺势深入研究下这两种模式，再尝试自己手写一个加深下理解。这篇文章是我个人梳理的心得，如有错误欢迎指正，共同进步~

阅读全文

rollup系列之—了解与上手使用

sunss 2021-07-09 前端构建工具

# 背景

我们在项目开发的过程中，经常会封装组件与一些函数库方便使用。但每次开发不同项目时都要花费时间重新开发，其实很多组件与工具函数在多数场景都是可复用的。所以，我打算把日常使用频率较高的组件和函数库进行逻辑封装，发布成一个npm包小工具库等，这样做，一来可以借机完善组件与工具库业务逻辑，二来可以熟悉不同工具对打包构建的流程，最后还可以实战下npm发包。

阅读全文

vite系列之——构建标准化react应用

sunss 2021-07-09 前端构建工具

掘金：Vite2.0+Typescript+React+Antd+Less+Eslint+Prettier+Precommit 构建标准化 react 应用

# 背景

之前公司项目采用的是umi脚手架一体化构建工具，得益于对webpack与各框架的集成和封装，使得快速上手的能力大大加强，但是随着项目的不断迭代与功能增加，依赖的库也是越来越多，目前最明显的感受就是每次启动与打包构建的时长，往往是好几分钟~，热更新有时也要耗费数秒，对于开发效率与体验影响很大。。。

阅读全文

zustand状态管理器

sunss 2021-06-02 前端 React 库

# 特性

不需要像redux那样在最外层包裹一层高阶组件，只绑定对应关联组件即可（当在其他组件/方法修改状态后，该组件会自动更新）
异步处理也较为简单，与普通函数用法相同
支持hook组件使用、组件外使用
提供middleware拓展能力（redux、devtools、combine、persist）
可通过 https://github.com/mweststrate/immer 拓展能力（实现嵌套更新、日志打印）

阅读全文

Svelte框架初尝试

sunss 2021-01-29 前端框架

都2021年了，还不会使用Svelte？那你就out了~

# 前言

由于公司最近业务原因，接了不少类似活动页、单个h5页面的这种需求。相对于传统的React与Vue框架开发来说，其本身无论项目内容与大小，其核心框架代码是必须的，而如果使用jquery这种古老的技术又非常影响开发效率与开发习惯不适应。因此，我研究了下针对一个小型项目的比较适合的开发框架，即，只有一至三个简单页面开发的这种小项目需求。一开始也是有考虑过Vue的多页面开发这种，不过，在发现了Svelte之后，我觉得有更值得尝试的方案了~