- 博客(31)
- 收藏
- 关注
RSS订阅
原创 three.js性能优化
参考：火辣辣前端博客three.js是JavaScript编写的WebGL第三方库。提供了非常多的3D显示功能。在使用的时候，虽然three.js 做了优化，但是在使用不恰当的代码，也会产生性能损耗。帧率越低，给人感觉就越卡。这是我在开发中自己百度总结的，有不对的可以联系我啊1、预加载在加载页面之前可以给个加载页面的缓冲，因为场景模型没有加载的时候会黑屏，加载一瞬间可能会出现闪屏等性能问题，...
2019-04-02 17:56:01
3085
原创 npm yarn 一起使用报错
yarn 和 npm 的 全局安装位置 和 全局bin位置，最好设置在同一个盘符呢，这样 bin 目录中的 .cmd脚本文件中可以直接生成相对路径。若不在同一个盘符内，则将会生成绝对路径，由于使用了%~dp0\ 标识符，会导致找不到命令指向的模块。另外，如果会使用 npm link 或者 yarn link 时，建议 将所有路径都配置在C盘，因为 link 的全局范围，默认为C盘。
2024-03-11 15:24:40
1691
原创 前端vue3一键打包发布
一键打包发布可以分为两种，一是本地代码，编译打包后发布至服务器，二是直接在服务器上拉去代码打包发布至指定目录中。两种各有使用场景，第一种是前端开发自己调试发布用的比较多，第二种是测试或者其他人员用的多，前端开发将代码上传至git中，测试人员可以在服务器上拉取指定分支如release_V0.1，然后打包发布用于测试。
2023-05-12 14:00:36
3680
原创 uniapp发布微信小程序包太大
直接说总结 分包处理建议项目前期如果可以评估大小就开始做分包开发，以防到后期打包发布的时候发现超了，这时候做分包处理，其实改动蛮大的，会涉及到项目架构的调整，还有页面内导航的跳转链接修改参考链接 压缩vendor.js文件打包之后，这个文件里面会很大，里面是各种项目依赖文件，我有5MB ,就一个这个文件就直接超了小程序上限了。。。。。。分包之后还有3MB，所以需要压缩处理参考链接 图片不要放在本地，全部改为链接加载stattic里图片等静态资源可以.
2021-12-31 16:43:42
1359
2
原创 前端压缩打包 Vue+vite配合nginx实现gzip压缩
vue前端项目发布的时候，打包可配合nginx实现gzip格式的压缩，这样会减少网络带宽，nginx有两种压缩方式，一个是动态压缩，一个是静态压缩。1.在 nginx 中实时用 gzip 压缩文件输出，利用 nginx 中的模块 ngx_http_gzip_module， 消耗 CPU 来做压缩，nginx配置如下：官方配置文档说明http{ gzip on; gzip_min_length 1k; gzip_buffers 4 16k;
2021-12-02 14:01:21
1290
原创 vue3+vite+axios，处理跨域cookies问题
方法一：一般vite是可以配置跨域代理的，这个时候就不需要后端配合设置跨域了在.env.development 文件配置# vite 本地跨域代理VITE_PROXY=[["/basic-api","http://localhost:3000"]]# 接口地址VITE_GLOB_API_URL=/basic-api由于 /basic-api 匹配到了设置的 VITE_PROXY，所以上方实际是请求 http://localhost:3000/login，这样同时也解决了跨域问题。（3100为项
2021-09-06 16:00:00
5428
原创 前端对接海康威视监控
参考文章vue对接官方插件WebControl：https://blog.csdn.net/qq_41732963/article/details/115670910vue无海康官方插件对接：https://blog.csdn.net/qq_41732963/article/details/115655739海康监控流有多种协议实时串流协议（Real Time Streaming Protocol，RTSP）是一种网络应用协议，专为娱乐和通信系统的使用，以控制流媒体 服务器。该协议用于建立和控制终
2021-07-01 11:08:17
3661
原创 微信小程序实现长按拖动排序
在微信中经常会有拖动排序的功能，主要是基于catchtouchmove，计算top距离，图片我也上传了，下载修改一下图片路径就可以运行看到效果了，直接git下载就可007-微信小程序拖拽排序参考文章：微信小程序长按拖拽https://mp.weixin.qq.com/s/xgPKY6_7ze-1nbPjurom8Ahttps://blog.csdn.net/haicome/article/details/82664344?utm_medium=distribute.pc.
2021-07-01 11:05:57
1882
原创 移动端前端开发bug总结-持续更新
2019年9月11日 火辣辣％1 $ S1 关于微信jssdk分享这块的问题可以看上篇文章2 关于translate3D动画在iphone上闪屏的问题我是做一个transform：rotate(20deg)的旋转的时候，出现的这个问题，每次旋转屏幕会一闪动，我是通过position:fixed解决的webkit在绘制页面时会将结构分为各种层，当层足够大时就会变成很大的平铺层。这样一来webkit在每次页面结构发生变化时不需要都渲染整个页面而是渲染对应层了，这对渲染速度来说相当的重要。参考...
2021-06-02 10:06:09
177
原创 h5-ios和Android手机输入键盘总结-android软键盘弹出
2019年10月10日 火辣辣％1 $ S原因：ios当输入框聚焦弹出键盘的时候，页面高度没有变化，是分层的，软键盘是盖在网页上的Android的软键盘弹出的时候，软键盘是占据页面的高度的，这时候你的页面高度发生变化，页面上滑让给软键盘，你fixed底部的东西都会弹上去，页面高度为 页面+软键盘解决办法：iOS：这时候页面会出现滑动，想让页面不滑动，需要设置页面滑动到顶端 scrollTop(){ // ios页面滚动到最顶层 window.scrollTo(0,0);
2021-06-02 10:01:44
638
原创 css3-帧动画实现和优化
2019年10月10日 火辣辣％1 $ S实现帧动画好多种方式，如css3，gif动图，视频，js帧动画，很多做实验比较这几种方式的优劣，最终还是推荐了css3动画我就直接说实现方式把1 css3代码html：<div class="loadingMask"><div class="loadingMask-img"></div></div>css： .loadingMask{ position: absolute; width:
2021-06-01 18:07:22
164
原创 webpack打包时自动给js添加后缀名
2019年11月15日 火辣辣％1 $ S为了清楚浏览器缓存，可以在webpack打包的时候自动添加时间戳或者版本号，这样浏览器就可以加载新资源，清楚万恶的缓存～在vue中，利用vue-cli打包，会将vue.config.js中的configureWebpack配置合并到最终的webpack中，配置如下：// const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;// vue.co
2021-06-01 18:05:18
1323
原创 svg的简介-svg转png的坑
2020年3月27日 火辣辣％1 $ S我是不是消失很久了。。。。大概3个月没有记录过博客了，很多次打开之后懒得记录又关闭了。。。懒惰是魔鬼，大家不要像我学习????????????最近项目一直遇到一个问题，就是和svg有关的，svg虽然出来很久了但是坑还是很多的，我把我遇到的问题记录一下和大家分享～一. svg简介在 2003 年一月，SVG 1.1 被确立为 W3C 标准。参与定义 SVG 的组织有：Sun公司（已被Oracle公司收购）、Adobe、苹果公司、IBM 以及柯达。与其他图像
2021-06-01 18:03:33
1415
原创 前端开发兼容问题汇总
2020年5月13日 火辣辣％1 $ S一、高度计算问题-100vh不同浏览器处理机制不同pc端的浏览器就很简单，因为浏览器的内容区域是不包含上方导航栏的，此时的html的100vh=100%；但是移动端浏览器会包含顶部地址栏和底部按钮栏，不同的浏览器厂家处理的逻辑是不同的，现在测试的为：Safari，安卓和iOS手机的chrome，华为浏览器的100vh都是全屏，包括上下手机浏览器自己的bar，也是页面会被bar覆盖，此时内容区域=100vh-导航栏-按钮栏，但是导航栏和按钮栏高度不一致也不易获取，
2021-06-01 18:00:07
497
原创 svg文字路径textPath的问题
2020年8月23日 火辣辣％1 $ S如图所示：中间的一个表图是svg代码，可以动态输入内容按照指定格式排列的svg文字路径输入框输入的文字，让按照指定路径自动居中排列也可以采用css3方式：采用rotate，transform等属性操作，建议插件：arctext.jssvg方式：svg是有文字路径textPath属性的，可以让文字按照指定路径自动排列，建议svg插件snap.svg官网：http://snapsvg.io/国内比较好的一个中文网址案例：https://www.zhangx
2021-06-01 17:59:06
1150
原创 移动端最小字体设置失效问题
2020年10月10日 火辣辣％1 $ S直接说总结：移动端最小字体为12px（仅chrome有此限制），建议最小使用12px；如果设计稿中有小于12px的字体，按实际字号写css样式，如果超出最小字体，可以用scale进行缩放展示；iphone类移动设备不受最小字号限制；其它设备可能会受8px限制；说明：对于不同的手机和浏览器，支持的最小字体大小是不一样的，因此指定了小于手机的最小字体就会失效无法执行。需要注意的是，在html5文本中可能会更加明显，但是在svg中，由于svg是可以无损无限缩放
2021-06-01 17:56:14
2029
原创 js输入框字符宽度判断-已知字符串宽度/未知字符串宽度
2020年12月23日 火辣辣％1 $ S一、需求说明一串字符长度很好判断，this.text.length就拿到了，但是对于一个固定宽度的文本框，要求不能超过宽度，那么就要计算这行文本的宽度。汉字是等宽字符，但是数字和英文则宽度不一致，这里的建议是，以数字为单位，比如1，那么一行最多输入20的汉子，长度则为20，字母则要按照最宽的字符w去计算，数字则以5为单位去计算。二、解决方案情形一：已知的字符串宽度，根据要求截取固定宽度的字符串，比如我已经知道了一串字符串了，去截取固定的宽度方法一：Str
2021-06-01 17:54:19
903
原创 mac终端下SVN和Git命令行操作
整理供自己使用一、svn常规命令行参考文章1、将文件checkout到本地目录1 svn checkout path（path是服务器上的目录）2 例如：svn checkout svn://192.168.1.1/pro/domain3 简写：svn co2、往版本库中添加新的文件1 svn add file2 例如：svn add test.php(添加test.php)...
2019-12-18 19:46:37
574
原创 微信jssdk自定义分享问题总结
参考文章：火辣辣前端博客1 分享功能前提条件必须保证通过config接口注入权限验证配置成功需要将必备的数据配置成功，并且需要将你用到的签名注入在jsApiList数据里参考文章wx.config({ debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。...
2019-08-29 20:32:17
1618
原创 基于vue的圆形菜单栏组件
文章参考：http://huolalaweb.com/2019/07/05/vue-component-circle-panel/整个样式都是基于css3 得transform而实现得。每个扇形角度为360/12=30deg，当然，你不想做圆形也可以，公式就是 扇形角度=你想绘制得角度/扇形个数当你计算好每个扇形得角度时，需要将li元素倾斜，倾斜角度=90-扇形面积，我的这个倾斜角...
2019-07-05 15:32:13
5009
原创 vue安卓移动端，微信点击img被放大问题
参考文章：http://huolalaweb.com/2019/06/16/vue-android-img/在公众号里面嵌套的h5页面，我给img添加了点击事件，例如<img class="close-btn" src="./icons/close.png" @click="open">但是当我再安卓机微信上测试的时候，会先放大图片至全屏，然后再执行我的点击事件，iOS没有问...
2019-06-19 14:23:31
528
原创 vue router的总结--$router和$route
文章参考：http://huolalaweb.com/2019/06/19/vue-router/1 this.router和this.router和this.router和this.route的区别this.router是VueRouter的实例方法，当导航到不同url，可以使用this.router是VueRouter的实例方法，当导航到不同url，可以使用this.router是Vue...
2019-06-19 14:21:06
172
原创 前端面试总结
参考：火辣辣前端博客面试过程中遇到的问题，自己总结整理，当做一个自省和知识的梳理。一 css问题：1 浏览器内核以及优缺点？2 html的title和alt有什么区别？alt:不能显示图像时的用户代理，用来指定替换文字title:为设置该属性的元素提供建设性的信息3 行内元素？块级元素？盒模型？行内元素有：span,a,button块级元素：div,p盒模型：利用box-siz...
2019-05-05 22:24:03
105
原创 字符串中找最大值-一个面试题引发的一个文章
参考：火辣辣前端博客题目：写一个函数，输入一段合法的字符数组(n<1024)，请用JavaScript从字符数组中找出最大的数值，比如(asc23423v234)，得到的最大数值是23423。注意：数值为常用数值表达方式。（建议不要用正则，基本是死路）部分测试用例：1）输入asc23423v234，输出234232）输入pppp12bbbbbb12.31cccc，输出313）输入5...
2019-05-05 22:21:32
322
原创 js添加网页水印和three.js场景中加水印
参考：火辣辣前端博客我们在日常网页开发的时候，可能想给自己的网页或者canvas里面添加水印，增添个人标记，我这里分为普通静态html页面和threejs中3d场景里面添加水印功能。一 静态html页面添加水印你只需要在你的页面添加一个图片遮罩，通过绝对定位和z-index层级控制，就可以覆盖在你的内容上面，但是一个很重要的点是要设置pointer-events: none;//指定在什么...
2019-04-15 14:56:27
666
原创 JavaScript前端实用小函数
参考：火辣辣前端博客1、判断是手机还是pc端function IsPC() { var userAgentInfo = navigator.userAgent; var Agents = ["Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod" ]; var flag = true; for(var ...
2019-04-02 17:47:58
138
原创 js截屏以及three.js场景截屏
参考：火辣辣前端博客做这个功能都是半个月之前的事情了，没想到一直耽误却一直都没有写下总结，尴尬。。。。。来来来，说正事在手机端截屏完全不需要前端动什么脑子，但是在网页上截屏就很头疼了，我这里介绍两种情形，针对普遍和某一特殊功能需求1、js截屏插件html2canvas.js这个插件真的很好用，而且GitHub上的小星星也特别多，html2canvas官网 也给了详细的例子,最简单的就这...
2019-04-02 17:42:37
2174
原创 three.js场景中看不到模型/看不到阴影
参考：火辣辣前端博客一、three.js渲染的场景中看不到模型的几种可能：1、未渲染你可能并未加载渲染函数，或者未将场景渲染出来，虽然这个可能性很小很小，但初期我真的犯过……function animate() { requestAnimationFrame(animate); renderer.render(scene, camera);}2、场景中未加灯光未加...
2019-04-02 17:36:33
4728
原创 zabbix的群组和主机的select二级联动
zabbix的群组和主机的select二级联动，ajax异步处理，先从数据库获取群组数据，当点击群组时，再从数据库加载主机通过zabbix官方给出的API接口，允许通过JSON RPC 协议创建、更新和获取zabbix对象如，hosts, items, graphs and others。或者执行其他任务，官方API接口auth通过本地存储已经存储在本地了，不然需要先登录，获取通行证{
2017-11-23 17:27:23
591
原创 表格内自定义多选按钮样式，实现全选功能，纯表格内容js分页
修改多选按钮默认样式，使input隐藏，添加UI设计给你的样式图片到标签i中，设置为背景图片。因为CheckBox默认样式是没有办法修改的 在表格里面实现按钮的全选，点击标题栏，实现全选，或者点击表格每一行，也可以选中这一行我们只根据UI给的设计图写的前台界面，没有后台数据，所以数据我是通过纯js循环添加的，表格的分页也是根据这个来分页的，与后台数据无关，就是纯js代码。可以上一页下一页首页尾页
2017-11-14 17:08:14
1837
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人