手绘地图实现 Echarts 手绘地图实现 业务中需要实现一个手绘地图，原计划是使用 Eva，但是时间有限，最后使用 Echarts 实现，实现效果如下。 （动图太大了，尽可能压缩稍微有点糊，见谅～） 业务中，如上图所示，内部有很多的元素都需要有相应的事件，需要整个地图尽可能地解耦。并且内部有板块/图片/路线等元素。 那么接下来分析一下，这样一个页面有那些需要实现的内容 分析页面 底图 底部有一层图片，没有 2021-07-23 前端 Echarts
字体文件优化 缩小字体大小 业务场景中，经常会出现各种华丽呼哨的字体，就只有几个字使用这个字体，但是字体文件通常都 1M，4M，5M，6M 等等，各种压缩才压缩个几兆代码，一个字体文件直接白干了。所以通常需要将这类只有少部分字体使用的字体文件进行压缩。方式就是从原有的字体文件中，取出我们明确使用的重新生成一个字体文件就可以了。 这里介绍一个需要 java 环境的方法工具链接：https://github.co 2021-07-21 前端 性能 字体
用IntersectionObserver实现吸顶效果 用 IntersectionObserver 实现吸顶效果 开发中，需要实现一个二级工具菜单栏吸顶灯的效果 效果如下图 1，框选住的部分会在滚动的时候吸附顶部，在下滑的过程中，回到原来的位置时，又恢复 static 的效果，如图 2 思路方案一 : position:sticky本来第一个想到的时使用 css 的 position:sticky，达到吸附的效果，但是实践的时候发现，如果恢复到 2021-06-29 前端 性能 React
Antd upload压缩后，预览图模糊 Antd upload 压缩后，预览图模糊 需求：用户上传图片后，会用这个图片跑模型，所以图片大小会影响模型运行速度，需要尽量使图片在上传前先简单压缩一遍 我的方案：因为前端使用了 Antd ，所以在 beforeUpload 的时候，1.用 canvas 绘图 2.再 toDataURL 的到 base64 或者 Blob 转成二进制 3.转成 File 进行上传 关键代码如下： 123456 2021-06-25 Fix 前端
Fix:Taro与taro-ui版本不匹配问题 Taro 与 taro-ui 版本不匹配导致的问题相关报错：Module build failed (from ./node_modules/babel-loader/lib/index.js) 以及Module not found: Error: Can't resolve './style/index.scss' in '/Users/aiyouwei/Docu 2021-06-13 Fix 前端 Taro 小程序
Taro 配置 alias Taro 配置 alias 为了在 Taro 项目中，配置目录别名，方便引用路径，减少了很多../../的输入 官方文档地址: https://nervjs.github.io/taro/docs/config-detail/ 不过讲解的不是很清楚 12345// 正常相对路径引入import A from '../../componnets/A';import Util 2021-06-12 前端 Taro 小程序
性能优化指标获取项目build时间 性能优化获取项目 build 时间 前端在性能优化的时候，需要一些数据指标来判断性能优化的效果，例如 项目 build 花费了多少时间 代码如下： 123456789101112131415161718#时间戳startTimeStamp=$((`date '+%s'`*1000+`date '+%N'`/1000000))startTime=`date 2021-06-12 前端 性能 shell
Fix devtools 快捷键开启Debugger 失效问题 devtools 快捷键开启 Debugger 失效问题 前端有很多情况需要调试一些元素的 hover 效果,或者 active、popover 等一些会马上消失的状态的场景,但是可能那个状态需要你一直 hover 的时候才会存在,所以需要想办法在 hover 的时候,将页面 freeze 住,再去审查元素,调整样式 如下图 ,这样一个场景,需要调试一下 google 的搜索输入框 active 2021-05-25 前端 debug
视频内容智能审核方案调研 视频内容智能审核方案调研一览表 方案 七牛云 腾讯云 阿里云 华为云 计费方式 阶梯计费: 0 - 300 万张:0.085 元/百张;300 万张-1500 万张:0.075 元/百张;1500 万张-3000 万张:0.065 元/百张;3000 万-1 亿张:0.055 元/百张;1 亿张以上:0.05 元/百张 按时长收费 0.08 元/分钟 按时长收费 0.08 元/分钟 按时 2021-05-08 视频 智能审核 方案
强缓存确保用户获取新数据 & 微任务为什么少一次render 性能优化的两点补充1.强缓存如何确保用户拿到更改后的数据?强缓存分两种,一种是Memery cache,一种是Disk cache,如果用户的数据可以从强缓存中拿到,那么即使服务端数据被修改,在该资源还未过期的情况下,客户端还是会从缓存中拿取旧数据. 那么如何确保用户拿到更改后的数据呢?答案是: 用户强刷页面跳过http缓存获取新数据,或者是关闭 tab 页面,那么浏览器的Memery cache 2021-04-22 前端 性能 micro-task macro-task cache