ProgerChai's Blog 
  • 首页
  • 归档
  • 标签
  • 关于
  •   
  •   

mac frp 穿透

mac frp 穿透 将自己的 mac 本机穿透到公网上去,通过自己的服务器访问 首先我们需要一台实体机,也就是我们的本机 mac 其次,我们需要一台能够访问到公网的机器,可以是云服务器 我的云服务器是腾讯云,Ubuntu 18.04.1 其次我们需要下载一个工具 frp 下载地址:https://github.com/fatedier/frp/releases ,可以根据自己的机器版本,在这里

2021-08-03
Linux frp

geojson数据抽稀

geojson 数据抽稀 接上一篇手绘地图实现,其中通过借助工具将 svg 导出 geojson 数据,但是通常数据量非常大,而且有很多重复的点数据/非常相近的数据 这样的数据,虽然可以用,但是考虑到前端性能问题,需要将 geojson 数据进行点抽稀目前有很多的抽稀算法,比如道格拉斯-普克算法、垂距限值法,这里暂时不做讨论 这里可以借助另外一个宝藏工具Turf(https://github.c

2021-07-26
前端 性能 geojson Turfjs

手绘地图实现

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
12

搜索

Hexo Fluid
总访问量 次 总访客数 人
浙ICP备18056527号-2 | police-icon 浙公网安备 30157477088504851