关于OT算法的协同的核心算法部分已经写完了。 再简单谈一下关于协同文档底层架构的问题，因为目前我的方案还没有最终落地所以并不清楚实际情况中会出现哪些问题， 说一下传输层，传输层是用的MQTT，得益于RabbitMQ的插件MQTT，实现了消息队列，当然了MQ和Redis是老搭档了，少不了Redis的入场，Redis基本上只负责服务器缓冲层的作用，因为大量的JSON数据会传输到后端存储起来，用Redis最好不过了，这里使用的是Redis的有序set，这样咱们的数据进来的时候可以根据时间戳进行排序，等到新用户进来的时候，可以快速从缓冲区拿出数据，并且很快的编译出完整的文档来，目前Mysql的作用

（operational-transformations） 此篇文章写给一同在进行ot算法实践中的朋友们，希望抛砖引玉，有对ot算法感兴趣的小伙伴可以联系我一下，目前关于此算法的一些细节处理上我还有一点点的疑惑部分，希望能讨论解决 巨人的肩膀 我们可以先看一下其他人是如何解决的： 前端状态图 Purpose 目的 OT算法解决协同编辑问题在在落地中客户端设计可以简化为三种状态和三个方法 如何解决 数据结构设计如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 client { version //记录当前版本 state

（operational-transformations） 此篇文章写给一同在进行ot算法实践中的朋友们，希望抛砖引玉，有对ot算法感兴趣的小伙伴可以联系我一下，目前关于此算法的一些细节处理上我还有一点点的疑惑部分，希望能讨论解决 Purpose 目的 如果A客户端对文档进行了多次编辑，B客户端因为网络原因没有及时同步到A客户端的OP操作，继续在老版本编辑并向服务端发送OP操作会出现什么情况呢？ 如何解决 OT算法通过链式反应法则解决对老版本OP操作的问题 前边说过：transform算法的解决方案，这次也借助这个核心算法解决 基础操作分为三种： R = Retain，保持操作 I =

（operational-transformations） 此篇文章写给一同在进行ot算法实践中的朋友们，希望抛砖引玉，有对ot算法感兴趣的小伙伴可以联系我一下，目前关于此算法的一些细节处理上我还有一点点的疑惑部分，希望能讨论解决 Purpose 目的 在目前的ot算法中，对我们来说就是一个黑盒，我们知道给一定的输入，它会有正确的输出，但是它是如何做到的呢？ 在介绍它的实现之前，我们需要抽象一下我们的操作行为，在之前我们的描述都是 第3个字符行后面插入了一个‘d’ 这里怎么转换成程序识别或者能用代码表达的呢？其实这也是OT的关键。 这里我直接揭晓答案： 所有对文本的操作都可以抽象成三个原

背景介绍： 从第五代标准HTML推广发布后，其中工作线程（Web Worker）概念的推出让人眼前一亮，但未曾随之激起多大的浪花，并被在其随后工程侧的 Angular、Vue、React 等框架的「革命」浪潮所淹没。 但自从2019 年爆火的微前端架构的出现，基于微应用间 JavaScript 沙箱隔离的需求，Web Worker 才得以重新从边缘化的位置跃入到我的中心视野。 什么是JS沙箱： 在现实与 JavaScript 相关的场景中，我们知道平时使用的浏览器就是一个沙箱，运行在浏览器中的 JavaScript 代码无法直接访问文件系统、显示器或其他任何硬件。Chrome 浏览器中每个标

背景介绍： 从第五代标准HTML推广发布后，其中工作线程（Web Worker）概念的推出让人眼前一亮，但未曾随之激起多大的浪花，并被在其随后工程侧的 Angular、Vue、React 等框架的「革命」浪潮所淹没。 微前端的概念自从火爆以来，对于JS隔离和css的隔离成为了众多开发者的解决的主要方向 什么是CSS隔离： css一旦生效，就会应用于全局，所以很容易出现冲突。css隔离就是为了解决这个问题。 当我们作为前端开发人员较长一段时间后，我们很轻易地就能想到为什么需要css隔离，抛弃微前端的概念不谈，就算当前流行的前端框架也在解决css隔离的路上做出了相应的动作，其中就有Vue，虽然

（operational-transformations） 此篇文章写给一同在进行ot算法实践中的朋友们，希望抛砖引玉，有对ot算法感兴趣的小伙伴可以联系我一下，目前关于此算法的一些细节处理上我还有一点点的疑惑部分，希望能讨论解决 Purpose 目的 在目前的ot算法中，您并不知道两个字符串是如何将一个字符串转换为第二个字符串的，在使用操作转换(operational-transformations，OT)时，您必须知道文本块何时被插入、删除或替换。您只处理字符串中的连续更改(连续意味着所有更改都在一起)。从来没有超过一组的变化) 即可。 Here’s an example: 下面是一

