chore: migrate project to monorepo
This commit is contained in:
1 parent
47dd739a28
commit
9195a387b2
125 files changed
+1478
-1364
No files matched your search
Binary file not shown.
|
After Width: | Height: | Size: 48 KiB |
@@ -0,0 +1,7 @@
|
||||
{
|
||||
"label": "高级教程",
|
||||
"position": 6,
|
||||
"link": {
|
||||
"type": "generated-index"
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,138 @@
|
||||
---
|
||||
sidebar_position: 6
|
||||
---
|
||||
|
||||
# 面向前端的协同编程探索
|
||||
|
||||
低代码,无代码等概念已经不再新鲜。同时协同编程也会被经常提到。
|
||||
|
||||
虽然协同编程只是一个组合词 `协同` + `编程`,但是要做的事情远没有这么简单。
|
||||
|
||||
> 协同编程
|
||||
>
|
||||
> - 编辑 —— 协同编辑
|
||||
> - 构建 —— 预置的构建方案
|
||||
> - 运行 —— 在目标环境运行
|
||||
|
||||
## 编辑
|
||||
|
||||
编辑在传统的编辑器的基础上要求更高,需要协同编辑。
|
||||
|
||||
- 离线编辑
|
||||
|
||||
### 编辑器
|
||||
|
||||
- prosemirror
|
||||
- codemirror
|
||||
- monaco-editor
|
||||
|
||||
### 协同算法
|
||||
|
||||
- OT
|
||||
- @codemirror/collab
|
||||
- CRDT
|
||||
- yjs
|
||||
- automerge
|
||||
|
||||
相关文章
|
||||
|
||||
偏向数学理论
|
||||
|
||||
https://www.zxch3n.com/crdt-intro/design-crdt/
|
||||
|
||||
偏向实现细节
|
||||
|
||||
https://zhuanlan.zhihu.com/p/265074361
|
||||
|
||||
### 多窗口库
|
||||
|
||||
- https://github.com/caplin/FlexLayout
|
||||
- https://github.com/ticlo/rc-dock
|
||||
- https://github.com/golden-layout/golden-layout
|
||||
- https://github.com/nomcopter/react-mosaic
|
||||
- https://github.com/idealjs/layout-manager
|
||||
|
||||
## 构建
|
||||
|
||||
### 构建工具
|
||||
|
||||
- esbuild
|
||||
- swc
|
||||
- webpack https://github.com/webpack/playground 已过时
|
||||
|
||||
### 文件系统
|
||||
|
||||
- 虚拟文件系统
|
||||
- memfs
|
||||
- memory
|
||||
- filer
|
||||
- indexdb
|
||||
- memory
|
||||
- unionfs
|
||||
- 文件系统
|
||||
- FileSystem
|
||||
- unionfs
|
||||
|
||||
## 运行
|
||||
|
||||
- dynamic import
|
||||
|
||||
- IIFE (Immediately Invoked Function Expression)
|
||||
- iframe
|
||||
|
||||
使用了 `构建` + `运行` 的平台
|
||||
|
||||
- codesandbox
|
||||
- codepen
|
||||
- stackblitz
|
||||
|
||||
|
||||
## 既要也要的矛盾
|
||||
|
||||
- 离线优先 与 CAP
|
||||
|
||||
传统分布式软件中分区容错性被看的很重要。离线优先也可以被视作分区容错的子集。
|
||||
|
||||
但是离线优先的设计带来了无法在协同编程中解决的问题。
|
||||
|
||||
### 场景
|
||||
|
||||
A B C 三人,P2P 协同编程。
|
||||
|
||||
存在一段错误的代码
|
||||
|
||||
```js
|
||||
let = "A"
|
||||
|
||||
username = "C"
|
||||
```
|
||||
|
||||
当三人同时开始修复此问题时,A出现离线情况。
|
||||
|
||||
B C 二人协同修复得到的结果
|
||||
|
||||
```js
|
||||
let username = "A"
|
||||
|
||||
username = "C"
|
||||
```
|
||||
|
||||
A 离线修复结果
|
||||
|
||||
```js
|
||||
let username = "A"
|
||||
|
||||
username = "C"
|
||||
```
|
||||
|
||||
看上去 A 与 B C 是一致的。但是在 CRDT 与 OT 算法中,并不是。最终 A 恢复连接,得到的结果是
|
||||
|
||||
```js
|
||||
let usernameusername = "A"
|
||||
|
||||
username = "C"
|
||||
```
|
||||
|
||||
对于协同编程来说,协同的好处是规避冲突。但是这种场景下,冲突被放大。
|
||||
|
||||
而这种情况在 git 的方案内,不会发生冲突。
|
||||
Reference in new issue
Block a user