前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >脉脉上的 "前端三大浪漫" 是个啥?

脉脉上的 "前端三大浪漫" 是个啥?

作者头像
Peter谭金杰
发布2022-09-08 15:55:24
5220
发布2022-09-08 15:55:24
举报
文章被收录于专栏:跨平台全栈俱乐部
背景

今天在陌陌脉脉看到一个帖子,讲到前端三大浪漫.

一、富文本编辑器

富文本编辑器市面上已经有很多优秀的开源版本了,但是问题在于每个产品的富文本编辑器需求不一样,所以可能导致有一些时候需要手撸编辑器


例如:

代码语言:javascript
复制
Draft.js
Slate.js
wangEditor

这些富文本编辑器还有衍生出他们的针对不同框架的版本,例如React,还有一些插件。感兴趣的可以去github搜索给个star,方便以后用得上

作者当时手写过桌面软件的富文本编辑器(Electron,类似微信的聊天编辑器),痛苦得很,要控制光标、焦点,复制粘贴,适配多个操作系统环境的QQ、微信、wps等软件的复制粘贴等。感觉都能写好多篇论文了

二、在线excel

推荐一个github star数量11.6K的开源库,luckysheet

demo体验地址: https://mengshukeji.github.io/LuckysheetDemo/

支持:

1.格式设置。包括字体、字号、颜色、文本对齐、自动换行以及excel支持的各种数据类型

2.单元格。拖拽选取、下拉填充、自动填充、查找替换、合并单元格等。

3.行列。隐藏、插入、删除、冻结。

4.操作。撤销、复制、粘贴、剪切、快捷键、格式刷、筛选排序、批注、共享编辑。

5.函数。内置常见公式,并支持自定义公式。

6.图表。目前支持折线图、柱状图、面积图、条形图、饼图,支持插入图片。


三、CRDT - 无冲突复制数据类型

科普:

  • 在分布式计算中,无冲突复制数据类型(英语:CRDT)是一种可以在网络中的多台计算机上复制的数据结构,副本可以独立和并发地更新,而不需要在副本之间进行协调,并且在数学上总是可以解决可能出现的不一致问题。1357
  • CRDT的概念是由Marc Shapiro、Nuno Preguiça、Carlos Baquero和Marek Zawirski于2011年正式定义。[9] 开发的最初动机是协作式文本编辑(英语:Collaborative real-time editor)和移动计算。CRDTs也被用于在线聊天系统、在线赌博和SoundCloud音频分发平台中。NoSQL分布式数据库Redis、Riak和Cosmos DB有CRDT数据类型。

推荐一个8K star的前端 CRDT 实时协作库 Yjs: https://github.com/yjs/yjs

  • Yjs 主要的内部特点:
    • 基于双向链表和 StructStore 的基础数据结构
    • 基于 YATA 算法的并发冲突解决机制
    • 基于 DeleteSet 和 Transaction 机制的撤销重做
    • 基于两阶段划分的同步机制

它支持:

建模数据结构

解决并发冲突

回溯历史记录

同步网络状态等

使用示例

以上借鉴一些这篇文章的内容,推荐深度阅读:https://zhuanlan.zhihu.com/p/452980520 本人水平有限,如果要深入这个CRDT,建议还是得多看一些论文。

最后

我是Peter,如果感觉文章对大家有帮助,可以帮忙点个在看、赞,关注下我的公众号:前端巅峰。这里会给大家带来最实用的web2、web3知识点!

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2022-07-13,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 背景
  • 一、富文本编辑器
  • 二、在线excel
  • 三、CRDT - 无冲突复制数据类型
  • 最后
相关产品与服务
云数据库 Redis
腾讯云数据库 Redis(TencentDB for Redis)是腾讯云打造的兼容 Redis 协议的缓存和存储服务。丰富的数据结构能帮助您完成不同类型的业务场景开发。支持主从热备,提供自动容灾切换、数据备份、故障迁移、实例监控、在线扩容、数据回档等全套的数据库服务。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档