背景最近一段时间博客通过域名访问的方式一直访问为空白页面，我以为是github的问题过段时间就好了，就没太管，后来一直没恢复，于是查了下是什么原因。刚开始以为是githubpage的问题，往这个方向折腾了好久没啥结果… 不过也知道到了 username.github.io 下可以通过路由的方式部署多个项目，问题没解决不过也没白折腾吧。 问题最终发现是之前没管的hexo的循环依赖问题：hexo...

先来看下基础实现 clone，把 T 里面的都拷贝一次： 123type cloneT<T> = { [K in keyof T]: T[K];}; Partial用法将类型定义的所有属性都修改为可选 12345678910type Foo = { name: string; age: number;}type Coord = Par...

前言本篇文章是读了林不渡的TypeScript 的另一面：类型编程，码了一些 demo 并查了其他文档等最后留下的学习笔记。建议直接读原文，本文可读性较差 类型编程的特点/看法 它会带来代码量大大增多（可能接近甚至超过业务代码），编码耗时增长等问题，而带来的唯一好处就是类型安全，包括的类型提示，进一步减少可能存在的调用错误，以及降低维护成本。看起来似乎有得有失，但实际上，假设你花费...

长列表 / 无限下拉列表 渲染考虑到性能，我们不可能将一个长列表（甚至是一个无限下拉列表）的所有列表元素都进行渲染，应该是只渲染部分数据并随着下拉渲染新数据 方案一：Intersection Observer + padding该方案来自云音乐-一个简洁、有趣的无限下拉方案 Intersection Observer详见MDN，建议全都读完 一直以来，检测元素的可视状态或者两个元素...

本文大部分来自ConardLi 的 blog，建议直接看原博客 What & Why使用 Hooks，你可以在将含有 state 的逻辑从组件中抽象出来，这将可以让这些逻辑容易被测试。同时，Hooks 可以帮助你在不重写组件结构的情况下复用这些逻辑。所以，它也可以作为一种实现状态逻辑复用的方案解决了 HOC 嵌套地狱的问题，使得逻辑复用更加清晰 State HookuseState ...

本文大部分来自ConardLi 的 blog，建议直接看原博客 概述Mixin 的危害React 官方文档在Mixins Considered Harmful一文中提到了 Mixin 带来了危害： Mixin 可能会相互依赖，相互耦合，不利于代码维护 不同的 Mixin 中的方法可能会相互冲突 Mixin 非常多时，组件是可以感知到的，甚至还要为其做相关处理，这样会给代码造成滚雪球式的复杂...

简介CSS Modules 不同于 less，sass 等，不是把CSS改造成编程语言，而是功能很单纯，只加入了局部作用域和模块依赖 解决的问题 全局样式冲突（主要问题） css选择器嵌套过深，有性能问题 代码冗余（无继承） 模块化 局部作用域CSS的规则都是全局的，任何一个组件的样式规则，都对整个页面有效。这使得在开发中很可能有类名相同造成相互影响的情况，多层嵌套css又会造成性能问题。...

初识 TypeScript什么是 TS TypeScript 是 JavaScript 的一个超集，主要提供了类型系统和对 ES6 的支持，它由 Microsoft 开发，代码开源于 GitHub 上 TS 的优点和缺点优点： 增加了代码的可读性和可维护性。写代码的时候有更多的编译提示，代码语义更清晰易懂 包容性 拥有活跃的社区 缺点： 一定的学习成本；短期可能会增加一些开发成本，毕...

基本原理Virtual Dom虚拟 DOM 本质上是 JavaScript 对象,是对真实 DOM 的抽象，状态变更时，通过 diff 算法计算出记录新树和旧树的差异，最后把差异更新到真正的 dom 中 虚拟 DOM 的实现相较于 DOM 来说，操作 JS 对象会快很多，并且我们也可以通过 JS 来模拟 DOM 12345678910const ul = { tag: '...

概述来源该项目是技术胖的一个项目，涉及了前台中台后台，觉得是个不错的练手项目. 概述博客前台： React Hooks + Next.js + marked + highlight + Ant Design数据中台： Egg.js（阿里的一个基于 Koa2 的框架） + MySQL管理后台： React Hooks + Ant Design （不用 Next.js） Next.js 是一个...