因为很多种原因，昨儿学习了一下Jenkins部署，感受到了”詹金斯”的巨大魅力 为什么要使用它？ 简单概括一句就是为了让部署更简单，更方便，更傻瓜，部署工作能一劳永逸 Jenkins是一种使用Java编程语言编写的开源持续集成软件工具，用于实时测试和报告较大代码库中的孤立更改。 Jenkins软件使开发人员能够快速找到并解决代码库中的缺陷，并自动进行构建测试。 简单介绍一下如何部署JAVA应用 运行jenkins 如果要是对我而言我认为最简单的就是下载Jenkins官网上的war包，直接放入tomcat中或者直接运行官网地址 左侧是正式版本，建议生产项目使用，右侧是测试版本，可用于

万恶的IEEE_754规范 ，直接让雪花算法全盘崩 1.事情为什么发生？ 事情还要从ID的架构说起，ID在架构师的要求下，我们改成了雪花算法（Snowflake）生成ID 简单的介绍一下雪花算法，SnowFlake算法生成id的结果是一个64bit大小的整数，它的结构如下图： SnowFlake可以保证： 1. 所有生成的id按时间趋势递增 2. 整个分布式系统内不会产生重复id（因为有datacenterId和workerId来做区分） 这样在遇到系统扩容，分库分表，数据迁移的场景下都不会出现太大的问题 大家伙一讨论，都觉得非常合理，就决定一股脑用雪花算法生成主键ID了 例

简述基础中剩下的部分BIO，NIO，粘包/拆包，多路复用等 BIO，NIO和AIO 简介： BIO：同步阻塞式IO，服务器实现模式为一个连接一个线程，即客户端有连接请求时服务器端就需要启动一个线程进行处理，如果这个连接不做任何事情会造成不必要的线程开销，当然可以通过线程池机制改善。 NIO：同步非阻塞式IO，服务器实现模式为一个请求一个线程，即客户端发送的连接请求都会注册到多路复用器上，多路复用器轮询到连接有I/O请求时才启动一个线程进行处理。 AIO(NIO.2)：异步非阻塞式IO，服务器实现模式为一个有效请求一个线程，客户端的I/O请求都是由OS先完成了再通知服务器应用去启动线程

简论HTTP和HTTPS 开门见山，这篇可以讲的很多 ，对于面试使用的不算太多，相对于TCP和UDP而言，HTTPS和HTTP这块可问的不算是太多 HTTP协议的缺点 * 通信使用明文，内容可能被窃听(重要密码泄露) * 不验证通信方身份，有可能遭遇伪装(跨站点请求伪造) * 无法证明报文的完整性，有可能已遭篡改(运营商劫持) HTTPS能解决这些问题吗？ 能，https是在http协议基础上加入加密处理和认证机制以及完整性保护，即http+加密+认证+完整性保护=httpshttps并非应用层的一种新协议，只是http通信接口部分用ssl/tls协议代替而已。通常htt

基本记录一下网络基础(TCP和UDP)的知识 UDP和TCP UDP 首先说一下概念，UDP是一种无连接传输层协议，提供面向事务的简单不可靠的信息传输服务 特点： 1.udp是无连接的，也就是发送数据包无需建立连接，并因此减少了开销和发送数据之前不必要的时延 2.使用尽量努力交付数据 3.是面向报文的 可能你会有这样的疑问？那么为什么不直接使用IP协议而是要重新定义出一个UDP呢？ 一个重要的原因的是IP协议并没有端口，UDP可以多通道，将数据送到对应的接口里面去 TCP 首先说一下概念，TCP是一种面向连接、可靠、基于字节流的传输协议，属于5层或者7层网络协议中的传输层协议

简论微前端的意义与发展 PS：以下言论部分整理于网友 先说一下为什么需要微前端 我抛出两个场景，大家思考一下： 1.新入职一家公司，老板给你一个5年，甚至于10年的老项目，需要你在这个项目上加入其他功能 2.你们起了一个新项目，老板只给了一个要求，要这个项目的架构在3年甚至于5年后依旧保持活力，不论为遗产项目 第一个场景我们初步一想，可以啊，我只需要把新功能用 react/vue 开发，反正他们都只是 ui library，给我一个dom 节点我想怎么渲染怎么渲染。但是你有没有考虑过这只是浮在表层的视图实现，沉在底下的工程设施呢？我要怎么把这个用 react 写的组件打出一个包，并且集成

