最近由于工作需要研究了 Prosemirror 和基于 React 的 Prosemirror 编辑器 rich-markdown-editor ，并尝试在 rich-markdown-editor 的基础上实现能够拖拽块级节点的功能。 1. 总体思路 本文中涉及的概念参考了 Prosemirror 官网 和 xheldon 翻译的中文版 指南 和 API 文档 。 在 Prosemi...
矩阵和矩阵变换
1. Web 中的矩阵 在 Web 开发中经常见到矩阵的身影，比如： SVGGraphicsElement.getScreenCTM() 返回的 DOMMatrix 是一个 4 X 4 的矩阵，适用于 2D 和 3D 操作，包括旋转和平移。 CSS 函数 matrix(a, b, c, d, tx, ty) 指定了一个由 6 个值组成的 2D 变换矩阵...
如何把鼠标坐标转换成svg内部坐标
1. 概述 最近在工作中碰到了一个问题，当 svg 的父元素存在 transform 属性（旋转、缩放、平移或倾斜）时，如何把当前鼠标所在的坐标转换成 svg 内部坐标。这个问题在 stackoverflow 中得到了解答。 同时也发现了在 firefox 中存在 BUG ，因为 svg.getScreenCTM() 并没有计入 svg 父元素的 transform 。这个 BUG 于 ...
Service Worker 研究
1. CRA中关于offline-first的考虑事项 原文档地址 在初始缓存完成后，service worker生命周期控制着更新的内容何时最终被显示给用户。为了防止与懒惰加载的内容出现竞争条件，默认行为是保守地将更新的Service Worker保持在 “等待” 状态。这意味着用户最终会看到较旧的内容，直到他们关闭（重新加载是不够的）他们现有的、打开的标签。关于这种行...