黄子毅

接下来用实战来说明该可视化搭建框架是否好用，以下几条原则需要始终贯穿在下面每个实战场景中： 复杂的业务场景，背后使用的框架 API 是简单的。 底层 API 并不为业务场景...

性能在可视化搭建也是极为重要的，如何尽可能减少业务感知，最大程度的提升性能是关键。 其实声明式一定程度上可以说是牺牲了性能换来了可维护性，所以在一个完全声明式的框架下做性能...

组件通过 <Canvas /> 渲染在画布上，内容完全由组件树 componentTree 驱动，但也有一些情况我们需要把某个组件实例渲染到组件树之外，比如全屏、置顶等场景...

ChatPDF 最近比较火，上传 PDF 文件后，即可通过问答的方式让他帮你总结内容，比如让它帮你概括核心观点、询问问题，或者做观点判断。我们来看看背后的实现思路。...

前言 2022 年 11月 ChatGPT 像一股风暴席卷全球。时隔数月，OpenAI 终于在 3 月 1 日正式推出了 ChatGPT 的开放 API。这意味着，我们通过...

由于 React 的特点，组件改变所在父级后会产生 Remount，而在可视化搭建场景存在两个特点： 自由、磁贴、流式布局都可以通过拖拽轻松改变组件父元素。 大数据量下组件...

组件值校验，即在组件值变化时判断是否满足校验逻辑，若不满足校验逻辑，可以拿到校验错误信息进行错误提示或其他逻辑处理。 声明 valueValidator 可开启值校验： 如...

虽然底层框架提供了通用的组件值与联动配置，可以建立对组件任意 props 的映射，但这只是一个能力，还不是协议。 业务层是可以确定一个协议的，还要让这个协议具有拓展性。 我...

组件联动是指几个组件相互关联。也就是当一个组件状态变化时，其他组件可以响应。 组件联动是多对多关系的，且目的分为一次性与持续性： 多对多关系：即一个组件可以同时被多个组件联...

可视化搭建会遇到如下三类容器组件： 简单容器：以 children 容纳子组件的容器。 卡片容器：以 props.header 加上 props.header 等多个插槽容...

在设计好画布与组件数据流体系后，理论上主体功能已经完成，但缺乏方便易用的 API，所以还需要内置一些状态与方法。 但是内置状态与方法必须寻求业务的最大公约数，极具抽象性，添...

接下来需要解决两个问题： 可视化搭建的其他业务元素如何与画布交互。比如拓展属性配置面板、图层列表、拖拽添加组件、定位锚点、主题等等。 runtimeProps 如何访问到当...

接着可视化搭建的理论抽象，我们开始勾勒一个具体的 React 可视化搭建器。-------------...

在做任何可视化搭建项目时，第一步都要思考如何抽象。 如果不抽象，当搭建项目做到后期可能会出现 API 杂乱，难以维护的问题；做到一半甚至会怀疑为什么需要一个搭建框架，怀疑把...

经过上一篇 精读《磁贴布局 - 功能实现》 的介绍，这次我们进入性能优化环节。 精读 磁贴布局性能优化方式有很多，比如通过空间换时间，存储父子关系的索引，方便快速查找到目标...

经过上一篇 精读《磁贴布局 - 功能分析》 的分析，这次我们进入实现环节。 精读 实现磁贴布局前，先要实现最基础的组件拖拽流程，然后我们才好在拖拽的基础上增加磁贴效果。...

磁贴布局三部曲：功能分析、实现分析、性能优化的第一部 - 功能分析。 因为需要做自由布局与磁贴布局混排，以及磁贴布局嵌套，所以要实现一套磁贴分析功能...

现在许多国内互联网公司的项目都持续了五年左右，美国老牌公司如 IBM 的项目甚至持续维护了十五年，然而这些项目却有着截然不同的维护成本，有的公司项目运作几年后维护成本依然与...

emotion 排名第二的维护者 Sam 所在公司弃用了 css-in-js 方案，引起了不小的讨论：Why We're Breaking Up with CSS-in-J...

本周精读的文章是 Iterables 与 Iteration protocols，按照为什么需要迭代器、迭代器是如何设计的，我们还能怎么利用迭代器展开来讲。...