html页面的元素有好多，分块儿级元素，行内元素，行内块儿级元素 块儿级元素 ：像div，p，h这种的，不管宽是多少都占一整行 行内元素：像span，a，label啊，i这种的，如果写好几个就挨着排队，而且width、margin-top,margin-bottom、padding-top对行内元素都没有用， padding-left,right,bottom和margin-left、margin-right是好用的，也就是margin的竖直方向上数值无效，padding只有padding-top数值无效 1.子债父偿： 一个父元素margin：0；子元素给定margin-top:10

在微信小程序web-view跳转外部链接？甲方的需求千奇百怪，好在办法总比困难多。不是只允许业务域名吗，不大可能在别人网站放一个 txt 校验吧？此时反代不失为解决业务域名限制的一个办法，总之一切为目标服务。 ⚠️ 就算绕开了限制，由于内容经你方服务器转发，你方也须承担责任。另请注意，撰文时个人类型的小程序暂不支持内嵌网页。本文假设我方域名 yourdomain.com，对方域名 example.com。 1)proxy_pass转发下？感觉事情没那么简单。 1 2 3 4 5 6 7 location / { ... proxy_pass https://examp

今天突然思考到一个问题，index.html文件中是vue项目的主页，项目入口，那么mainjs是啥时候被index加载运行的呢？是怎么被运行的呢？ 1.先来看看vue项目的一个结构解析（非常感谢磊阿磊阿磊磊磊的图片） index.html—主页，项目入口 App.vue—根组件 main.js—入口文件 2.通过2张图片搞清楚index和mainjs的关系和配置 很明显看得出，mainjs中是配置了咱们的页面该渲染在index中的app节点上的，但是vue项目访问最开始的文件是index.html，这中间mainjs是如何被indexhtml引用的呢？ 3.最后在packag

对电影《八佰》的一小点看法 情人节当天晚上本来以为加班，没想到竟然准时下班，遂去看看《八佰》 八佰 在这几年的战争片论拍摄技术来说确实可以说是国内顶尖水平，无论是拍摄技巧，手法，抑或是整体画面的布局 还有演员的演技都是一直在线 真实历史 谢晋元率420人在四行仓库与日军厮杀4天，死伤38人，毙伤日军200余人。 4天后，谢晋元奉蒋介石命率部382人退入英租界，由英国人掩护撤出上海。 然而，英国人突然变卦，强行收缴了将士们的武器并将他们关在租界北部的一个战俘营里。 关押生活持续了近3年，期间谢晋元将军被叛徒杀死。 珍珠港事件后，日军向英宣战并攻入了英租界，将剩余将士俘虏后罚为苦役。 至1

推荐一个css抖动库 CSS Shake 是一套 CSS3 动画特效，让页面的 DOM 元素实现各种效果的抖动（Shake）， 这些效果可以轻松的被应用到按钮、LOGO 以及图片等元素。 所有这些效果都是只需要单一的标签，加上特定的 class 即可。 因为使用了 CSS3 过渡、转换和动画效果，因此只支持 Chrome、Firefox 和 Safari 等现代浏览器。 官网:http://elrumordelaluz.github.io/csshake/

全站利用pjax无刷新展示 前言 终于抽出空写这篇文章了，还是在上班事件摸鱼写的 不得不说，pjax很好用，很强，很好理解，并且帮助开发者省去了很大部分的工作量 但是由于整站替换后，有些事件还是得自己写一下 简单的记录一下，自己实现全站pjax的一系列过程吧 简介 虽然传统的 ajax 方式可以异步无刷新改变页面内容，但无法改变页面 URL，因此有种方案是在内容发生改变后通过改变 URL 的 hash 的方式获得更好的可访问性（如 https://liyu365.github.io/BG-UI/tpl/#page/desktop.html）， 但是 hash 的方式有时候不能很

Trilateration（三边测量）是一种常用的定位算法 已知三点位置 (x1, y1), (x2, y2), (x3, y3) 已知未知点 (x0, y0) 到三点距离 d1, d2, d3 以 d1, d2, d3 为半径作三个圆，根据毕达哥拉斯定理，得出交点即未知点的位置计算公式： ( x1 - x0 )2 + ( y1 - y0 )2 = d12 ( x2 - x0 )2 + ( y2 - y0 )2 = d22 ( x3 - x0 )2 + ( y3 - y0 )2 = d32 设未知点位置为 (x, y)， 令其中的第一个球形 P1 的球心坐标为 (0, 0)，P2 处于相

DoraemonKit /‘dɔ:ra:’emɔn/，简称DoKit，中文名 哆啦A梦，意味着能够像哆啦A梦一样提供给他的主人各种各样的工具。Just Do Kit。 DoraemonKit是什么？ DoraemonKit 是一个功能平台，工具集合，和名字一样，哆啦A梦，能够让每一个 App 快速接入一些常用的或者你没有实现的一些辅助开发工具、测试效率工具、视觉辅助工具，而且能够完美在 Doraemon 面板中接入你已经实现的与业务紧密耦合的一些非通有的辅助工具，并搭配我们的dokit平台，让功能得到延伸，接入方便，便于扩展。 DoraemonKit有什么特色？ 1、DoraemonK

给喵喵板块更新一篇文章，介绍一下猫鼻支的防范和治疗 我发现鼻支是困扰各位主子最多的问题，到底是感冒还是鼻支呢？怎么治疗？ 猫同时出现喷嚏鼻涕眼睛红肿流泪，这就是鼻支，准确的说是猫上呼吸道综合征，只要及时治疗，一般都能痊愈，但也有一些久治不愈，最后出现后遗症或者死亡的情况。鼻支造成死亡的情况不多，一般都是因为鼻支导致呼吸不通畅，引起肺部感染导致死亡，即由上呼吸道感染导致了下呼吸道感染。鼻支不传染人，但在猫之间传染性很强，通过接触，喷嚏等方式传播，所以如果家里多猫环境出现疑似鼻支情况最好先隔离。 通过体检PCR可以检查出很多猫都携带鼻支病毒，包括猫疱疹病毒、猫杯状病毒、猫衣原体、猫支原体和波士杆菌

整理一下关于jq队列和回调 jq队列 首先说一点jQuery的队列依赖缓存机制事件，它同时是animate的基础 它不像事件机制、缓存机制、回调机制一样有自己的命名空间，由于比较简单，所以直接挂在到$和jQuery对象上 它提供的基础方法有 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 jQuery.extend({ queue: function( elem, type, data ) { 　　var queue; 　　 // 如果存在e

谷歌浏览器新标签页插件 项目地址：https://github.com/jingzheins/poetrytab.git 谷歌浏览器新标签页插件 V1.0 1）使用必应首页图片作为背景 2）加入当然时间跳动效果 3）加入各个搜索引擎条件 4）配合”一言”API进行底部优化 V1.1(预计2020/8/7更新) 1）加入备忘录 2）加入定时器、闹钟、提醒 3）加入实时天气预报 4）加入背景切换 5）加入修改’Name’ 使用方法很简单 1.下载该目录 2.在谷歌浏览器打开chrome://extensions/ 3.点击右上角的 “ 开发者模式 “ ,打开开发者模式 4.点击 “加载已解压的

本文将从零搭建前端和服务端，实现一个大文件上传和断点续传的 demo 前言 本文将从零搭建前端和服务端，实现一个大文件上传和断点续传的 demo 前端：vue element-ui 服务端：nodejs 文章有误解的地方，欢迎指出，将在第一时间改正，有更好的实现方式希望留下你的评论 大文件上传 整体思路 前端 前端大文件上传网上的大部分文章已经给出了解决方案，核心是利用 Blob.prototype.slice 方法，和数组的 slice 方法相似，调用的 slice 方法可以返回原文件的某个切片 这样我们就可以根据预先设置好的切片最大数量将文件切分为一个个切片，然后借助 http

将监控猫猫的监控放到博客上并且定时关闭摄像头 需求很简单，作为一个拥有猫猫的程序员来说，观察自己的猫猫每天在干什么很重要， 于是乎，装了监控，为了分享给朋友们一起云撸猫，特意将摄像头的视频流推送到博客上 第一步 选方案 因为家里的摄像头是rtsp协议的，想在网页上观看只能选择转码推流，那么大致方案就敲定下来了 因为家里的nas上还有其他程序再跑，最终选中docker容器作为载体 1.Ffmpeg 2.nginx 3.docker 第二步 搭建Docker 环境：centos7 1、Docker 要求 CentOS 系统的内核版本高于 3.10 ，查看本页面的前提条件来验证你的Cent