- 博客(22)
- 收藏
- 关注
RSS订阅原创 一行代码搞定前端可视化大屏自适应，开箱即用
因为可视化大屏大部分情况是在大屏幕上显示，比如电视机，显示器等，这些屏幕的分辨率一般都是。做个多个可视化大屏项目后，我们团队最终选择了第一种方案，也就是随意缩放。）不会触发（类似 mac 的屏幕就不会有），更多是出现在普通屏幕上（屏幕的宽高和设计稿的宽高比例，就是缩放比例，通过设置。不同的图表，地图组件使用的缩放可能不一样，有些会用。所以进行缩放时，尽量保持一致，避免不必要的 bug。时，就进行缩放，另一个方向的缩放比可以保持不变。，宽高都会缩放，也就变成了整体缩放。做缩放的技术，主要是。
2023-06-03 13:34:19
1762
原创 组件卸载时 DOM 树的自动清理机制是怎样的
react从根组件开始遍历，寻找的fiber在遍历时，会检查每个fiber的deletions如果有则暂停的遍历，先处理deletions处理完deletions后，再继续遍历的fiber在处理deletions时，会先向下遍历，然后再向上遍历向下遍历时，执行的返回函数向上遍历时如果遇到sibling，则会沿着sibling向下遍历将fiber的所有属性置为null，释放内存直到遇到结束处理deletions根节点的返回的函数会单独处理。
2023-04-18 11:18:09
125
原创 《图解 Google V8》事件循环和垃圾回收——学习笔记（三）
这是第三篇/共三篇：事件循环和垃圾回收通过这个专栏的学习，V8不在是个陌生的黑盒了，变成了一个熟悉的黑盒，因为这个专栏让你了解了V8的大致原理，面试时吹吹牛皮还是可以的，不过也就仅此而已，细节方面还需要自己去深入。
2023-02-10 15:38:02
428
原创 《图解 Google V8》编译流水篇——学习笔记（二）
这是第二篇：编译流水线V8JavaScriptJavaScriptV8特别是第二点，让我看到了使用TypeScript的好处，动态语言存在的问题，静态语言都可以解决。
2023-02-08 17:21:42
327
原创 《图解 Google V8》设计思想篇——学习笔记（一）
最新在学这个专栏的优点是：写的通俗易懂，没有涉及V8源码部分，对于前端还是比较友好的，学完之后能够知道写下一段js代码后，V8背后都做了哪些事情这个专栏的不足之处是：没有对技术进行深入讲解，只讲了这个技术是用来解决什么问题的，以及它是怎么工作的所以这个专栏比较时候对V8还不了解的同学去学习，增加自己的知识面下面是我自己学习每一章的总结，主要记录我在这章中学到内容，并不是对这章完整的总结我会分为三篇来写，这是第一篇：设计思想篇。
2023-02-07 12:21:35
2059
原创 《如何成为学习高手》精华摘录
学完高冷冷的，我也曾不停的寻找各种学习方法她讲的很多方法在之前就已经知道了，不过没有运用起来比如拆解任务这块，我还是不知道怎么把大任务拆解成一个个可执行的小任务举个例子，学习 Java 可以完成 CURD 工作，如何把这个任务拆解成小任务我不会这就涉及到 Java 语法、ORM 框架、数据库等每一块都可以往下深挖很久我又是一个比较关注细节等人，遇到一个不懂的点就会深入下去，然后被带偏了，很在难回到主线上了。任务拆解这块她没有很深入的讲，比较遗憾。
2023-02-04 11:49:15
122
原创 如何在 React 中优雅的使用 addEventListener
这个问题困扰了我很久，写业务时，我一直用方法一，随着依赖项越来越多，维护是个噩梦（方法三也是噩梦）我一直在想如何在中拿到最新的state今天本来想记录下方法一和方法三的在一点点写下笔记的时候，发现了方法二，可以利用闭包解决事件卸载问题，从而又发现了优化维护依赖项的方法如果今天不写笔记，这个问题还会继续困扰着我。
2023-01-30 17:08:46
1392
原创 Promise基础（消化错误和抛出错误）
函数的一种特例，相当于 `then(result => result, err => new Promsie((_, reject) => reject(err)));函数不管接收什么参数，都会原封不动的向后传递，作为后续方法的参数。函数中默认返回的都是成功，如果需要返回失败需要显示调用。如果这两个回调函数没有写返回值，默认会。函数中，如果没有显示抛出错误，默认会。函数的会接收两个回调函数，一个是。是什么状态都会执行，也是。函数的一种特例，相当于。状态时的简写，相当于。状态是的简写，相当于。
2022-12-14 20:56:49
129
原创 在Canvas中绘制Geojson数据
这样的目的是为了那个点无限接近于原点，接近原点后，再通过乘以缩放比例和加上偏移度，得到最终的的缩放值。在需求分析时说了，屏幕的原点在左上角，地图的原点在左下角，所以。比较难理解的是第一步，为什么要将每个点去减它的最小值。，因为用小的缩放比例，才能在有限的空间下显示全。在做地图开发的时候遇到一个需求，是在。这些空间要分布在两边，也就是说要分布。大小，所以这个方案适用于绘制缩略图。进行缩放，纬度也是同理。的周围，所以左后需要除。
2022-11-16 17:13:08
335
原创 在 OpenLayers 中清除数据
在OpenLayers中，各个概念的顺序是map->layer->source->feature->geometry->你要操作layer的话是在map上，操作source是在layer上，依次类推当数据变化时，就需要将之前的数据清除掉在OpenLayers方法是在source上，所以先要获取到source在react中，你可以将source保存为状态，就可以在页面中任意位置使用source，就不需要再通过方式获取方法是在map上，使用比较简单在react中要注意的，layer也要保存到状态中，否则。
2022-10-31 13:16:08
4452
原创 在 Openlayer 中添加 mark，并添加 hover 效果
具体的实现方式我没有去尝试，通过上面的推断，我觉得是可行的。，如果不是空数组，说明你鼠标正在。如果有多个点的话，可以生成多个。返回的函数清理地图中的。事件，所以可以直接在。，显示你想要显示的内容。
2022-10-27 09:20:33
341
1
原创 学习自己写TS中的描述文件
在ts中直接使用jQuery，是会报错的，一般情况是直接安装一个已写好的jQuery.d.ts文件不过这次是自己学习写一下jQuery.d.ts文件。$(function(){ alert(1111) }) // $ 会报错$(function(){ $("body").html("<div>123</div>") }) //内部 $ 也会报错定...
2020-01-29 10:31:02
1105
原创 小程序中设置缓存过期
需求是两张图片在这个时间段内交替显示，当天只弹一次图片。后端返回的数据格式：{ "start": "2019/10/08 00:00:00", "end": "2019/10/30 23:59:59", "ads": [ { "image": "xxxx", "uri": "wechat:zhizhuxy6...
2020-01-14 00:05:41
253
原创 小程序中解决网络请求缓存
需求提交小程序审核时，有一个体验测评，产品让我们根据小程序的体验测评报告去优化小程序。其中有一项是网络请求的优化，给我们出了很大的难题。文档中是这样解释的：3分钟以内同一个url请求不出现两次回包大于128KB且一模一样的内容看到这个问题的时候，首先想到的是在响应头上加上cache-control，经过测试发现小程序并不支持网路请求缓存。搜索发现官方明确答复，小程序不支持网络请求缓存：wx...
2019-12-29 00:03:25
1007
原创 javascript基本语法学习总结
语句和表达式表达式和语句的区别在于，语句是为了进行某种操作，一般情况下不需要返回值，而表达式是为了得到值。一般情况下，在javascript中每一行就是一个语句。let a = 1 + 3这是一条赋值语句，其中1+3就是语句。标识符在javascript中，第一个字符可以是Unicode字符或或者$或者_或者中文。后面的字符，除了上面所说的，还可以是数字。合法标识符：let _ ...
2019-09-14 17:41:40
126
原创 浏览器渲染及动画
浏览器渲染原理：浏览器在渲染页面之前会先构建DOM树和CSSDOM树。HTML会转换成文档对象模型DOM，CSS会转换成CSS对象模型CSSDOM。它们两个是互相独立的数据结构。DOM和CSSDOM组合在一起形成渲染树。遍历DOM树节点对每个DOM节点用合适的CSSDOM规则去匹配计算出最终布局，样式最后将它们合并到一起，渲染在页面中样式更新浏览器将页面渲染好之后，后...
2019-09-14 11:52:43
165
原创 浅析URL
什么是URL统一资源标志符，简称URI，它有两种常见的形式：统一资源定位符——URL统一资源名称——URN他们的区别是：URL一般被称为网址（地址），比如baidu.com。通过URL打开的网址，内容是不确定的URN可以确定唯一的内容，类似我们的身份证。最常见的就是用在书中，每本书出版前必须有一个URN，通过URN就可以找到这本书。URL组成URL由六部分组成，分别是：...
2019-09-14 11:49:40
237
原创 JavaScript历史学习总结
javascript历史1994年网景公司，发布了 Netscape 浏览器，因此急需一门脚本语言，使得网页可以和人互动。1995年网景公司，录用的 Brendan Eich，让他担任这门语言的设计师。公司要求这门语言必须看上去“与java足够相似”，但要比java简单，要让非专业的网页制作者也能很快的上手。但 Brendan Eich 对java一点兴趣也没有，他喜欢函数式编程，喜欢sc...
2019-09-14 11:46:51
117
原创 canvas入门——圆绘制
arc语法：arc(x, y, radius, startAngle, endAngle, anticlockwise)前面两个参数是x坐标，y坐标，第三个参数是半径，第四个参数是开始的弧度，第五个参数是结束的弧度，第六个参数是顺时针还是逆时针，默认是顺时针。看下面代码，这样就能绘制一个圆了。ctx.arc(100, 100, 50, 0, 2 * Math.PI)ctx.stroke(...
2019-09-08 22:34:46
506
原创 【canvas】canvas入门——用canvas制作倒计时项目总结
项目演示点阵在canvas中绘制数字，可以使用点阵的方式。下面是5的点阵布局，1代表要绘制，0代表不要绘制。这里数字采用的是10 * 7的网格系统，冒号是10 * 4的网格系统。[ [1, 1, 1, 1, 1, 1, 1], [1, 1, 0, 0, 0, 0, 0], [1, 1, 0, 0, 0, 0, 0], [1, 1, 1, 1, 1, 1, 0], [0...
2019-09-08 22:32:32
293
原创 canvas入门——线段绘制
moveTo、lineTo使用canvas绘制一条线段，默认已经拿到canvas的上下文context绘制一条直线需要使用context提供的moveTo、lineTo方法moveTo是线段的起点，lineTo是线段下一个点，最后使用stroke进行描边。如下代码context.moveTo(100,100)context.lineTo(200,200)context.stroke()...
2019-09-08 15:42:51
974
原创 【重学前端学习笔记】关于类型，有哪些你不知道的细节
在学习《关于类型，有哪些你不知道的细节》一章节中，讲到了javascript内置了Symbol.toPrimitive属性，可自定义类型转换操作。typeof我们最常使用typeof来进行类型检测，对于基本类型使用typeof能得到我们想要的结果console.log(typeof '123') //'string'console.log(typeof 123)...
2019-08-19 21:06:45
123
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人