摘要: 前言 前些天在看Dan Abramov个人博客(推荐阅读,站在React开发者的角度去解读一些API的设计初衷和最佳实践)里的一篇文章,其重点部分的思想就是即使不使用Memo(),也可以通过组合的方式来减少组不必要的渲染。 作者在放出代码讲述结论的时候并没有细说原理只是一笔带过,所以笔者自己想着从R 阅读全文
posted @ 2023-01-02 23:35 爱喝可乐的咖啡 阅读(833) 评论(1) 推荐(2) 编辑
摘要: SOLID原则是由人称”鲍勃大叔“的Rober C. Martin所提出来的。他用五个面向对象设计原则的首字母组成了SOLID,并使其得到了广泛传播。这五个原则罗列如下: 单一指责原则(Single Responsibility Principle):类的职责应该是单一的。所谓单一,是从变化的维度衡 阅读全文
posted @ 2024-08-02 11:14 爱喝可乐的咖啡 阅读(161) 评论(0) 推荐(2) 编辑
摘要: 原生的渐变方法 在SVG中提供的原生渐变方法有两种,分别为线性渐变linearGradient和径向渐变radialGradient。我们以一个稍微复杂的路径来作为模板,为其添加两种渐变效果: <svg width="800" height="300"> <defs> <linearGradient 阅读全文
posted @ 2024-02-17 00:10 爱喝可乐的咖啡 阅读(784) 评论(0) 推荐(3) 编辑
摘要: 前言 在一款TD游戏中,最重要的单位就两大类:防御塔(Tower)和敌人单位(Enemy)。在处理敌人单位的AI行为时,最基本也是最重要的就是自动寻路。在各式TD游戏中,防御塔的攻击方式以及敌人单位的Buff机制往往是能做出差异化的地方;而在寻路问题上,几乎是没有差异的,面对的都是同一套问题模型。 阅读全文
posted @ 2024-01-24 21:59 爱喝可乐的咖啡 阅读(476) 评论(0) 推荐(2) 编辑
摘要: 接口定义 能够对于文字、段落乃至任何元素的精准定位 并做出增删改查,都是在开发一款富文本编辑器时一项最基本也是最重要的功能之一。让我们先来看看Slate中对于如何在文档树中定位元素是怎么定义的[源码]: /** * The `Location` interface is a union of the 阅读全文
posted @ 2023-10-02 23:49 爱喝可乐的咖啡 阅读(402) 评论(0) 推荐(0) 编辑
摘要: 问题描述 项目现场的前端项目在点击顶部的导航栏切换不同的模块时,会有小概率出现模块加载报错的情况: 我们的前端项目里是有基于react-loadable做的懒加载的,上图的12.be789340.chunk.js就是懒加载需要请求的模块。现场复现问题时出错的模块每次都可能不一样,并且出现问题的频率也 阅读全文
posted @ 2023-03-04 16:51 爱喝可乐的咖啡 阅读(220) 评论(0) 推荐(0) 编辑
摘要: 源码架构 首先来看下最核心的slate包下的目录: 可以看到,作为一个开源富文本库,其源码是相当之少。在第一篇文章中说过,Slate没有任何开箱即用的功能,只提供给开发者用于构建富文本所需的最基本的一套schema及操作API。因此源码的体量自然就要少许多。 我们来预览上图中各个目录下文件所负责的功 阅读全文
posted @ 2023-02-27 10:20 爱喝可乐的咖啡 阅读(358) 评论(0) 推荐(2) 编辑
摘要: 笔者从大学时期就开始接触的前端,在刚去实习的时候就被导师安排去做内网的一个小富文本工具。之后从毕业后干的第一份工作游戏客户端,到现在做着可视化相关的前端工作,都有在做富文本相关的内容。可以说是和**富文本编辑器(Rich Text Editor)**有着不解之缘。 WYSIWYG 如无特别指出,该系 阅读全文
posted @ 2023-02-23 20:17 爱喝可乐的咖啡 阅读(391) 评论(1) 推荐(1) 编辑
摘要: 今天本来正在工位上写着一段很普通的业务代码,将其简化后大致如下: function App(props: any) { // 父组件 const subRef = useRef<any>(null) const [forceUpdate, setForceUpdate] = useState<num 阅读全文
posted @ 2022-10-27 22:28 爱喝可乐的咖啡 阅读(343) 评论(0) 推荐(0) 编辑
摘要: 本文是根据Mariko Kosaka在谷歌开发者网站上的系列文章https://developer.chrome.com/blog/inside-browser-part4/翻译而来,共有四篇,该篇是第四篇。对于其中一些直译出来不太好理解的句子,笔者做了加工处理和提炼。 输入来到了合成器 在上篇文章 阅读全文
posted @ 2022-07-20 17:21 爱喝可乐的咖啡 阅读(114) 评论(2) 推荐(2) 编辑
摘要: 本文是根据Mariko Kosaka在谷歌开发者网站上的系列文章https://developer.chrome.com/blog/inside-browser-part3/ 翻译而来,共有四篇,该篇是第三篇。对于其中一些直译出来不太好理解的句子,笔者做了加工处理和提炼。 渲染器进程的内部工作 在前 阅读全文
posted @ 2022-07-15 18:57 爱喝可乐的咖啡 阅读(166) 评论(1) 推荐(2) 编辑
摘要: 本文是根据Mariko Kosaka在谷歌开发者网站上的系列文章https://developer.chrome.com/blog/inside-browser-part2/ 翻译而来,共有四篇,该篇是第二篇。对于其中一些直译出来不太好理解的句子,笔者做了加工处理和提炼。 在导航中发生了什么 在上一 阅读全文
posted @ 2022-07-08 11:47 爱喝可乐的咖啡 阅读(119) 评论(1) 推荐(1) 编辑
摘要: 本文是根据Mariko Kosaka在谷歌开发者网站上的系列文章https://developer.chrome.com/blog/inside-browser-part1/ 翻译而来,共有四篇,该篇是第一篇。对于其中一些直译出来不太好理解的句子,笔者做了加工处理和提炼。 CPU,GPU,内存和多进 阅读全文
posted @ 2022-07-02 18:37 爱喝可乐的咖啡 阅读(192) 评论(1) 推荐(1) 编辑
摘要: Javascript的一些基础概念 JavaScript执行引擎在宿主环境中是单线程的,这意味着在同一时间内只能执行一个任务。在Javascript运行期间,引擎会创建和维护相应的堆(heap)和栈(stack)这两个数据结构;堆是存放数据变量的地方**(这里很多前端er有个误区,认为js的引用类型 阅读全文
posted @ 2022-06-17 18:20 爱喝可乐的咖啡 阅读(273) 评论(1) 推荐(1) 编辑
摘要: 预期是写一个如下所示的布局内容: 即有一个固定高度的外部容器,顶部的header已知高度,在header占据了固定高度后,剩下的都分给body部分。因此采用flex布局,header设置flex-shrink为0,不自动收缩,body则flex-shrink为1,使其高度压缩为剩余高度。这个操作看起 阅读全文
posted @ 2022-05-02 23:06 爱喝可乐的咖啡 阅读(185) 评论(0) 推荐(1) 编辑
摘要: 本文不是关于Slate.js使用入门的文章,如果还不了解该框架,建议先阅读下官方的文档:Slate官网文档 关于Slate的一些特性 不同于其他编辑器类的库,Slate并不提供譬如粗体、斜体、字体色等开箱即用的功能 Slate只是提供了一套自己定义的核心数据模型,以此一些操作数据和选区相关的API 阅读全文
posted @ 2021-07-08 20:08 爱喝可乐的咖啡 阅读(3367) 评论(0) 推荐(3) 编辑
摘要: 最近撸React的代码时踩了个关于事件处理的坑,场景如下:在监听某个元素上会频繁触发的事件时,我们往往会对该事件的回调函数进行防抖的处理;防抖的包装函数大致长这样: debounce = (fn, delay) => { let timer: any = null; return function( 阅读全文
posted @ 2020-09-12 18:21 爱喝可乐的咖啡 阅读(373) 评论(0) 推荐(1) 编辑
摘要: 公司移动端项目是基于Unity的,底层支持由C#提供,上层Lua调用C#中注册的函数支持来做业务逻辑,框架用的是ToLua。开始做移动端有一段时间了,一直都觉得调试代码是个很蛋疼的体验:几乎都是靠肉眼看代码和加打印来做调试的。季度面谈时反映了下,之前大家都没太在意这个问题也就这么过来了,这次提出来了 阅读全文
posted @ 2020-03-27 23:23 爱喝可乐的咖啡 阅读(4712) 评论(0) 推荐(0) 编辑
摘要: 函数与闭包 函数创建 创建函数有两种方式,第一种是函数声明。函数声明有一个很重要的特征就是函数声明提升(function declaration hoisting),意思是在执行代脚本前会先读取所有的函数声明。这意味着可以把函数声明放在调用它的语句后面: 第二种方式是函数表达式: 既然是叫表达式,那 阅读全文
posted @ 2020-03-01 13:21 爱喝可乐的咖啡 阅读(172) 评论(0) 推荐(0) 编辑
摘要: 继承与原型链 原型链 在原型那一节中,讲到了用于搜索对象属性的原型搜索机制;而原型链,本质上 就是对原型搜索机制的扩充: 回想下之前的内容,我们要读取一个Person的实例p属性,会先搜索实例p;如果没有的话 就去它指向的原型上找,即Person.prototype。 如果,我们把原型指向另一种类型 阅读全文
posted @ 2020-02-29 18:41 爱喝可乐的咖啡 阅读(194) 评论(0) 推荐(0) 编辑